超級グルメ

クックパッドには載っていないような手抜き料理、のんだくれのオヤジでも作れる超簡単なおつまみレシピ、素人丸出しの燻製作り、コンビニや100均の食品のちょい辛批評などを扱っています。

2015 09/21

seesaaブログの文字の大きさや色を変更 

2015年9月時点の最新版

スタイルシート(css)で文字の大きさや色を簡単に変えられます。

説明用に使用したテンプレートは

「シンプルD.パステルピンク 右カラム」ですが、

Agent (Map)
Time Line Green
シンプルA
シンプルB
シンプルC
シンプルD

は同じ感じの作りになっています。


紹介するのはPC版のみの変更手順なので、

スマホ版の文字の大きさや色のカスタマイズは、

別途スマホ版のスタイルシートの変更が必要です。






スタイルシート(css)の編集画面の出し方


HTML CSS画面の出し方

デザイン→デザイン設定→テンプレート名

をクリック





スタイルシート編集

カスタマイズする際は、自己責任で行って下さい。





基本的な文字の大きさを変える


シーサブログのテンプレートシンプルDの319行目

324行目あたりにある

Font-size: 14px;が基本的な文字の大きさです。

数値(14)を希望の文字サイズになるように

大きくしたり小さくしてみて下さい。

例えば、

今より小さくしたい場合は、12にしたり

今より大きくしたい場合は、16にしたり


文字の色を変える場合は、

321行目あたりにある

color: #444;

の#444をCSS色見本で見つけた6桁または3桁の数値と入れ替えてください。

例えば、

赤  #FF0000
青  #0000FF
黄  #FFFF00
黒  #000000
アルファベットは大文字、小文字どちらでもOKです。




プレビュー(確認)


トップページのプレビュー

数値を変えたら、

プレビューで確認してみます。

良かったら、

「バックアップして保存」か「保存」を押します。



個別記事の文字の大きさを変える(追記)


20160916011.png

「記事本文」や「.article-body」を探して、

14pxのところを変えてみてください。





ブログタイトルの大きさを変える


シーサブログのテンプレートシンプルDの482行目


384行目あたりにある

Font-size: 32px;はブログタイトルの大きさです。

数値(32)を希望の文字サイズになるように

大きくしたり小さくしてみて下さい。


文字の色を変える場合は、

390行目あたりにある#444を変えます。







記事タイトルの大きさを変える


シーサブログのテンプレートシンプルDの512行目

520行目あたりにある

Font-size: 20px;は記事タイトルの大きさです。

数値(20)を希望の文字サイズになるように

大きくしたり小さくしてみて下さい。


文字の色を変える場合は、

526行目あたりにある#444を変えます。





日付の大きさを変える


シーサブログのテンプレートシンプルDの492行目

494行目あたりにある

Font-size: 12px;は日付の大きさです。

数値(12)を希望の文字サイズになるように

大きくしたり小さくしてみて下さい。


文字の色を変える場合は、

493行目あたりにある#444を変えます。





カスタマイズ前に戻す


カスタマイズの戻し方

変更が上手く出来なかったら、

「初期値に戻す」にチェックをいれて

「保存」を押せば元通り(初期値)になります。





※筆者はHTMLの事をよく知らないド素人です。

 検索上位に表示されているシーサブログの文字サイズの変更方法が役に立たないので、

 試し試しで書きました。

 助言があればお願いします。

関連記事

(6)

後の記事「ニュータッチのとん汁うどんを食べてみました。

前の記事「おつまみネギチャーシューの作り方

COMMENT

  • No.139 No title

    シーサーブログの文字の変更しようと検索しても
    どれも分かりづらく情報も古かったりと・・・
    なかなか出来なかったのですがこちらの記事は
    とても分かりやすく参考になりました^^;

    簡単に変更出来ました!!
    ありがとうございました!!!

    投稿者:juri 2016/08/17 (水) 05:07
  • No.140 こんばんは

    .
    コメントありがとうございます。

    お役に立てて、嬉しい!

    .


    投稿者:いちごちゃん 2016/08/17 (水) 23:16 [ 編集 ]
  • No.152 No title

    記事の文字の大きさを調べてたら辿り着きました。

    うーん、トップ画面に表示された文字の大きさは
    調節出来るのですが、個別に記事を開いた時は
    文字は調整出来ていないのです。

    記事内の文字の大きさは「大きい」「小さい」
    だけは元の設定で出来るけど、その大きさ以外に
    調節して使いたいのですが、いくらやっても
    上手くいきません・・・・

    投稿者:レオ 2016/09/16 (金) 00:44
  • No.153 こんばんは

    .
    あっ、

    個別記事の大きさが抜けていたかも。

    おそらく、

    .article-body

    のところのFont-size: だと思います。

    明日、確認できしだい追記してみます。

    ありがとございました。
    .

    投稿者:いちごさん 2016/09/16 (金) 01:25 [ 編集 ]
  • No.217 ありがとうございます

    大変助かりました。
    無事変更することができました。
    ありがとうございました。

    投稿者:みみ 2017/05/14 (日) 12:13
  • No.218 Re: ありがとうございます

    お役に立てなりよりです。

    投稿者:いちごさん 2017/05/17 (水) 20:54

MESSAGE

非公開コメント

Top