ホームページ制作・SEO対策を通じて集客向上↑売上UP↑ならCyberAccel-Advisors
電話番号: 03-3986-2773
電話番号: 03-3986-2773
ホームページ制作、SEO対策 サイバーアクセル・アドバイザーズＴＯＰ » ブログ » webコラム» アメブロカスタマイズ フリースペースを、他の項目のように表示させる
投稿日: 2014/06/20 投稿者:webコラム
みなさん、こんにちは♪
今回のアメブロカスタマイズは、『フリースペースを他の項目のように表示させる』技です！
フリースペースは自由にいろんなことを書ける楽しいスペースです。
でも、入力してＯＫしたら、あれれっ！？
ここだけ表示が他のところと違う！
なんてことにならないように、
フリースペースにも他と同じように表示させちゃいましょう！！
表示ができるように、まずはＣＳＳのところに書き込みをしにいきます。
ＣＳＳ編集画面の一番したのところに下記のコードを貼り付けます。
/*フリースペース*/
.freespaceArea.subModule{
margin:0;
}
次にフリースペース自体を作りに行きましょう。
フリースペースのページをあけてベースとなる、下記のコードをまず貼り付けましょう。
<div class="skinMenu"><div class="skinMenu2"><div class="skinMenuHeader"><span class="skinMenuTitle">☆★タイトル★☆</span></div><div class="skinMenuBody">
☆★本文★☆
</div></div></div>
☆★タイトル★☆とある場所は
ブログ画面でプロフィールや最新の記事などタイトルが入っている部分になります。
次の☆★本文★☆という場所には内容が入れていきましょう。
ためしにタイトルにアメブロカスタマイズ
そして、本文にフリースペースを他の項目のように表示と入れて
実際に表示してみる・・・。
ＣＳＳが編集できないものであっても
同じようにフリースペースで作成すれば他の表示と合わせることができます。
かわいいデザイン、クールなデザインの中にも
フリースペースもマッチする素敵なブログになりますね。
また店舗ブログを運営されている場合などは、サイドバーに店舗情報や営業時間を表示させると
お客様の目につき、良い宣伝になりますね。
フリースペースに書き込んで保存をした後
ブログを見に行くと、表示が崩れていることがあります。
その場合は、コードのどこかに不必要な改行が
入っていることが多いので、改変できない状態であれば
コードの間は出来る限り触らないのが無難でしょう。
万が一、間違って触ってしまってもいいように、その都度保存していくようにするか、
表示がきちんとできている状態のコードは、テキストファイルなどで保存しておくといいですね。
我社のマスコット『弁慶』です。
名前の由来：忠実な番犬
主な仕事：マスコットキャラとして認知度UP↑
不得意：電話
しゃべりが苦手なので、コンタクトはこちらから
我社のキャラクター「長フチ様」がユーザーに変わり、聞きづらい疑問を直球で投げかけるQ&A式コンテンツ。強面の顔からは想像も容易いほどのおバカさんが、弊社スタッフと対談します。
Copyright(C)2014 ｜ ホームページ制作・SEO対策を通じて集客向上↑売上UP↑Cyber Accel-Advisors. All Rights Reserved.
