[ 解決済 ] Bogoのメニューをヘッダーメニューに追加したい件

[神尾直志]

■ WordPress のバージョン
5.8.3

■ テーマ・プラグインは全て最新版で確認してください。
確認しました。

■ テーマの種類
Lightning ( G3 ) + Lightning G3 Pro Unit

■ テーマのバージョン
14.13.6

■ Pro Unit のバージョン
0.14.0

■ スキンの種類
Origin III

■ 関連しそうなプラグインを一つづつ停止して症状が改善するか確認してください。
確認しました。

■ プラグインの種類・バージョン
日英サイトの案件でBogoを考えており、いろいろ試しています。
ヘッダーメニューに日米の国旗と日本語、Englishとならべて、表示して切替ができないか、試行錯誤しています。簡単にできるのであれば、教えていただきたいです。

■ 期待する動作
ヘッダーメニュー日米の国旗と日本語、Englishが並ぶbogoの仕様で切替表できる

■ 自分で試した事
ウイジェットにはヘッダー設定メニューがなかった。カスタマイズのヘッダ設定を見るもそれらしいものがなかった。

■ 症状が発生するブラウザ
Chrome 92.0.4515.159

■ 実際の症状
表示できない

[Chiaki K]

こんにちは。
ヘッダーのグローバルメニューの上部にはなってしまうのですが、下記の方法ですと比較的簡単にヘッダー部分に表示していただけるかと思います。

PCでの言語スイッチャー表示イメージ

外観 ＞ カスタマイズ ＞ ヘッダー設定 ＞ヘッダーレイアウトで一番下の「ヘッダーウィジェットあり ＆ ナビ貫通」を選択する。
次に、カスタマイズ > ウィジェット＞ヘッダー右側エリアに「ブロックを追加」からショートコードブロックを追加し、 [bogo] を入力。その後[公開]ボタンを押して確定します。

これで、Bogo側で設定したスイッチャーが表示されるかと思いますのでお試しください。

そのままだとおそらく縦並びなので、下記のようなCSSを追加CSSに記述して横並びにできるかと思います。

.bogo-language-switcher{
	width: 100%;
	display: flex;
}
.bogo-language-switcher li+li{
	margin-left:10px;
}

また、ここまでですと、モバイル表示の時にはスイッチャーが見えないので、必要でしたら、「ウィジェット」の「モバイルナビ上部」にもショートコードブロックを追加して言語スイッチャーを追加しておくのもよさそうです。

スマートフォンメニューでの表示イメージ

以上、ご参考になりましたら幸いです。

• この返信は2年、 11ヶ月前にChiaki Kが編集しました。理由: 画像リンク切れのため再設定

[神尾直志]

こうのちあきさま

神尾です。Localでのテストですが、ひとまずは、添付の通りやりたいことは実現できました。
CSS、一応教科書を読んで少し触ったことがある程度なのですが、初めて実戦で使う経験が出来ました。

このように教えて頂けるフォーラムがあること、本当に素晴らしいと思いました。
ありがとうございました。LightiningPro　G3パック、1年分ちょうど購入させていただきました。
せっかくなので、自分の本業サイト以外にもいろいろ提案してlightningのすばらしさを広めてファンを増やして行こうと思います。

Headerにウイジェットを入れられるのは、Headerウイジェットあり＆ナビ貫通しかないようですね。
写真のようにちょっとヘッダーの高さ方向が、間延びしているので、CSSを読んでカスタマイズできないか、時間があるときにチャレンジしたいと思います。

フッターウイジェットテキスト１などのテキストの日英切替などもこれから可能かどうか見ていきたいと思います。

親切に教えていただきどうもありがとうございました。

Attachments:

You must be logged in to view attached files.

[投稿者]

投稿