アメブロdeアクセスアップ

アメブロ基本カスタマイズ CSSはどこにある? | アメブロのテンプレートやツールを使って、アクセスアップする方法やアメブロカスタマイズの方法をご紹介します。


テーマ:CSSでカスタマイズ

アメブロの基本のカスタマイズは、
まずアメブロの構成を知ることから始めます。

だからといって、全部を把握するのはちょっと無理!!

でも、スタイル編集するところくらいは、わかっておいた方がいいです。

 

 

 

 

 

ブログって、HTMLとCSSの組み合わせ(大まかですが)で、
構成されているんですね。

 

だけれども、アメブロの場合はHTMLの部分は、
いじれないようになっているんです。
(他の無料ブログはいじれるものもありますが・・・・)

 

 

だから、いろんなところをいじりたくても、
出来ない個所が多々あります。

 

 

でも、基本的にみなさんが気にしている部分って、こんな感じかと。

 

  • フォントの変更
  • 背景色
  • ヘッダー画像
  • 記事幅
  • カラム
  • プロフィール

 

上記は、HTMLをいじるというより、スタイルに関わるところです。

 

 

スタイルに関わる部分というのが、CSSに当たります。

 

 

このCSSなんですが、アメブロの場合は、
カスタマイズ可能なテンプレートでしか編集はできません。
(残念ながら!!)

 

ですので、CSSの編集が可能なテンプレートを
最初に設定して、あとからいろいろとCSSを変更するのが、
カスタマイズの基本となります。

 

ですが、他のテンプレートはダメなんじゃん!!
ということは、ありません。

 

CSSはとっても自由です。

 

 

アメブロの場合は、フリースペース・フリープラグインに、
CSSで変更したい箇所をコードで記述すれば、
スタイルの変更が可能となります。

 

ただし、このフリースペースやフリープラグインも、
文字数制限があるので、たくさん記述すると、
使えなくなるので、ご注意を!!

 

以前にも書いているんですが、
このフリースペース・フリープラグインの文字数制限を、
回避する方法もありますので、ぜひ参考にしてくださいね。
【アメブロ フリースペースもダイエットする!!】

 

それでは、カスタム可能なデザインで、
CSSがどこにあるのかを、説明しますね。

 

 

まず【マイページ】より【デザイン変更】をクリック。

 

 

 

その時に、自分の今使っているテンプレートが
表示されるかと思います。
こんな感じね。

デザインの編集画面

 

私の場合は、カスタマイズ編集可能デザインにしてあるので、
上記のようですが、変更していない場合は、
デザインスキンを変更してくださいね。

 

 

この画面の下の方に、変更する場所がありますので、
【カスタム可能】をクリック。

 

選択するデザインスキンは、【CSS編集用デザイン】です。
こんな感じね。

 

デザインスキンの選択

 

 

このデザインは、CSSの編集ができますので、
カラム数を決めて適用をクリックしてくださいね。

 

適用ができれば、CSS編集が可能となりますので、
CSSの編集画面に入ってみましょう。
こんな感じね。

 

CSS編集画面へ

 

 

上記ボタンをクリックすると、画面が変更となり、
画像のアップロードする場所の下の方に、CSSのコードが書かれている場所があります。
こんな感じ。

CSS編集画面

 

ここが、【CSSの編集】する場所ということになります。

 

 

CSSのコードを追加・編集することで、
基本的なスタイルの編集が実行できるということです。

 

 

コードなどは、難しいかも???
って敬遠しないで、このブログでもそうですが、
カスタマイズについて書かれているブログって、
たくさんありますので、ぜひとも挑戦してみてくださいね。

 

 

 

もし、解らない部分があったら、メールをくだされば、
カスタマイズに対してのリクエストにもお答えしたいかと思っています。

 

 

 

今年は、アメブロのカスタマイズに挑戦!!
という方も、ぜひ参考にしてくださいね。

 
 
 

テンプレートデザイン・カスタマイズのこと、アクセスアップのこと、
アメブロのことならお任せあれ!

Copyright © アメブロdeアクセスアップ All Rights Reserved.