Google chrome（グーグル ク...
続きを読む
Elementorで、プラグインを使用してヘッダーとフッターを無料で簡単に作る方法を紹介します。
プラグイン「Elementor Header & Footer Builder」を使用して作成します。
Elementor Proを導入していなくても、Elementorでヘッダーとフッターの作成が可能です！
ヘッダーとフッターの作成は、無料で簡単に使えるプラグイン「Elementor Header & Footer Builder」を使用します。
↑ワードプレスのダッシュボードのメニューから「プラグイン」をクリックし、画面上部の「新規プラグインを追加」をクリックします。
↑検索欄に「Header」と入力すると、「Elementor Header & Footer Builder」が表示されるので、「今すぐインストール」をクリックします。
インストールが完了すると、「有効化」というボタンが表示されるので、クリックしてプラグインを有効化します。
↑プラグインを有効化すると、メニューの「外観」の中に「Elementor Header & Footer Builder」が表示されています！
↑メニューから「外観」→「Elementor Header & Footer Builder」をクリックします。
そして画面上部の「ADD NEW」をクリックします。
↑ADD NEWをクリックしたら、編集画面が表示されます。
タイトルに「ヘッダー（またはフッター）」などわかりやすい名前をつけます。
Type of Template でヘッダーの場合は「Header」、フッターの場合は「Footer」を選択します。
↑「Display On」を「Entire Website」に設定すると、全てのページでヘッダーが表示されます。
ここまで作成したら、「下書き保存」をクリックして一旦保存します。
↑フッターも「ADD NEW」をクリックして、ヘッダーと同様の手順で作成します。
↑ヘッダー（またはフッター）の編集画面で「Elementorで編集」ボタンをクリックします。
↑新たなセクション（コンテナ）を作成し、カラム数を選択します。
今回は、「キャッチコピー」、「ロゴ」、「メニュー」で配置したいので３カラムの構造を選択します。
↑それぞれのカラムに要素を追加していきます。
メニューは、「Navigation Menu」ウィジェットを選択すると簡単にメニューが配置できます。
↑ただし、メニューはあらかじめ作成していなければ表示されません。
メニューの作成は、ワードプレスのメニューから「外観」→「メニュー」で作成できます。
「メニューを保存」のクリックをお忘れなく👍
↑メニューの見た目のカスタマイズは、「Navigation Menuを編集」の「スタイル」で可能です。
メニューボタンの間隔や文字の色（通常時、マウスオーバー時など）を細かく設定できます。
↑最後に、左下の「公開」ボタンをクリックします。
↑フッターも、ヘッダーと同じ手順で作成します。
フッターは、セクション（コンテナ）の背景色を変更し、ロゴ、プライバシーポリシーページのリンク、Copyrightを縦に１カラムで記載してみました。
↑ヘッダーとフッターが完成しました！
今回は、プラグイン「Elementor Header & Footer Builder」を使って、無料で簡単にヘッダーとフッターを作成する方法を紹介しました。
Elementorを使ってウェブサイトやブログを制作されている方はぜひこの方法を試してみてください！
「Elementor Header & Footer Builder」を使って作成したヘッダーを固定する方法は、こちら↓の記事をご覧ください！
2024-12-08
Sunday
20代後半のWEBマーケター&WEBデザイナー
新卒で商社に入社しWEBマーケターとして勤務後、
カナダに渡航し現地企業のWEB制作と
マーケティング支援を行う。
現在は帰国し某企業でWEBマーケターをしています。
自分がWEBマーケター・WEBデザイナーとして
仕事をしているときに気になった事を
調べた経緯を残しておきたいなという思いと、
それを誰かのお悩み解決に
役立てることができたらいいなと思っています。
“ネコとレモンのWEBマーケ＆デザインブログ”
みたいな感じで覚えてもらえたら嬉しいです😺🍋
Google chrome（グーグル ク...
続きを読む
これからWEBマーケティングを学びたい人...
続きを読む
