Googleサイトのヘッダーをカスタマイズする方法

1時間で学べるGoogleサイトの教科書

シリーズ連載を通して「Google サイトの基礎」を解説しています。


こんにちは、たま(@closuppo)です。

今回は「第9回:Googleサイトのヘッダーをカスタマイズする方法」について説明していきます。

ヘッダーに画像を挿入する方法や、見出しのタイプを変更する方法を学びましょう。


たま

全シリーズは以下のページにまとめてます


※目次をクリックすると
タイトルの先頭まで移動します(↓)

目次



まずはじめに

ヘッダー部分に画像を挿入したり、見出しのタイプを変更することでページのイメージを変えることができます。

googlesites-header01

ココ

ヘッダーって何ですか?

タマ

Googleサイトの各ページの

上部にある領域のことです


タイトルを変更する

ヘッダーのタイトルも文字の大きさや色や配置など自由に編集するとこができます。

テキストを変更する方法については「Googleサイトで文字や背景を変更する方法」で解説してます。

googlesites-header02

見出しのタイプを変更する

ヘッダーのサイズを変更することができます。

背面画像にカーソルを合わせ見出しのタイプをクリックしてください。

googlesites-header03

【カバー】【バナー(大)】【バナー】【タイトルのみ】の4パターンから選択することができます。

googlesites-header04

見出しのタイプを変更できました。

googlesites-header05

ココ

簡単に見た目を変更

することができますね


画像を挿入する

ヘッダーの背景画像は各テーマごとに自動で設定されていますが、その画像を差し替えることができます。

背面画像にカーソルを合わせて画像変更ボタンをクリックしてください。

googlesites-header06

アップロードまたは画像を選択をクリックしてください。

アップロードはローカルPCから画像を選択することができ、画像を選択は用意されている画像があるギャラリーやドライブなどから選択することができます。

googlesites-header07

画像を変更することができました。

googlesites-header08

ココ

画像を挿入するとサイトの

イメージがガラっと変わり

ますね


ロゴを挿入する

上部のサイト名の横に画像(ロゴ)を挿入することができます。

ページ右上の設定ボタンまたはメニューバーの設定ボタンをクリックしてください。

googlesites-header12

【ロゴ】のアップロードを選ぶとローカルPCのフォルダ画面から画像を選択でき、選択を選ぶとGoogleドライブやGoogle画像検索から画像を選択することができます。

googlesites-header13

【ロゴ】を挿入することができました。

googlesites-header11

まとめ

  • タイトルの文字の大きさや色や配置などを変更できる。
  • ヘッダーの背景をクリックし【見出しのタイプ】ボタンから見出しのタイプを変更できる。
  • 見出しのタイプは【カバー】【バナー(大)】【バナー】【タイトルのみ】の4パターンから選択できる。
  • ヘッダーの背景をクリックし【画像変更】ボタンから画像を挿入できる。
  • 【設定】の【ブランドの画像】メニューより、ロゴ画像を挿入できる。
  • 画像はローカルPC、テンプレート、ドライブから選択できる。

Googleサイトのヘッダーをカスタマイズする方法についてお伝えしました。

ヘッダーは最初に目に入る最も目立つ箇所です。

サイトの雰囲気に合わせて画像の挿入や見出し幅を調整し、閲覧者の目に留まるサイトにしていきましょう。


ココ

魅力的なヘッダーに

していきます

タマ

次回は「お知らせバナーを表示

する方法」を見ていきましょう



ポータルサイトを作りながら体系的に学ぶ

googleサイト006

シリーズ連載を通して、ポータルサイトを作りながらGoogleサイトを体系的に学ぶ方法を解説してます。

≫ これから作成するサンプルサイトはこちら

  • 第1回:新規作成とテーマの変更
  • 第2回:ヘッダーをカスタマイズ(※作成中)
  • 第3回:お知らせページ作成(※作成中)
  • 第4回:社内イベントの共有(※作成中)
  • 第5回:業務ツールの共有(※作成中)
  • 第6回:書類の共有(※作成中)
  • 第7回:営業部のページを作成(※作成中)
  • 第8回:研修用のページ作成(※作成中)
  • 第9回:フッターをカスタマイズ(※作成中)