忍者ブログ
11
月*<<
  • 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
  • >>

  • 「犬夜叉」をこよなく愛し「殺りん道」を極める日記@ネタバレあり
    Site/A/ N
    ×

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

    ■テンプレート編集/修正または新規作成ページでの各カスタマイズの場所はこうなっている


     BODY 

     TOP 

    Entry

    Prugin

    CALENDAR






    COMMENT

    TRACKBACK

    COMMENT FORM




    まずはこれにそって各配色を設定。



    ■次いでブログサイズを変更。

    ↓赤い枠で囲った部分のように追記。
    パソコンの解像度1024にあわせた(つもり;)で、1005px指定。
    100%指定にすると、TOP部分に背景を固定で入れた場合、解像度によってデザインが崩れてしまう。
    リピート指定なら%指定でも良いと思う。

    [追記]下記には記入されてないが、height:100%;を入れないとブロックの下に余白できて背景が丸見えになってしまう。
    以下の部分意外に、CSS内、body、及びプラグインブロック、記事ブロックの三箇所に記述したほうが良い。
    縦要素はbodyにも必ず入れないと指定が届かないとのこと。(管理人調べ)



    ここを弄ると必然的にCSSのTOPブロックと記事ブロックの幅も変えなければならない。
    (CSSはカスタマイズページ右下の欄)

    【】はCSS内記述箇所↓

    ・TOPブロック用デザイン

    【/*一番上のブロック(タイトルが書かれる場所)の設定*/】
    のwidth:を同じく1005px指定にするか、こちらは100%指定にしても大丈夫らしい。

     
    ・記事ブロック用デザイン

    【/*記事繰り返し処理全ての部分の設定*/】
    のwidth:を785pxに指定。

    ※プラグインブロックの幅がデフォで220px設定になっているのが前提。
    単純に785(記事ブロック)+220(プラグインブロック)=1005(全体ブロック)と言う考え;

    ※プラグインブロックを両サイドにした場合(自分でプラグインブロックを増やした場合)
    記事ブロック600+左プラグインブロック220+右プラグインブロック185=1005



    ■大まかなサイズが整ったら次はブログの位置設定。ブログの中央揃え

    プラグインの位置設定は左右選択式になっているので簡単だが、ブログ全体の位置設定は各自で記述しなければならない?ようだ。

    CSS内記述に下記のように追記




    あとはもう、各詳細は上記の要領でCSS内に記述していくほかない。
    大体は幅や高さの設定、任意に余白(padding:設定)設定、フォント関係を追記したりする程度ですむ。
    逆に言えばサイズと余白とフォント関係の記述さえ基本を知っていればできるということだ。

    CSS内に場所が書かれているので、プレビューしながら弄ってみるとわかりやすい。


    ■HTMLの設定

    カスタマイズページ右上の欄がHTMLになっている。
    サイトでも使っているタグを入れてみた。
    主にmateタグだったり、bodyタグ内に入れるタグだったり。


    ■使用背景画像

    背景に使用する画像は【参照】からアップロードしてもよし、すでに管理画面からアップロードした画像を【ファイル】から検索するもよし。

    top使用画像 1005x120
    blogtopback.jpg





    タイトル使用画像 755x30 現在使用中は560x30

    blogtitle2.jpg





    記事ブロック使用背景 418x100
    blogback.jpg






    /*記事本文が記載される部分*/
    background-image:url('http://file.*****.blog.shinobi.jp/***.jpg');
    background-position:right bottom;
    background-repeat:no-repeat;



    PR
    この記事にコメントする?
    お名前
    タイトル
    文字色
    メールアドレス
    URL
    コメント
    パスワード   Vodafone絵文字 i-mode絵文字 Ezweb絵文字
    この記事へのトラックバック
    この記事にトラックバックする:
    ブログ内検索
    最新コメント
    返信済みは鉛筆マークが付きます
    [05/31 Robertmr]
    覚 書
    順不同
    ・13939*hitキリ梓さま
    ・異族(完結)
    ・花紋茶寮様へお祝絵
    ・むふふな捧げ物絵(笑)
    ・6万キリ父x母小説
    ・10万hit記念
    ・拍手御礼各種
    ・セーラー兄
    (一体いつのネタだ;)
    最新トラックバック
    エコる
    ググるもとい、エコる(笑)
    ↑こちらで検索すると環境保護への貢献となるです
    バーコード
    忍者ブログ [PR]