無料のElementorだけで作ったヨガのコミュニティのLPのテンプレート

Elementorの新しい
無料テンプレートサイトが追加されました!

質問:

モバイルとPCでデザインが全く異なるヘッダー・フッターデザインをElementorではどのように制作すればいいでしょうか?

モバイル表示とPC表示ではデザインが全く異なるヘッダーデザインの場合、Elementorではどのように制作すればいいでしょうか?

ロゴの並びやメニュー配置が全く異なります。フッターも同様に全く異なるデザインです。

デザイン的に軽微な違いであれば、スタイルや高度な設定でデバイス毎の表示をコントロールするやり方がベストだと思いますが、デザインが大きく異なる場合、どのやり方が工数が少ないのかなあと悩み中です。

こうするといいよ!とアドバイスいただけたらとても助かります。

回答:

各要素をPC、タブレット、スマホそれぞれに対して表示非表示を変更できるのでそれを利用してデバイスによって全く見た目の違う表示にすることができます。

テーマビルダーで作るのヘッダーは1つ。ヘッダーの中にセクションを3つ作って、1つをPC、1つをタブレット、1つをスマホといった方法です。画像の箇所で表示or非表示を制御します。

この方法はヘッダーに限らず、見出しの改行位置をPCとスマホで変えたい場合など様々な状況で使えます。

TOFUラボに入れば更に多くの質問と回答のログが見れます!

関連した質問

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

Elementorの無料テンプレートサイト
新規追加されました。

WordPressの最新情報が
毎週届く無料メールマガジン

DiviやElementorの情報だけでなく、脆弱性が見つかったプラグインやテーマのリストも毎週届きます。セキュリティの強化につながります。 

管理人のナオミが書くメルマガ
海外でエンジニア歴10年以上
DiviとElementorに精通