ヘッダー

【CSS不要】スマホヘッダーに影を追加する方法

CSSを追加せずにスマホヘッダーの境界線に影を追加する方法をご紹介します。簡単にやり方を説明すると、「適応IDをコピーし、AFFINGER管理のドロップシャドウの項目に貼り付ける」これだけです。それでは具体的な手順を解説していきます。スマホヘッダーに影を追加する方法手順１．まずは以下の適応IDをコピーしてください。 #s-navi dt これがスマホのヘッダー部分の適応IDです。２．次にWordPressのダッシュボードを開き、「AFFINGER管理」→「全体設定」の順にクリック。３．「 ...

スマホのヘッダーを固定orスクロール追尾する方法

今回は、スマホのヘッダーを「固定」or「スクロール追尾」する方法について書いていきます。 AFFINGER6で設定できるスマホヘッダーの表示パターンは3つ。【通常】：ヘッダーは固定されません【固定】：常にページ上部にヘッダーが固定されます【スクロール追尾】：下へスクロールするとヘッダーは消え、上へスクロールすると消えたヘッダーが現れます表示パターンのイメージ通常固定スクロール追尾表示パターンの設定は「カスタマイズ」で行います。この記事では、スマホヘッダーの表示パターン設定「ヘッダー背 ...

PCのヘッダー境界線に影をつける方法【CSS不要】

この記事では、「PCのヘッダーとメニューの境目がわかりにくい」「ヘッダーの境界線に影をつけられないかなぁ」という悩みを解決します。 PCヘッダーの境界線に影をつける方法のひとつに「CSSを追加する方法」があるんですが、AFFINGER6では CSSを追加する必要はありません。やることはドロップシャドウの設定に適応IDを追加するだけです。ということで今回は、PCヘッダーに影をつける簡単な方法と、PCヘッダーの境界線に影が追加されない場合の対処法を解説していきます。スマホのヘッダーにも影をつけた ...

ヘッダーエリア全体に画像を設定する方法

ここでは、ヘッダーエリア全体を画像にする方法を解説していきます。ヘッダーエリア全体に画像を反映させると、トップページのヘッダーはこんな感じになります。完成イメージヘッダーエリア各メニューヘッダー全体を画像にするためには、「カスタマイズ」にて以下メニューの設定が必要です。ロゴ画像 / サイトのタイトルヘッダー画像基本エリア設定 PCヘッダーメニューそれでは一つひとつ手順を解説していきます。ロゴ画像/サイトのタイトルメニューここでは、ロゴ（サイトタイトル）とキャッチフレーズの色を変更します。 ...