ウェブサイトデザイン

ウェブサイトデザイン

お知らせ:当社は、お客様により充実したサポート情報を迅速に提供するため、本ページのコンテンツは機械翻訳を用いて日本語に翻訳しています。正確かつ最新のサポート情報をご覧いただくには、本内容の英語版を参照してください。

イベントの目的に合わせたブランドWebサイトをデザインしましょう。Webサイトページに、モバイル端末にも対応したテーマを適用できます。ロゴ、メディア、ファビコンを追加して、イベントWebサイトのデザインを始めましょう。

テーマを選択

美しくデザインされたWebサイトは、参加者の関心を惹きつけ、イベントへの興味を促します。Zoho Backstageでは、ご自身に最適なテーマを選択することで、Webサイトの外観を自在にカスタマイズできます。


 
  1. Design > WebサイトへDockから移動します。
  2. 編集 Webサイト」をクリックして、Webサイトビルダーを開きます。
  3. Webサイトビルダーの左ペインでテーマをクリックします。テーマパネルが表示されます。
  4. パネルからWebサイトの設定を選択します。
  5. 選択したテーマに関連付けられたカラ―設定から、キーカラーを選択します。

ロゴの設定

イベントの象徴やシンボルとしてロゴを設定しましょう。
 


  1. Design > WebサイトへDockから移動します。
  2. 編集 Webサイト」をクリックして、Webサイトビルダーを開きます。
  3. ナビゲーションバーの左側でアップロードする ロゴをクリックします。画像の選択ポップアップが表示されます。
  4. 新しい画像をアップロードするか、デザインライブラリ、またはクラウドからロゴ画像を選びます。
  5. 選択するをクリックします。ロゴがナビゲーションバーの左側に表示されます。

メモ:ロゴ画像にハイパーリンクを設定して、Webサイト内の別ページや外部URL、ポータルのイベント一覧ページへ接続することができます。設定するには、画像の編集を行ってください。
 

対応ロゴ形式

JPG JPEG PNG
GIF

ロゴのサイズ上限

1MB未満

ロゴの寸法

340x120ピクセル(72dpi)



  1. Webサイトビルダーのナビゲーションバー左側にある既存のロゴにマウスを重ねます。
  2. 編集アイコンをクリックします。画像の編集ダイアログボックスが表示されます。
  3. 変更するボタンをクリックして画像を置き換えます。
  4. 画像を選択し、選択するをクリックします。

メモ:編集時に画像を切り取ることもできます。
 


  1. Webサイト Builderで、ナビゲーション棒グラフの左側にある既存ロゴにカーソルを合わせます。
  2. 編集アイコンをクリックします。編集画像ダイアログボックスが表示されます。
  3. 削除ボタンをクリックします。
  4. 表示されるダイアログボックスで削除をクリックします。
    メモ:この操作でメインロゴとサブロゴの両方が削除されます。

ページを追加する

カスタムページを利用して、Webサイトの初期設定ページにはない新しいコンテンツスペースを作成できます。ページ名やURLなど、ページの各項目は簡単な手順で編集可能です。例えば、イベント参加者が自社にイベント参加やスポンサーの依頼をするためのメールテンプレートをダウンロードできるページを作成することもできます。
 
カスタムページの追加、セクションの挿入、テキスト目次のカスタマイズが行えます。また、ページをナビゲーション棒グラフのリンクや任意のページのボタンに接続することも可能です。さらに、表示設定レベルを設定することで、特定のグループだけがアクセスできる外税ページを作ることもできます。


 
  1. Dockからデザイン > Webサイトに移動します。
  2. 編集 WebsiteをクリックしてWebサイトBuilderを開きます。
  3. サイドバーのページタブをクリックします。
  4. ページ追加ボタンをクリックします。
  5. ページ名を入力します。
  6. そのページのURLを入力します。これはユーザーがページにアクセスした際に住所棒グラフに表示されます。
  7. ページ表示設定権限セクションから設定を選択し、選択したページへアクセスできるユーザーを指定します:
    1. 公開:このオプションを選択すると、Webサイトの訪問者全員がこのページにアクセスできます。
    2. サインイン済み訪問者:このオプションを選択すると、Webサイトにログインした訪問者のみがページへアクセスできます。
    3. 外税イベント参加者:このオプションを選択すると、特定のチケット種別のチケット保持者、スポンサー、講演者、特定の出展者カテゴリの出展者など、イベント参加者グループのみがアクセスできます。
  8. 保存をクリックします。
 
メモ:ページを作成すると、そのリンクが自動的に作成され、ナビゲーション棒グラフにマッピングされます。リンク設定の管理はナビゲーション棒グラフから行えます。

カスタムpagesは、お使いのサブスクリプションプランに基づいて有効になる有料機能です。

セクションコンテンツの管理

ページ上の内容を整理するためにセクションを並べ替えます。必要な情報でない場合でも、セクションを削除せずに非表示にすることができます。

初期Webサイトデザインに含まれている初期設定のセクションも、同じページ内や別のページでも自由に配置できます。


 
  1. デザイン > WebサイトにDockから移動します。
  2. Webサイトを編集」をクリックして、Webサイトビルダーを開きます。
  3. セクション上にカーソルを合わせ、上に移動 [ ] または下に移動 [ ] アイコンをクリックしてセクションを並べ替えます。非表示アイコン [ ] をクリックすると非表示にできます。
  4. Webサイトの各ページ内の任意のセクションについて、タイトルや折れ線グラフ説明テキストを編集できます。これらのプレースホルダーに表示されるテキストはすべてサンプルテキストです。
    メモ:イベント名や説明を編集すると、イベント詳細タブにも自動で反映されます。

メモ:任意のテキストをダブルクリックするとリッチテキストエディターが表示され、書式設定が可能です。

セクションの削除

Webサイトデザインからセクションを削除するには、該当セクションの削除アイコンをクリックします。



ボタンの追加

Webサイトの訪問者向けに追加設定を提供したり、非表示のボタンを置き換えたりするために、他のボタンを追加できます。ボタンはWebサイト内のページ、外部URL、またはポータルのイベント一覧ページにリンク可能です。

テーマに合わせてボタンのデザインを変更できます。グループ化されたボタンは同時にデザイン変更や個別に更新することも可能です。


 
  1. Design > Webサイト に移動し、ドックから選択します。
  2. 編集 Webサイト」をクリックして、Webサイトビルダーを開きます。
  3. Webサイト内のいずれかのボタンにカーソルを合わせ、該当エリアの 設定 アイコン [] をクリックします。Button グループ設定パネルが表示されます。
  4. Arrangeタブを選択します。
  5. 新しく追加する button ボタンを選択します。新しいボタンがページ上に作成され、Button グループ設定パネルに一覧表示されます。

メモ:
  1. 既存のボタンの横にボタンを作成すると、ボタングループになります。Design設定がボタングループに適用されると、そのグループ内のすべてのボタンに反映されます。
  2. ボタンが非表示のページにリンクされている場合、有効なWebサイトでもボタンは自動的に非表示になります。例えば、Agendaページをすべての未ログインユーザーから非表示にした場合、これらの訪問者はAgendaページやホームページ上の表示する Agendaボタンを見ることができません。


 
  1. Design > Webサイト に移動し、ドックから選択します。
  2. 編集 Webサイト」をクリックして、Webサイトビルダーを開きます。
  3. 任意のボタンにカーソルを合わせて編集をクリックします。Button 設定パネルが表示され、Button 詳細タブが選択されています。
    1. 初期設定リストからボタンの種類を選択します。既存ページやWebサイト内の処理にリンクされます。
    2. ボタンのラベルとして表示されるボタンのテキストを入力します。
    3. Button 種類のドロップダウンでカスタムを選択してオリジナルのボタンを作成することも可能です。リンクするには設定を選択してください。

ボタンのスタイルを設定する



  1. Design > Webサイト に移動し、ドックから選択します。
  2. 編集 Webサイト」をクリックして、Webサイトビルダーを開きます。
  3. 任意のボタンにカーソルを合わせて編集をクリックします。Button 設定パネルが表示されます。
  4. Button designタブを選択します。
  5. ボタンと枠線スタイルを選択します。
  6. 色の設定を変更します。

メモ:ボタンごとに編集オプションをクリックして個別に編集できます。または、ボタングループを編集して、そのグループ内のすべてのボタンにデザイン変更を適用することも可能です。