忍者ブログ
写真と雑記と倹約と
[8]  [7]  [6]  [5]  [4]  [3]  [2]  [1
×

[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。

忍者ブログは今ひとつカスタマイズの方法が詳しくないので
備忘録を兼ねて残してみる。

既存のだと写真が大きくてレイアウトが乱れてたので、
とりあえずデフォルトのものをちょこっとアレンジすることに。

新規テンプレート作成からデフォルトのものを出して
まずはプレビュー表示にてレイアウトを確認。

blog-sample1-1.gif

はい。↑こんなかんじです。色々と直したいところが沢山ありますが
まずは簡単な所からやっていきます。

その前に編集画面を簡単に説明を。
(といっても私自身あまり分かっていないのですが)



 内容は大体こんな感じです。
1.書式や背景などの設定用のメニュー
 文字の色や大きさ、背景や罫線の設定などを簡単に設定できます
2.HTMLのソース
 HTMLを直接編集する時に使います。
3.スタイルシート 
 1.のメニューではできないさらに細かいスタイルの設定
 メニューの位置を右や左に変更したり、メニューの幅など色々設定できます。
 もちろん1.と同様に文字の色や大きさも変更できます(面倒ですが)
4.プレビュー画面 ←(現在のレイアウトの確認するのに使います)
 「プレビュー表示」でこのように画面の下半分にプレビューが表示されます。
 「プレビューを閉じる」でこの部分が表示されなくなります。

とりあえず、今日は全体とリンク部分の文字色と
タイトル部分の余白が大きいのでこれを少し小さくします。

シンプルが好きなので、リンクの下線や色を本文の文字色と同じにします。
(但し、リンクにカーソルが合わさった時のみブルーに変更)
タイトルを太字にしてサイズを大きくします。
「文字サイズ: 」などの項目の隣の欄に文字が入るように
▼(プルダウン)で選択したり、文字を直接入力したりします。

ちなみに今回の設定はこんな感じ。

■BODY  ブログ全体の書式の設定をします
文字サイズ:  12px
文字色:  #666666  色ボタンをクリックすると色見本が出るので好きな色をクリックする。(設定しないと黒)
 リンク用文字色:  #666666  色ボタンをクリックすると色見本が出るので好きな色をクリックする。(設定しないと青色)
リンク用装飾:   none 「何もしない」にするとリンクの下の下線が消えます。
リンク用文字色(カーソルが合わさった時) #66CCFF  設定しないとリンク用文字色と同じになります。

■TOP  一番上のタイトルが入ってる部分の設定をします
タイトル文字: サイズ   20px   太にチェック
高さ:   100px (大きくすればするほどタイトル部分のスペースの高さが増えます。)

プレビューを見るとこんな感じになりました。
背景とか文字色が元とそんなに変わらないからそんなに変わらないかな。


blog-sample1-2.gif
PR
カレンダー
09 2017/10 11
S M T W T F S
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30 31
フリーエリア
最新コメント
最新トラックバック
プロフィール
HN:
cano
HP:
性別:
非公開
バーコード
ブログ内検索
P R
忍者ブログ [PR]