【連載】

Office 365サイト活用入門

22 パブリックサイトのデザインの変更

 

22/40

パブリックサイトのデザイン修正

Office 365のパブリックサイトは、多くのCMSと同様に、サイト全体の統一されたデザインと、各ページのコンテンツを独立して管理します。

たとえば、ヘッダやフッタなどはWebサイト全体を通じてほとんどのページに共通で使用するのが一般的です。こうした、Webサイトに共通の部分と、ページ毎に異なる部分を分離して管理することで、Webサイトの制作と運用管理を効率化します。 今回は、このWebサイト全体に共通する部分の設定を紹介します。

基本デザインの変更

パブリックサイトの基本デザインは、次の手順で修正します。

(1)Office 365にサインインし、上部メニューバーから「サイト」をクリックして、「パブリックサイト」をクリックします。

上部メニューバーから「サイト」をクリックして、「パブリックサイト」をクリック

(2)パブリックサイトが表示されたら、上部の管理メニューから「サイト」タブをクリックし、「見た目の変更」をクリックします。CSSなどを変更し、コンテンツ(文章などのデータ)には手を加えず、表示だけを変更します。

上部の管理メニューから「サイト」タブをクリックし、「見た目の変更」をクリック

※「ページ」タブをクリックすると、Webサイト全体のデザインではなく、個々のページの独自部分を編集できますが、個々のページの編集については次回紹介します。

(3)あらかじめ用意されているデザインテンプレートを表示しますので、その中から、好みのスタイルをクリックして選択します。

好みのスタイルをクリックして選択

(4)選択したテンプレートの詳細設定ページで、背景画像(壁紙)、文字色の組み合わせ、Webサイトのレイアウト、フォントなどを、好みに応じて変更します。

背景画像を変更するときは、「変更」をクリックして、背景に使用する画像ファイルをアップロードします。

テンプレートの詳細設定ページで、好みに応じて変更

(5)好みのデザインになったら、「プレビュー」をクリックして、最終的にどのようなデザインになるのかを確認します。

「プレビュー」をクリックして、最終的にどのようなデザインになるのかを確認

(6)プレビュー画面を確認したら、「はい、確定します」をクリックして、設定を確認します。もし、再修正するときは「いいえ、まだ完成ではありません」をクリックして、手順(4)の画面に戻ります。

画像左のキャプションはここ

タイトルの編集

Webサイトのタイトルやその説明文を修正します。ページに表示するタイトルを修正するだけでなく、WebページのHTMLコードにタグとして埋め込まれますので、Googleなどの検索サイトからの検索にも影響します。一般の閲覧者が検索しやすいように設定してください。

(7)「サイト」タブの「タイトルの編集」をクリックします。

「サイト」タブの「タイトルの編集」をクリック

(8)「タイトル」と「説明」を入力し、「OK」をクリックします。

検索サイトの検索エンジンの検索対象になりますので、「タイトル」だけでなく「説明」も重要です。

「タイトル」と「説明」を入力し、「OK」をクリック

ロゴの修正

ロゴマークの画像ファイルを用意し、アップロードしてロゴマークを変更できます。

(9)「サイト」タブの「ロゴの変更」をクリックします。

「サイト」タブの「ロゴの変更」をクリック

(10)ロゴの画像ファイルをローカルコンピュータからアップロードするときは「コンピュータから」、SharePoint Onlineにアップロード済みの画像ファイルを指定するときは「SHAREPOINTから」をクリックして、画像ファイルを指定します。

ロゴの画像ファイルを指定

(11)「説明の入力」に、ロゴに対する説明文を入力します。画像ファイルを表示できない環境で代替テキストとして表示されると同時に、視覚障害者が使用する音声読み上げソフトの読み上げ対象となりますので、簡潔でわかりやすい説明文を入力してください。入力したら「OK」をクリックします。

ロゴに対する説明文を入力

メニューの修正

表示されているメニューの表示/非表示の切り替え、他のWebページやWebサイトへのリンクの設定などは「編集メニュー」を使用します。

(12)「サイト」タブの「編集メニュー」をクリックします。各メニューに記号が表示されますので、設定を変更して「保存」をクリックしてください。

「サイト」タブの「編集メニュー」をクリックし、設定を変更して「保存」をクリック

記号と意味

× メニューを削除します。
目マーク そのメニューが表示状態にあることを示しています。目マークをクリックすると、メニューを非表示に切り替えます。
そのメニューが日表示状態にあることを示しています。-をクリックすると、そのメニューを表示に切り替えます。
+リンク クリックすると、他のWebページやWebサイトへのリンクをメニューとして追加できます。

ヘッダとフッタの修正

ヘッダやフッタを修正するには、サイト要素の編集メニューを使用します。

(13)「サイト」タブの「サイト要素の編集」をクリックします。

「サイト」タブの「サイト要素の編集」をクリック

(14)ヘッダ、あるいはフッタの要素を編集し、編集が終わったら「保存」をクリックして修正内容を保存します。

ヘッダ、あるいはフッタの要素を編集し、編集が終わったら「保存」をクリック

「サイト要素の編集」画面では、ページ上部の「テキストの書式設定」タブで、Microsoft Wordの様な書式設定リボンを表示します。Wordと同じ感覚で、文章を編集し、あるいは飾り付けできます。また「挿入」タブをクリックすると、リンクやWebアプリなどを挿入して貼り付けることができます。

検索ボックスの表示/非表示

ヘッダに表示する検索ボックスの表示、非表示を変更するには、専用のメニューを使用します。

(15)「サイト」タブの「検索ボックス」をクリックします。検索ボックス設定のダイアログが表示されたら、チェックボックスのオン、オフを切り替えて、「保存」をクリックします。チェックボックスがオンのときに非表示、チェックボックスがオフのときに表示ですので、注意してください。

「サイト」タブの「検索ボックス」をクリックし、チェックボックスのオン/オフを切り替えて、「保存」をクリック

(16)Webサイトのデザインを変更したパブリックサイトの例。

Webサイトのデザインを変更したパブリックサイトの例

次回は、ページの修正手順を紹介します。


Office365の導入支援はネクストセットへ!


■■「組織ワークフロー」を100社無償提供中!■■
ネクストセットはOffice365の導入支援とアプリケーション開発に特化したソリューションベンダーです。Office365をより安全に、より便利にご利用いただくため、「シングルサインオン」や「組織アドレス帳」、「組織ワークフロー」など、さまざまなプロダクトを開発し、ご提供しています。現在、100社限定で「組織ワークフロー」を無料提供中です。この機会に、ぜひ、導入をご検討ください。

詳しくはhttp://www.nextset.co.jpをご覧ください。

22/40

インデックス

連載目次
第40回 OneDrive for Businessに文書を作成する
第39回 OneDrive for Business
第38回 グループを作成する
第37回 予定表を作成して共有する
第36回 会議室を利用する
第35回 共有メールボックス
第34回 全テナントに対するメールフローのルールの作成
第33回 テナント(共有)の連絡先への情報追加
第32回 テナントの連絡先の作成
第31回 リニューアルしたOffice 365でのメール転送
第30回 Office 365のメールのルール機能(その3)
第29回 Office 365のメールのルール機能(その2)
第28回 Office 365のメールのルール機能(その1)
第27回 パブリックサイトのその他の設定
第26回 公開したパブリックサイトの運用
第25回 パブリックサイトの公開手続き
第24回 パブリックサイトのページ管理
第23回 パブリックサイトのページ編集
第22回 パブリックサイトのデザインの変更
第21回 パブリックサイトを開設する
第20回 ニュースフィードのその他の機能
第19回 ブログへの投稿
第18回 ニュースフィードへの投稿
第17回 プロフィールの作成
第16回 サイトの更新を見逃さない「通知機能」
第15回 案件管理アプリでグループワークを効率化
第14回 Office 365でアンケートを回収する
第13回 Office Web Appsによる同一文書の共同作業
第12回 ドキュメントの活用(その4)
第11回 ドキュメントの活用(その3)
第10回 ドキュメントの活用(その2)
第9回 ドキュメントの活用(その1)
第8回 予定表の作成(後編)
第7回 予定表の作成(前編)
第6回 ユーザーグループの作成(後編)
第5回 ユーザーグループの作成(前編)
第4回 リンク集の追加
第3回 掲示板サブサイトのカスタマイズ(Webパーツの利用)
第2回 ビューを利用した掲示板サブサイトの作成
第1回 「全社掲示板」サブサイトを作る

もっと見る



転職ノウハウ

あなたが本領発揮できる仕事を診断
あなたの仕事適性診断

シゴト性格・弱点が20の質問でサクッと分かる!

「仕事辞めたい……」その理由は?
「仕事辞めたい……」その理由は?

71%の人が仕事を辞めたいと思った経験あり。その理由と対処法は?

3年後の年収どうなる? 年収予報
3年後の年収どうなる? 年収予報

今の年収は適正? 3年後は? あなたの年収をデータに基づき予報します。

激務な職場を辞めたいが、美女が邪魔して辞められない
激務な職場を辞めたいが、美女が邪魔して辞められない

美人上司と可愛い過ぎる後輩に挟まれるエンジニアの悩み

人気記事

一覧

イチオシ記事

新着記事

[ファインディング・ドリー]スタントン&マクレーン両監督に聞く 「続編は作らない」が覆った理由
[19:13 7/24] エンタメ
[アニメ1週間]庵野監督が「エヴァ」新作の遅れを謝罪 「遊☆戯☆王」が4DXに
[19:00 7/24] ホビー
『ペット』主役犬に思い寄せるポメラニアンの写真公開! ツンデレ受け答えも
[19:00 7/24] エンタメ
[今週の新刊]「ハイスコアガール」が2年7カ月ぶりに登場 「NEW GAME!」「土竜の唄」も
[18:30 7/24] ホビー
[鈴木亮平]“大先輩”井上真央のいじりにタジタジ 「Sっ気ある」「下に見られている…」
[18:26 7/24] ホビー

求人情報