アメブロをPCだけでなくスマホ用画面もcssカスタマイズするための7ステップ 2016年秋

hirosemari
「アメーバブログを」「cssを利用して」「PCから見た記事や画面だけでなく」「スマートフォンから見た記事や画面も」カスタマイズしたい人向けのまとめです。

cssカスタマイズできるデザインを選ぶ

まずは2016年現在「新css」と呼ばれているcssカスタム可能デザインについて知りましょう

cssカスタマイズ

スマホで表示されないPCのサイドバー情報を各記事に挿入

スマホではそもそもサイドバーの情報が一切参照できないため、みなさん苦肉の策で情報を挿入しています。

ブログトップメッセージボードカスタマイズ

PCではトップ記事の上に、スマホではトップメニューのボタンクリックで表示されます。

記事下定型文を スマホの時にだけ表示して パソコンではサイドバーがあるので非表示にする

スマホ向けに、外部cssを連携させる

スマートフォンの挙動を、パソコンで確認する

chromeの拡張検索をする、スマホのchromeから情報を入手する、といった内容が。

サンプル


https://matome.naver.jp/odai/2147481679945922501/2148646415892618003

PCから見た時、スマホから見た時で、見え方が異なります。
アメブロの広告に見える左の広告も、自分が設定したものになります。

https://matome.naver.jp/odai/2147481679945922501
2017年04月25日