初心者でもわかるVaster2のカスタマイズ方法とbloggerの設定の記事リスト

超初心者である私が実際に行ったBloggerのテンプレート「Vaster2」のカスタマイズに関する記事リスト。
CSSもHTMLもほとんど分からないので、非常に初歩的な内容になっています。

検索のおかげでカスタマイズができているといっても過言ではないので、他のブログへの記事のリンクがあり、私の記事だけでは解決しないものもあります。
（他のブログの記事をさらに解説したような内容もあります）

全般的に、「CSSやHTMLとして正しいかはわからないが、こういう変更をしたら動いた」という修正方法なので、もしより正しい修正方法などがありましたら教えていただけると嬉しいです。

また、カスタマイズの確認はすべてWindows10 / Google Chromeでのみ行っています。
その他のOS・ブラウザでは確認していません。

Vaster2のダウンロードページ：
Vaster2|レスポンシブ対応済みのblogger日本語テンプレート（トーマスイッチ）
※2018年12月現在、ワードプレスのプラグインのアップデートに対応した修正が行われていないため、ダウンロードができなくなっています。

現在のこのブログについて

現在このブログはWordPressで運営しており、BloggerのVaster2は使用していません。

以前のレイアウトを再現したサイトは以下になります。
あかりlogのレイアウト再現用

一部アドセンス関係など表示できない部分は再現できておらず、サイドバーやグローバルナビはリンク切れが多発していますが、雰囲気を見ることはできるかと思います。

また、基本的に今後Vaster2のカスタマイズの更新予定はありません。

Vaster2 カスタマイズ

カスタマイズ作業関係

初心者のVaster2のカスタマイズ方法（GoogleChromeデベロッパーツール）

トップページ・記事リスト関係

記事リストの枠の変更方法（影を消す・枠線の色を変える）

ブログの一番上の部分（ヘッダー）の背景を画像にする

ブログの名前とブログの説明を中央に寄せる（センタリング）

記事リストの画像の縦横比を変えない方法 

読み込み中にヘッダーナビゲーションの内容を表示しない方法

スマホの記事リストに説明文をつける 

記事リストを二列に配置する

検索結果の表示を「内容 | ブログ名」に変更する

アドセンス関係

Bloggerでアドセンスをダブルレクタングル表示する方法（超初心者向け）

記事ページに関連コンテンツユニットを加える

メニューバーの下にリンクユニットを入れる

ブログ本文関係

スマホ画面で画面を中央に表示する方法

ブログ全体のフォントを変更する方法


スマホでみたときの左右の余白を変更する

サイドバーに任意の順番でカテゴリを並べる


SNSボタンのサイズを変更する


コメントのフォント（文字の大きさ、色）を変更する方法

変更したが更新予定なし

記事本文のパンくずリストに使われているタグを複数表示するようにする

この変更は、理想的だと思ったテンプレートを参考にして変更したためコピーのような内容になってしまっています。
そのため、このブログでは具体的な変更方法を紹介することができません。

変更試行錯誤中

記事の移動をスムーズにできるようにする
これは実はまだどこを修正していいのかすらわかってないのですが、どうも記事を移動するページがうまく動いていないところがあるような気がするのです（Previous / Nextのボタン）。
あとたくさんのページをさかのぼるときに便利な、1・2・3…と番号のついたボタンも設置したいのですが、以前やって失敗したのでゆっくり時間が取れるときにやろうと思っています。

各カテゴリの記事数を表示する
今のHTMLを使って表示したカテゴリの表示方法はとても気に入っているのですが、記事数が表示されていません。これを表示できるようにしたいのですが、HTMLとかCSSいじったくらいではどうにもなりそうにないので、お手上げかなぁと思っています…が一応諦めていません。
システム的にはがらっと変わるような方法でも表示方法がかわらなければいいので、何かいい方法ないかなあと考えています。

Bloggerの設定

Bloggerのラベル別ページを検索に反映するためにrobot.txtの記述を編集

エックスドメインで取得した独自ドメインをBloggerで使用するための設定方法

Bloggerの独自ドメインサイトをSSL化（HTTPS有効化）対応する方法