Googleサイトを作成-基本操作編

セクションとコンテンツ

あなたが Google サイトでウェブページを作成するときに、そのページにタイトルや文章、写真や動画、そしてその他の情報や機能を　載せたいと思いますよね。

Webの文脈で言えば、ウェブサイトに表示されるテキスト、画像、動画、音声、インタラクティブな要素などのすべての情報を　一般的に「コンテンツ」と呼びます。

Google サイトにおける「コンテンツ」もこの定義に基づいています。つまり、Google サイトで作成されるページ上に配置されるテキスト、画像、リンク、動画、フォーム、チャートなどの情報や要素のことを指します。
編集画面右に現れる、「挿入」タブ内に要素をクリックすることで、左のサイトイメージへ　「コンテンツ」の　格納フォルダーが　挿入されていきます。

Google サイトではテキストや画像などのコンテンツを本文に追加する際、セクションと呼ばれるブロックを追加していきます。
言い方を変えると、まず、セクションが作成され、その中にテキストや画像のフォルダーが格納されていくようになります。

例えば、下記の図は　本文にテキストボックスを　追加した場合です。

外枠は　セクションです。
このとき、セクションが追加され、セクションの中にテキストボックスが追加されているのがわかると思います。

コンテンツの追加

同じセクション内で　コンテンツを追加したい場合、そのセクションの空いている場所で　ダブルクリックをしてください。

コンテンツメニュー

必要なアイコンをクリックすることで、セクション内でコンテンツが追加されます。

セクションの操作

セクション単位の操作は　左の点の集合マークにカーソルを持っていくことで　メニューが表示され　可能となります。

セクション操作メニュー

セクションの複写（コピー）

セクションの削除

※「背景色の設定」は　「デザイン篇」で説明させていただきます。

また、その点の集合マークにカーソルを持っていき十字矢印（少し違いますが　こんな感じ　☩）が出たところで、ドラッグ・アンド・ドロップを行うことでセクション単位での移動も可能です。

セクションの移動

コンテンツの操作

コンテンツは　そのセクション内で　サイズの変更（※デザイン篇の方で説明します）を行ったり、移動したりすることができます。
コンテンツの選択は、カーソルを持っていくと　十字矢印（少し違いますが　こんな感じ　☩）が出ますので、ドラッグ・アンド・ドロップで移動することができます。

セクション内でのコンテンツの移動

　別々のセクションの　コンテンツを　同じセクションに　したい場合も、基本操作は同じです。

[例]　3つのセクション

テキストボックスを　画像の横に持ってきたい場合、テキストボックスの上部の　点の集合体にカーソルをあわせてください。

テキストボックスの点の集合体を選択

ドラッグ アンド ドロップ

この時、移動がすむと、カラになったセクションは、自動的に消滅します。
また、逆に　セクション内からコンテンツを　白紙のところに移動させた場合は、自動的に　セクションがつくられます。

コンテンツブロック

Googleサイトの挿入メニューの中のコンテンツブロックは、ページの本文にテキストや画像、動画、地図、カレンダー、ボタンなど、さまざまなコンテンツを追加するためのテンプレートです。最初に「コンテンツ」の組合せを決めた「セクション」を　挿入するメニューになります。

コンテンツブロックを追加することで、1セクション内にさまざまなコンテンツを同時に配置することができます。

コンテンツブロック内のプレースフォルダーをクリックすることで、画像、動画、地図、カレンダー、ドキュメントなど、さまざまなコンテンツを追加することができます。
コンテンツブロックを削除すると、そのセクションと、そのセクション内に追加されていたコンテンツがすべて削除されることになります。

また、コンテンツブロック内のコンテンツのサイズや色、位置なども、初期設定に関わらずコンテンツ単位での移動・変更・削除をすることもできるため、ページのデザインをカスタマイズすることにも　役に立つものとなるでしょう。

この記事まとめ

この記事では、Googleサイトではセクション構成であること、そこに各コンテンツを配置することで　ウェブサイトに情報をのせることになるので、その記事の作成するための操作について　説明しました。

なお、他の 操作篇記事メニューは　以下の通りになります。

新しいGoogleサイトを作成してみましょう（作成と公開）
Googleサイト作成手順（机上篇）1ページのウェブサイトを作るために何を用意するか
Googleサイト作成手順（基本操作篇）セクションの追加とコンテンツ
Googleサイト作成手順（デザイン篇①）テーマ設定とタイトル操作
Googleサイト作成手順（デザイン篇②）セクションとテキストBOXの書式設定
Googleサイト作成手順・・・・その他のコンテンツ操作