Bloggerで始める無料ブログの開設・カスタマイズ方法
 |
 |
Bloggerで始める無料ブログの開設・カスタマイズ方法
記事概要
この記事は、Googleが提供する無料ブログサービス「Blogger」を使用したブログ開設とブログカスタマイズに関する備忘録です。これからブログを始める方にとって、この情報がお役に立てれば幸いです。
このような方におすすめです
- これからブログをはじめる方
- どのブログにしようか迷っている方
- Bloggerの使い方で困っている方
- Bloggerでブログをカスタマイズしたい方
Bloggerとは？
Bloggerは、Googleが提供する無料のブログサービスで、簡単な操作でブログを開設できるのが特徴です。初心者でも扱いやすく、さまざまなデザインテンプレートが用意されているため、立ち上げた瞬間からすぐにオリジナルのブログを始めることができます。また、Googleアカウントがあればすぐに利用できるため、新たにアカウントを作成する手間もありません。
Bloggerを始めるためのステップ
STEP1. Googleアカウントの作成
Bloggerを利用するには、まずGoogleアカウントが必要です。既にアカウントを持っている方は、そのまま進んでください。アカウントの作成は以下の手順で行います。
- Googleの公式サイトへアクセス
- 「アカウントを作成」をクリックし、必要な情報を入力
- メールアドレスとパスワードを設定し、アカウントを作成
 |
STEP2. Bloggerにアクセスする
Googleアカウントが用意できたら、次にBloggerにアクセスします。以下の手順で進めていきましょう。
- Bloggerの公式サイトにアクセス
- Googleアカウントでログイン
- タイトルとURLを入力
 |
| Bloggerログイン画面 |
 |
| ブログタイトル入力画面 |
STEP3. テンプレートを選ぶ
Bloggerでは、さまざまなデザインテンプレートから選ぶことができます。ちなみに当ブログは「Contempo」を使用しています。
また、自分のブログに合ったスタイルを選び、カスタマイズすることが可能です。テンプレートを選んだら、「ブログを作成」ボタンをクリックしてください。これでブログの作成は完了です。
 |
Bloggerの基本設定
ここでは、Bloggerの基本設定について、最低限設定が必要な部分を紹介します。
プロフィールの設定
Bloggerにおいて、プロフィール設定は非常に重要です。読者にとって、ブログを書いている人の情報は信頼性や親しみ感に繋がります。以下の手順で、プロフィールの設定を行いましょう。
- Bloggerのダッシュボードから「設定」を選択
- プロフィールセクションに移動し、名前や自己紹介を記入
- プロフィール画像を設定
ファビコンの設定
ファビコンはウェブブラウザのタブに表示される「アイコン」で、訪問者にブログの印象を定着させる役割を持ちます。ファビコンを設定することで、ブログがよりプロフェッショナルに見えるようになります。
 |
- Bloggerの左側のメニューから「設定」をクリック
- 基本設定の「ファビコン」をクリック
- アイコンファイルを選択
- ファビコン画像をアップロード
ファビコンの画像はアップしてから反映されるまでしばらくかかります。
 |
ファビコンのサイズ
Googleのガイドラインによると、ファビコンは、正方形（アスペクト比 1:1）で、サイズは最低でも8x8ピクセル以上が必要とされています。
また、ファビコンは、「ブラウザのタブ」や「Googleの検索結果」など、さまざまな場所で表示されるため、48x48ピクセル以上のサイズのファビコンを使用することをおすすめします。
検索結果に係る設定
- プライバシー：検索エンジンに表示されるようにする⇒ON
- HTTPS：HTTPSリダイレクト⇒ON
- メタタグ：検索向け説明を有効にする⇒ON
- メタタグ：検索向け説明を入力
- クローラとインデックス：Google Search Consoleの登録
Bloggerのカスタム設定
ここでは、ブログのデザインに関わる設定を詳しく解説します。ブログを読みやすくすることによって、読者の利便性が向上し、より多くの訪問者がコンテンツを楽しむことができます。注意点として、HTMLを編集する際は、必ずバックアップをして復元できるようにしておきましょう。
見出しをカスタマイズ
見出しの文字サイズ
Bloggerのデフォルトの設定では文字サイズが固定されているため、個々のスタイルに合わせたカスタマイズが必要です。文字サイズが「大きすぎる」、または「小さすぎる」と感じられる場合は、こちらで公開されているCSSを追加して文字サイズを変更し、読みやすさを向上させましょう。
- Bloggerの左側のメニューから「テーマ」「カスタマイズ」を選択
- 詳細設定から「CSSを追加」を選択
- ボックスにCSSコードを追加する
- 保存する
 |
| マイテーマのカスタマイズ |
 |
| CSSの追加 |
見出しの装飾を変える
Bloggerでは、「主見出し（h1）」「見出し（h2）」「小見出し（h3）」「準見出し（h4）」の4種類の見出しがあります。基本的には文字サイズで見た目に違いがありますが、こちらで公開されているCSSコードを追加することで、よりメリハリのある記事を作成することができます。
- Bloggerの左側のメニューから「テーマ」「カスタマイズ」を選択
- 詳細設定から「CSSを追加」を選択
- ボックスにCSSコードを追加する
- 保存する
投稿テキストをカスタマイズ
投稿テキストのサイズ調整
記事本文の文字サイズはCSSを追加することなく、Bloggerの詳細設定で変更することができます。当ブログではデフォルトの「15px」から「17px」に変更しています。
- Bloggerの左側のメニューから「テーマ」「カスタマイズ」を選択
- 詳細設定から「投稿」を選択
- 投稿テキストのサイズを変更する
- 保存する
 |
投稿テキストにマーカーを付ける
ブログでよく見かける文字の装飾には、蛍光ペンでマーカーを付けたようなものがあります。それに対して、Bloggerのデフォルト機能にはそのような装飾がないため、当ブログでは、下線（U）をマーカーに置き換えるカスタムCSSを追加しています。
カスタムCSS追加手順
- Bloggerの管理画面を開く
- 「テーマ」「カスタマイズ」をクリック
- 詳細設定から「CSSを追加」を開く
- 以下のCSSを追加し、「適用」ボタンを押す
u {
background: linear-gradient(transparent 60%, yellow 60%);
text-decoration: none; /* 下線を消す */
padding: 0 2px;
display: inline;
}
これで、Bloggerの投稿エディタで「下線（U）」を適用すると、自動的に蛍光ペン風のマーカーがつくようになります。注）デフォルトの下線は使用できなくなります。
投稿テキストの行間を調整する
行間が広く空いている記事は、ゆったりとした印象があり、読者が記事を読みやすくなります。当ブログでは、カスタムCSSを追加して行間を広げています。
カスタムCSS追加手順
- Bloggerの管理画面を開く
- 「テーマ」「カスタマイズ」をクリック
- 詳細設定から「CSSを追加」を開く
- 以下のCSSを追加し、「適用」ボタンを押す
.post-body {
line-height: 1.8; /* 行間を広げる */
}
- 1.4：やや狭い（標準的な行間）
- 1.6：少し広い（読みやすさが向上）
- 1.8：ゆったり（読みやすいバランス）
- 1.9：当ブログの設定
- 2.0：広め（余白が多く、ゆったりしたデザインに）
目次を設置する
目次は、ブログを読みやすくするための重要な要素です。特に長文の記事においては、目次があることで読者が知りたい情報に素早くアクセスできるため、記事全体の利便性が向上します。また、検索エンジンも目次の情報を評価しやすくなるため、SEO対策としても効果的です。
しかし、Bloggerには目次を設置する機能がありませんので、HTMLを編集して目次を自動生成します。当ブログはこちらで紹介されているコードを追加して自動生成しています。
まとめ
この記事では、Bloggerを使ったブログの開設方法から、デザインや機能のカスタマイズまで、基本的な流れを解説しました。
Bloggerは無料で手軽に始められるうえに、CSSやHTMLの知識があれば、見た目も自分好みにアレンジできます。
最初はシンプルでも、少しずつ手を加えていくことで、あなただけのブログ空間が完成します。
「まずは1記事書いてみる」ことから始めてみましょう。書きながら、自然と使い方や見せ方の工夫も身についていくはずです。
