対馬 俊彦
フォーラムへの返信
-
投稿
-
ご指摘のところにCSSを記載したら表示が崩れるので
という認識をお持ちのようですが、現状、CSS が正しく適用されています。
この状態から、ご希望に合うようにさらに CSS で調整していくことになります。
（１）メニューの幅が、コンテンツ全体の幅ではなくブラウザの幅いっぱいに広がる
width: 100%;により画面幅いっぱいに広がっていますので、
コンテンツ幅に合わせるためには、
width: 1110px;のように幅を指定する必要があります。（２）上側のカラム（FBとInstaのアイコンがある部分）が表示されない。
私のブラウザでは表示されています。
おそらく、ログインした状態でツールバーの後ろに隠れているのではないかと推測します。
該当URL のページのソースには CSS が出力されていませんので、
CSS を書いた場所が間違っている可能性があります。Outer ブロックの カスタム CSS に書くのが正しいです。
添付画像をご参照ください。レスが無いようなので質問を変えます。
このフォーラムでベクトルさんが回答するのは、ベクトル製品に関する
使い方 / ご意見・ご要望 / 不具合報告
ですので、今回のご質問は
弊社スタッフからの公式な回答は保証していません。
に該当すると思います。
私は詳しくない分野なので回答は無理ですが、
役に立ちそうな情報を見つけました。17日(日)に行われる下記の勉強会では税理士さんに質問できますし、
WordPress ユーザーの勉強会なので、
参加者の皆さんの中に回答してくれる方がいるかもしれません。https://wpzoom.connpass.com/event/295986/
税理士さんに聞くインボイス制度勉強会 #88 WP ZoomUPfont awesome 6.0で追加されたアイコンフォントが表示されていないと思われます。
x-twitter のアイコンが追加されたのはつい最近の Font Awesome 6.4.2 で、
現在 Lightning に同梱されているのは Font Awesome 6.1.0 です。
そのため、まだ x-twitter のアイコンが表示されません。お急ぎの場合、とりあえず以下の CSS を書けば 鳥 が X に変わります。
.fa-twitter::before,
.fa-twitter-square::before {
font-family: vk_sns;
content: “\e606”;
}Lightning 同梱の Font Awesome がアップデートされたら
この CSS を削除した方がいいです。上部メニューは非表示にしたい場合はどのように実施すれば宜しいでしょうか。
Header Top Navigation のチェックを外せば表示されなくなります。
添付画像をご参照ください。
「Lightning ヘッダー上部設定」のフォントのサイズ変更は行えるものでしょうか？
はい、できます。
8月28日 9:41 AM に私がお伝えしたページを読んで、まずご自身で調べてみてください。
グローバルメニューの位置指定が間違っていると思います。
誤: Header Top Navigation
正: Header Navigation添付画像をご参照ください。
サイトの HTML ソースを見たところ、原因は 1. ～ 4. の作業ではなさそうです。
以下の CSS が原因だと思います。
/* page header */ ::before { content: ""; position: absolute; top: 0; left: 0; background-color: #c6c6c6; opacity: 0; width: 100%; height: 100%; }::beforeは元々.page-header::beforeだったのではないでしょうか。VK Blocks Pro 1.61.1.0 にアップデートしてエラーが修正されたことを確認しました。
ありがとうございます。
.global-nav-list>li .global-nav-name { font-size: 30px; }上記 CSS は第3世代の Lightning G3 用のコードです。
Lightning Pro は第2世代なので必要なコードが違って、以下の記述になります。
.gMenu>li .gMenu_name { font-size: 30px; }コードの調べ方は、以下のページの
「変更したい箇所のCSSセレクタをデベロッパーツールで調べる」
のあたりを見ると書かれています。まだサイトを作り始めたばかりのように見えます。
これから作るのであれば、第3世代の Lightning G3 の使用も検討されるとよいと思います。アイディアがございましたらぜひ書き込みお願いいたします。
フックで出し分けるのが理想だと思うのですが、
ちょっとチャレンジしてみたところ、私には高すぎるハードルでした😩そこで、こんなコードを考えてみました。
function my_add_body_class($classes) { // カスタム投稿タイプ「イベント(event)」のイベント分類を示すクラスを body タグに付与する。 // タームが複数ある場合を想定している。 if( is_singular( 'event' ) ){ // カスタム分類名（スラッグ）を指定 $custom_cat_slug = 'event-category'; // タームを取得 $custom_cat_terms = get_the_terms($post->ID, $custom_cat_slug); if ($custom_cat_terms) { foreach($custom_cat_terms as $custom_cat_term){ $classes[] = $custom_cat_slug . '-' . esc_html( $custom_cat_term->slug ); } } } return $classes; } add_filter('body_class','my_add_body_class');body タグに
event-category-seminar
event-category-otherみたいなかんじでクラスが付与されますので、CSS で出し分けできます😊
横から失礼します。
個別のページで「セクションベースあり」「セクションベース無し」の設定はできましたが
もし、投稿のアーカイブページでのセクションベースの設定方法がございましたらご教示いただければ幸いです。サイト全体の設定を「セクションベースあり」にして、
セクションベース不要の固定ページなどを個別に「セクションベース無し」にする、
というアプローチをとればご希望の結果になると思います。また、
* 投稿がどんどん増えていく
* 固定ページはそんなに増えない
という典型的な WordPress サイトの場合はこのアプローチの方が合理的です。i タグって、いまアイコンでしか使わなくなっているので、
icon の i だと錯覚して昨日は安易なスクリプトを書きましたが、
italic の i でしたね。昨日のスクリプトだと、
<p>FAX番号 <i class="fax">000-000-0000</i></p>のFAX番号を読み上げてくれなくなってしまうので、
行が長くなってしまいますが、
以下のように Font Awesome のクラスを列挙する方がよさそうです。jQuery(function($){ $("i:is(.fa, .fa-brands, .fa-duotone, .fa-light, .fa-regular, .fa-solid, .fa-thin, .fab, .fad, .fal, .far, .fas, .fat)").attr('aria-hidden', 'true'); });Font Awesome のアイコンすべてに aria-hidden を設定すればいいのであれば、
以下の JavaScript ファイルを子テーマに追加すればいけそうです。jQuery(function($){ $("i[class^='fa']").attr('aria-hidden', 'true'); });テーマやプラグイン側に実装するのが大変そうな気がして、
案のひとつとして書いてみました。Font Awesome のサイトで aria-hidden のあり・なしを選べるのが理想のように思います。
24日に私が書いた内容がわかりづらかったようなので、
道案内だけになってしまいますが、また書かせてもらいます。このフォーラムではベクトル製品に関連しない質問もできますが、
公式サポート対象外なので、原則的にベクトルさんからの回答はありません。ベクトル製品となにか少しでも接点があれば回答しようと思うのですが、
その接点がまったく見つけられないので、（私を含めて）回答しづらい方がいるでしょう。待っていれば有志の参加者からの回答があるかもしれませんが、
たぶん、それはあまり期待できないと思いますし、
もし回答が得られるなら7月20日の質問のときに回答があったと思います。そこで、いま参加されているこのフォーラムではなく、
WordPress 全般を扱う WordPress 公式フォーラムで質問することをおすすめしました。WordPress 公式フォーラムのアドレスは
https://ja.wordpress.org/support/forums/
ですので、今回の質問を上記アドレスの公式フォーラムでしてみてください。
