アメブロカスタマイズレッスン後記
今夜最後のレッスンはWordPressでもC言語でもなく
アメーバブログのカスタマイズを扱いました。
アメブロをサイト風にするには?
まず、グローバルメニューを追加することですね。
アメブロにはグローバルメニューがありませんが、
HTMLを自由に記述できる「フリースペース」という
エリアがあり、サイドバーに配置することができます。
グローバルメニューのHTMLタグをフリースペースに
記述し、スタイルシート(CSS)を使って無理やり
ヘッダー画像の真下へ移動させると、あたかも最初から
その場所にグローバルメニューが付いているかのような
表示にすることができます。
具体的なテクニックは?
グローバルメニューを囲むラッパーとなる<div>を用意し、
この<div>に対して position: absolute; を指定します。
position: absolute; を指定したブロックは、その外側を
囲むブロックのうち、最初に position: relative; が指定
されたブロックの左上隅を x, y 座標の原点として、
top と left で絶対座標を指定した場所に表示されます。
文章で書くとイメージが掴み辛いのですが、
初めてアメブロをカスタマイズする生徒さんに、
スカイプの画面共有と、操作のデモンストレーションで
しっかりと理解していただけました。
アメブロのカスタマイズを身につけたい方へ
オンラインレッスン受付中です。
下記のご案内をクリックしてお気軽にご相談ください。
完全マンツーマンのオンラインレッスンのご案内
2015年、パソコンジャンル評価1位
≫ ページ内の「先生に聞いてみる」ボタンでお気軽にご相談ください。
※平日の夜は予約が埋まりやすいのでお早めにご相談ください。
※Facebookでもプログラミング&コーディングの本質を投稿しています。
Facebook(友達限定のプライベート投稿で本質的な情報発信中)