AFFINGER6

【AFFINGER6】フッターの作り方を簡単解説!メニュー、2列(2段)、3列(3段)、キャプションを消す方法について!




一日の締めをお洒落なBARでカクテルで!

サイトの締めはフッターで!


WordPress の最良テーマの一つ「AFFINGER6」 で「フッター」を作る方法を解説します。




AFFINGER ご購入はこちら




AFFINGER6 で作るフッターの形


AFFINGER6では、主に以下のスタイルでフッターを作ることができます。


メニューあり/なし
列数なし/一列/二列/三列

どゆこと?(笑)


例)メニューのみのフッター


メニューを付けて段落を付けないパターンです。




例)メニュー+三段のフッター


メニューを付けて三段(三列)使ったフッターです。




フッターエリアの基本設定





WordPress の管理画面から、[外観] → [カスタマイズ] → [基本エリア設定] → [フッターエリア] を選択します。

文字色、背景色などを設定します。


フッターにメニューを付ける方法



フッターにメニューを付ける方法です。


step
1
フッター用のメニューを作る



WordPress の管理画面から、[外観] → [カスタマイズ] → [メニュー] を選択します。

[メニューを新規作成] ボタンを押下してメニューを作ります。

メニュー名に「任意の名前」を付け、「フッター用メニュー(現在:フッター用)」を指定して「公開」します。


step
2
メニューに項目を作る



WordPress の管理画面から、[外観] → [メニュー] を選択します。

[編集するメニューを選択] プルダウンで [フッター用(フッター用メニュー)] を選択して、項目を編集して [メニューを保存] します。


step
3
完成です



サイトのフッターにメニューを表示しますので、


いろいろクリックして楽しんでください(笑)


動作確認ですね。


フッターに段落を作る


一列目の作り方


step
1
一列目を作る



WordPress の管理画面から、[外観] → [ウィジェット] を選択します。

[ヘッダー右(フッター)ウィジェット] を選択して、コンテンツを作成します。


step
2
ヘッダー右の表示を消す


このままでは、ヘッダーの右側に同じコンテンツを表示しますので、ヘッダーには表示しないように設定します。



WordPress の管理画面から、[AFFINGER 管理] → [ヘッダー] を選択します。

[ヘッダーを分割しない] をチェックします。


二列目の作り方



WordPress の管理画面から、[外観] → [ウィジェット] を選択します。

[フッター右用ウィジェット(2列目)] を選択して、コンテンツを作成します。


三列目の作り方



WordPress の管理画面から、[外観] → [ウィジェット] を選択します。

[フッター右用ウィジェット(3列目)] を選択して、コンテンツを作成します。


その他のテクニック


サイト名とキャッチフレーズを表示しない



フッター一段目に [サイト名] と [キャッチフレーズ] を表示しますが、(ヘッダーの同項目は消さずに)フッターのほうだけ消す方法です。



追加CSSを定義して変更します。

WordPress の管理画面から [外観] → [カスタマイズ] → [追加CSS] を選択します。

次のコードを埋め込みます。


.footerlogo {
    display: none;
}

.footer-description{
    display: none;
}


クラス [.footerlogo] は、[(フッターの)サイト名] に対して反映し、[display: none;] で非表示にします。

クラス [.footer-description] は、「(フッターの)キャッチフレーズ] に対して反映し、[display: none;] で非表示にします。


まとめ


WordPress の有料テーマ 「AFFINGER6」 では多彩なフッターを作ることができます。



AFFINGER ご購入はこちら



  • フッターにメニューを表示する
  • フッターに1列目~3列目を作成する


かっこいいフッターを作ってくださいね!



Enjoy!フタター♪フタター♪フタタタター♪





WordPress のテーマ「AFFINGER6」の情報、テクニック一覧はこちらをクリック!










Presented By Irojiro Haraguro .Com

ブログランキング・にほんブログ村へ