Feather cloud サポート

キーワード検索

お知らせ

障害情報

Dressでサイトをデザインする

ここでは、Dressの設定方法の一例として、実際にサイトのヘッダーにあるメニューの文字色を変更する方法について説明します。

メニューのリンクカラーの変更

テンプレートを作成する

サイトエディタで〈サイトDress〉をクリックします。
Dressの設定は、「サイトDress」でのサイト全体への適用の他、「ページ設定」で行うページごとのDress、「ブロックエディタ」内で行うブロックごとのDressがあります。
設定内容は下記の優先度で反映されます。

■サイト全体Dress = ページDress < ブロックエディタのDress

なお、ページ設定内で、Dressの〈上書きロック〉を設定しているページは、サイト全体のDressの設定は適用されません。

030304-01.jpg
〈新規作成〉をクリックします。
030304-02.jpg


〈テンプレート名〉、〈説明文〉を入力し、〈OK〉をクリックします。
030304-03.jpg

背景色を変更する

〈テンプレートを編集〉をクリックします。


030304-04.jpg



まずは上部のタブを〈選択モード〉にします。
〈設定一覧〉タブでは、そのDress内で設定済みの要素一覧が表示されます。
030304-05.jpg


中央のプレビューエリアで、編集するエリアを選択する[1]か、右上の鉛筆のアイコンをクリックします[2]。

030304-06.png

このテンプレートのヘッダーにあるメニューは「メニューA」の「リンクパーツ」で構成されています。この部分の編集をするには、ヘッダーエリアを選択し、「メニューA」「リンク」を選択した状態で、「文字色」をクリックします。
030304-07.jpg

〈設定する〉にチェックを入れます。
※文字色の要素に限らず、Dressの各要素の編集時には、〈設定する〉にチェックを入れてください。
030304-08.jpg
カラーの調整を行い、〈保存〉をクリックします。
030304-09.jpg
前の画面に戻り、〈適用〉をクリックします。
030304-10.jpg
ヘッダーエリアのメニューに、指定したカラーが適用されました。
030304-11.jpg

Copyright(C)BIGLOBE Inc. 1996-2016