今月納品したLP案件でLightningテーマの標準メニューから右にボタン2個をウィジェット追加というカスタマイズをしました。
その方法を健忘録も兼ねて書きます。
function.phpに追記するコード
function.phpに以下のコードを追記してください。
/* ヘッダー右ウィジェットの表示 */
function my_lightning_site_header_logo_after() {
if ( is_active_sidebar( 'header-right-widget' ) ) {
echo '<div class="site-header-sub">';
dynamic_sidebar( 'header-right-widget' );
echo '</div>';
}
}
add_action( 'lightning_site_header_logo_after', 'my_lightning_site_header_logo_after' );
/* ヘッダーのクラス名を変更 */
function my_lightning_get_class_names( $class ) {
$class['site-header'][1] = 'site-header--layout--sub-active';
$class['global-nav'][1] = 'global-nav--layout--penetration';
return $class;
}
add_filter( 'lightning_get_class_names', 'my_lightning_get_class_names' );_g3フォルダにあるtemplate-partsファイルのsite-header.phpの以下の「lightning_site_header_logo_after」のコードを「wp_nav_menu」のPHPコードの後ろへ配置します。
これをLightningテーマの初期の状態にしておくと右ウィジェットがメニューの左にきてしまうので注意です。
<?php do_action( 'lightning_site_header_logo_after' ); ?>変更後のsite-header.php
<?php
if ( class_exists( 'VK_Description_Walker' ) ) {
wp_nav_menu(
array(
'theme_location' => 'global-nav',
'container' => 'nav',
'container_class' => lightning_get_the_class_name( 'global-nav' ),
'container_id' => 'global-nav',
'items_wrap' => '<ul id="%1$s" class="%2$s vk-menu-acc global-nav-list nav">%3$s</ul>',
'fallback_cb' => '',
'echo' => true,
'walker' => new VK_Description_Walker(),
)
);
}
?>
<?php do_action( 'lightning_site_header_logo_after' ); ?>完成図
右ウィジェットでボタンを2列に表示できました。
真ん中にグローバルナビを設置して右にウィジェットでボタンを表示させるヘッダーの完成です。
こんな風に右に電話番号とお問い合わせボタンを設置することも可能です。
LPサイトだと電話番号と右にお問い合わせCVボタンがある構成は多いのでこの形はよく使っています。
投稿者プロフィール
- LP専門webデザイナー
-
フリーランスLP専門デザイナーです。
お仕事のご相談はお気軽にお問い合わせください。
インターネット経由で全国からオンライン経由で受注しています。
ブログではweb/LPデザイン、フリーランス、ランサーズのことなど記事を書いています。
最新の投稿
WordPressのLightningテーマのLPサイト制作依頼してみませんか？
WordPressは見出しテキストや本文はHTMLなのでランディングページ（LP）でもSEO対策ができるサイト制作が可能です。
ブロックエディタでパーツ毎にデザインを管理できるので自社でテキストや画像の差し替えの修正も可能です。
自社でマーケティングを行っているweb担当者様にWordPressのLPサイトはおすすめです。
当サイトもLightningテーマを使用したトップページ以外にブログ記事が80ページほどあるので「LP制作 フリーランス」「LPデザイン フリーランス」などのキーワードでGoogle検索順位4〜9位にくるなど意図した検索キーワードで検索上位にきています。
通常の1ページのLPサイトはweb広告（Googleリスティング広告など）からの集客を目的とした広告媒体のためSEO自体は弱いという弱点があります。
WordPressでLPサイトを構築することによって後に固定ページで下層ページを増やしたり、ブログ記事を追加したりが可能なため自社でSEO運営を行うことができます。
Web広告＋SEO対策の両方で集客が可能なWordPressブロックエディタのLP制作はいかがでしょうか。
制作のご相談はこちらから
24時間以内にご返信致します
（平日9〜18時まで※土日除く）
