Blogger自作テンプレートの作り方

Bloggerのテンプレート（テーマ）を自作する場合に一番最初にやることは、Bloggerのテンプレートの編集に失敗すると動かなくなるので、テスト環境を作ることです。また、初期設定も確認します。

1. Bloggerテスト環境の作り方
2. Blogger初期設定で変更する項目一覧
3. Bloggerおすすめのテンプレート

Bloggerの公式テンプレートや配布されているテンプレートは初心者でも使えるように作られています。自作するなら初心者向けの機能はいらないので削除します。

Bloggerの「レイアウト」の「テーマデザイナー」で色や大きさなどを設定できますが、直接cssで書けばいいので、使わないようにします。

1. Bloggerのcssの便利な使い方

使わないガジェットも削除します。できるだけガジェットを削除して、自作できないものだけガジェットを使うようにします。

1. Bloggerで必要なガジェットといらないガジェット

自作する場合はBloggerのテンプレートを編集することになりますが、Bloggerの文法は特殊です。

1. Bloggerテンプレートの文法
2. Blogger変数一覧
3. Blogger標準javascriptのログ一覧

Bloggerのテンプレートの文法は特殊なので、できるだけjavascriptで処理するようにします。

1. Bloggerのjavascriptの便利な使い方
2. Blogger標準javascriptを使用せずガジェットを使う

Bloggerはfeedを使えば、データを取得することができます。

1. Bloggerのfeed一覧
2. Bloggerのfeedで取得できるもの一覧
3. Bloggerのfeedの結果一覧

Bloggerは軽いSVG画像アイコンが用意されているので、アイコンはSVG画像アイコンを使います。

1. BloggerのSVG画像アイコン一覧

Bloggerのテンプレートの変更例

1. Blogger自作HTMLサイトマップ
2. Blogger自作テンプレートのキャッシュ高速化
3. Blogger自作最新記事と関連記事リスト
4. Blogger自作最新記事と関連記事リスト・キャッシュ高速化
5. Bloggerアーカイブを年月表示に変える
6. Blogger自作アーカイブリスト・キャッシュ高速化
7. Blogger自作ラベルリスト・キャッシュ高速化
8. Blogger自作おすすめリスト・キャッシュ高速化
9. Blogger自作次ページタイトル設定
10. Blogger自作次ページタイトル設定・高速化
11. Blogger自作次ページタイトル設定・キャッシュ高速化
12. Blogger検索結果を公開日順10件にする
13. Bloggerラベル一覧表示を10件にする
14. Blogger自作ページネーション
15. Blogger自作ページネーション・高速化
16. Blogger自作ページネーション・キャッシュ高速化
17. Blogger自作SNSボタン
18. Blogger自作SNSボタン・キャッシュ高速化
19. divを使わないレスポンシブcss
20. aタグは親要素いっぱいクリック可能にして文字だけ囲む
21. aタグはSEO対策を考えるなら省略せず非表示しない

SEO対策

1. Bloggerで設定できるサイトマップ一覧
2. GoogleサーチコンソールのSEO対策でできること
3. クロール頻度の確認とクロールの統計情報の意味
4. アドセンス遅延読み込みは収益が少なくなるかもしれない
5. インデックスされないときはurl変更よりパラメータ追加