国内でも大人気のFC2 ブログ。カスタマイズの自由度は国内のブログでも群を抜いています。本書は、「公式テンプレートを自分なりに変えたい」と思っているFC2ブログユーザーに向けて、HTMLやCSS、さらにFC2ブログ独自の変数タグを使い、ブログデザインのカスタマイズ手法を解説する書籍です。
人気の公式テンプレートを元に、サイドバーやメニュー、記事の表示、そして人気外部サービスの追加など、ユーザーニーズを汲んだカスタマイズ手法を紹介します。「ここの見せ方を凝ってみたい」と考えているFC2ブログユーザーが、「これは使える」と納得する、そんな1冊です。
Chapter1 FC2ブログのデザインを変えるには
01 FC2ブログの特徴
02 テンプレートの種類
03 ページの種類とテンプレート
Chapter2 HTMLとCSSの基本
01 HTMLの基本
02 CSSの基本 03 JavaScriptの利用方法
04 画像の加工
05 カスタマイズ後の確認方法
Chapter3 FC2ブログのカスタマイズの基本
01 カスタマイズ方法とテンプレートの適用
02 FC2ブログのテンプレートと独自のテンプレート変数タグ
03 テンプレート変数タグの使い方
04 HTMLCSSの修整方法
05 ファイルのアップローと方法
Chapter1 カスタマイズに利用するFC2公式テンプレートの紹介
01 公式テンプレートの種類
02 各公式テンプレートのサンプル画面
03 携帯とスマートフォンの公式テンプレートについて
04 ダウンロードサイトのご案内
Chapter2 プラグインでカスタマイズしよう
01 プラグインの基本
02 カレンダーを追加する
Variation 表示順番を変更する
03 最新記事プラグインを移動する
04 メールフォームを追加する
Variation タイトルや項目名などを変更する
05 カウンターを追加する
Chapter3 ブログ全体を変えてみよう
01 ブログ全体の見た目を変えるカスタマイズの基本
02 背景色を変える
Variation 背景の色や画像を変える
03 背景画像を追加する
Variation 画像を繰り返す
04 文字の大きさや色、行間などを変える
Variation 文字の色を変更する
05 横幅を変える
Variation 左サイドの幅を拡げる
06 プラグインメニューの位置を移動する
Variation プラグインカテゴリ3をカスタマイズ
07 右メニューを左へ移動する
Variation 左メニューを右へ移動する
08 2カラムを3カラムに変える
Chapter4 ヘッダー/フッターを凝ってみよう
01 ヘッダー/フッターのカスタマイズの基本
02 ブログの名前の位置を変える
Variation 背景色や文字色の変更
03 ブログの名前を非表示にする
Variation Powerd by FC2ブログを非表示にする
04 ヘッダーの画像を変える
Variation ヘッダーの高さを変更する
05 タイトルを画像にする
Variation HTMLでヘッダーに画像を指定する
06 ヘッダーにメニューを設置する
07 リンクやバナーを追加する
Chapter5 サイドメニューを凝ってみよう
01 サイドメニューのカスタマイズの基本
02 サイドメニューの背景色を変える
Variation 3カラムの場合
03 サイドメニューに背景画像を追加する
04 メニュータイトルの装飾を変える
05 メニュータイトルを画像にする
06 メニューリストの先頭に画像を追加する
07 メニューリストのリンク色を変える
Variation カーソルが重なったときの背景色を変える
08 月別アーカイブをプルダウンニューにする
09 折りたためるメニューにする
Chapter6 メイン部分のデザインを凝ってみよう
01 メイン部分のカスタマイズの基本
02 記事タイトルの文字サイズを変える
Variation 記事本文の文字サイズを大きくする場合
03 記事タイトルに背景色を変える
04 記事タイトルの装飾を変える
Variation 記事タイトルのアンダーラインを外す
05 記事本文の背景に色を付ける
Variation 記事本文に枠を付ける
06 記事本文に背景画像を追加する
Variation 記事フッターも背景画像を追加する
07 記事投稿日時の表示を消す
Variation 投稿日時の書式を変更する
08 関連記事を表示する
Variation テンプレートをカスタマイズしない方法
09 記事下にバナーを追加する
Variation 記事のすぐ下(枠の中)にバナーを表示する
10 記事本文にスリット的なボーダーを加える
Variation 公式テンプレート「winter_girls」の場合
Chapter7 ページ別にもっとカスタマイズしてみよう
01 ページ別カスタマイズの基本
02 インデックスページだけにメッセージを表示する
03 インデックスページを記事タイトル一覧にする
Variation 該当ページのみとそれ以外を表示するテンプレート変数のブロックタグ
04 カテゴリアーカイブページに記事タイトル一覧を表示する
05 コメントフォームのURL入力欄などの表示を変える
06 記事やタグの検索結果ページをカスタマイズする
Variation タグ検索結果ページをカスタマイズする
07 ページナビゲーションに記事タイトルを表示する
Variation 「ホーム」をブログ名に変更する
08 パンくずリストを追加する
09 SEOのタグをカスタマイズする
Chapter8 ソーシャルネットワークサービスを組み込んでみよう
01 ソーシャルサービスとの連携について
02 記事下に[ツイート]や[いいね!]ボタンを追加する
Variation ボタンの位置を変更する
03 記事下に[mixiいいね!]ボタンやGoogleの[+1]ボタンを追加する
Variation Googleの[+1]ボタンを追加する
04 メニューに自分のツイートを表示する
05 Facebookのコメント機能を追加する
Chapter9 携帯向けブログを作ろう
01 携帯用テンプレートの基本
02 携帯用公式プラグインメニューをカスタマイズする
03 背景色、文字色を変える
04 インデックスページにヘッダー画像を追加する
Variation インデックスページ以外を変更する
05 記事タイトル一覧や記事表示ページをカスタマイズする
Chapter10 スマートフォン向けブログを作ろう
01 スマートフォン用テンプレートの基本
02 背景色、文字色を変える
Variation グラデーション部分の色を変える
03 インデックスページにヘッダー画像を追加する
Variation ヘッダーに背景画像を追加する
04 オリジナルメニューを追加する
05 [ツイート]と[いいね!]ボタンを追加する
Variation [いいね!]ボタンを追加する