[ 質問者返信待ち ] 投稿ページのタイトル非表示について
[ 質問者返信待ち ] 投稿ページのタイトル非表示について
- このトピックには13件の返信、3人の参加者があり、最後に
により3週、 1日前に更新されました。
-
投稿
-
■ WordPress のバージョン
WordPress 6.9.1■ テーマ・プラグインは全て最新版で確認してください。
確認しました。■ テーマの種類
Lightning Pro■ テーマのバージョン
8.24.0■ スキンの種類
Origin II■ 期待する動作
施工事例(works)投稿ページ/イベント(event)投稿ページの上部にタイトルが表示されるようになってしまった。すべての画面サイズでタイトル部分が表示されないようにしたい。
また今後もページが増えていくカテゴリーのため、個別ページCSSではなく、外観＞カスタマイズ＞追加CSSで一括非表示ができれば希望■ 自分で試した事
以前こちらのフォーラムでご教授いただき、非表示になっていたのですが、色々触っていたら同じようにしてもタイトルが表示されてしまいます。カスタム投稿タイプで作成したため、ヘッダー非表示のボタン等はありません。
①外観＞カスタマイズ＞追加CSSに以下を記載
/*WORKSのタイトルを非表示*/
.works h1.entry-title{
display:none;
}/*eventのタイトルを非表示*/
.single-event h1.entry-title{
display:none;
}
→どちらもパソコン・モバイルともにタイトル表示が出る②外観＞カスタマイズ＞追加CSSに以下を記載
/*EVENTのタイトルをPC以外非表示*/
.event .entry-meta_items {
display: none;
}/*WORKSのタイトルをPC以外非表示*/
.works .entry-meta_items {
display: none;
}
→モバイルではタイトルが出ないが、パソコンではタイトルが出る確認方法を調べ.entry-headerに変更したりもしましたが当方の知識では変化がありませんでした。
■ 症状が発生するブラウザ
クローム■ 実際の症状
タイトルが出てしまう。
ご教授いただけますと幸いです。該当URL : https://*********※該当URLはフォーラムライセンスが有効のユーザーにのみ表示されます
pepepe 様
ソースを確認する限り、以下で問題ないかと思います。
/*WORKS、EVENTのタイトル・メタ情報を非表示*/ article.works div.entry-meta, article.event div.entry-meta { display:none; }※もし効き目がなかったら
display:none !important;に変更をお願いします。
※確認する際は、CSS変更後にキャッシュを一度クリアしてからご確認いただく・もしくはスーパーリロードにてご確認いただくことをおすすめします。——
モバイルではタイトルが出ないが、パソコンではタイトルが出る
ソースをよく見れば分かりますが、以下のコードは投稿日・最終更新日等のメタ情報のみを非表示化するものです。
タイトルには.entry-meta_itemsのクラスが指定されていませんので、当然有効ではありません。/*EVENTのタイトルをPC以外非表示*/ .event .entry-meta_items { display: none; } /*WORKSのタイトルをPC以外非表示*/ .works .entry-meta_items { display: none; }早速ありがとうございます。
外観＞カスタマイズ＞追加CSSにご教授いただいた内容を入れましたが反映せず、display:none !important;にしても非表示になりませんでした。
キャッシュクリアやシークレットモードでの確認もしましたが…モバイルもPCもタイトルが表示されている状態です。pepepe 様
ご対応ありがとうございます。
非表示が反映されていないとのことですが、少なくともこちらからだと問題なく反映されておりますね。
拡張機能が邪魔しているとか、pepepe様環境が原因の可能性が考えられるかと思います。試しに、拡張機能を全てオフにしていただくか、もしくは全く違うブラウザや普段とは異なる環境からアクセスしてみてはいかがでしょうか？
ありがとうございます。
再度windowsもmacもスーパーリロードを行い確認しましたが、非表示になりません。1点変気づいた点としては
PC→タイトルの上の日付・更新日・カテゴリー＋タイトルの両方が表示される
モバイル→タイトルのみ表示されて上の日付・更新日・カテゴリーは非表示になると反映しておりました。
拡張機能をすべてオフにする、というのはプラグインをすべて無効化にするということでしょうか？
度々の質問になり申し訳ありません。pepepe様
確認しました。
結論、コードを挿入する場所が明らかに間違っています。media (max-width: 991.98px){ body, html { font-size: 15px; letter-spacing: 1px; } /*【非反映】WORKS、EVENTのタイトル・メタ情報を非表示*/ article.works div.entry-meta, article.event div.entry-meta { display:none !important; }これだとタブレット環境以下のみの条件として処理されることになるため、PC環境で表示されても文句は言えません。
※おそらく冒頭のご質問の事象も同じ事が要因ではないでしょうか？
※もし上記mediaの{}括弧が閉じ忘れであれば、ご対応ください。
※細かくは確認していませんが、全体を通して他にも{}括弧の閉じ忘れの可能性もございます。念のためご確認ください。body, html { font-size: 20px; }試しに、冒頭のこの下に記載場所を変えてみて、動作しますでしょうか？
—
拡張機能をすべてオフにする、というのはプラグインをすべて無効化にするということでしょうか？
拡張機能というのは通常ブラウザの拡張機能を指します。
たまにではありますが、ブラウザの拡張機能が要因で誤作動が起こることがあります。ありがとうございます！
追加CSSの中でbodyの下に置くということを知りませんでした！
大変勉強になりました！！！教えていただいた箇所に
article.works div.entry-meta,
article.event div.entry-meta {
display:none ;
}
だと日付とカテゴリーのみが消えたので以下入力したところ、タイトルまですべて消えました。/*【場所移動禁止bodyの下におく】WORKSのタイトル･日付を非表示*/
.works header{
display:none;
}/*【場所移動禁止bodyの下におく】EVENTのタイトル･日付を非表示*/
.event header{
display:none;
}たくさんご教授いただき、ありがとうございます。
pepepe 様
ひとまずは解決いただけて何よりです。
ただ、順番を変えた方が良いというのは一つの応急処置案というべき内容で、本線は括弧の閉じ忘れによる誤作動、誤認識と思われます。
（ただし、情報の整理のためにも順番を意識した方が良いのは確かですので、そこは認識ください）▼上でも軽く触れましたが、以下閉じ忘れが残ったままなので修正ください。
/* --- モバイル（991.98px以下）の設定 --- */ @media (max-width: 991.98px) { body, html { font-size: 15px; letter-spacing: 1px; } } /* ←不足していた閉じカッコを追加 */ /* --- タブレット・PC（768px以上）の設定 --- */ @media (min-width: 768px) { .gMenu li li { background-color: #d7bc8f; } .gMenu li li a:hover { background-color: #f0e7d4; } .gMenu > li:before, .gMenu > li.menu-item-has-children::after { border-bottom-color: #d7bc8f; } } /* ←不足していた閉じカッコを追加 */素朴な疑問ですがあえて Lgitning Pro を使っている理由はありますか？
Lightning 無料版 （ 外観 > カスタマイズ > Lightning 機能設定 の 世代設定で Generation 3 を選択 + theme.json を有効 ）と Lightning G3 Pro Unit の組み合わせの方が今回非表示にしているような部分もCSSを書かなくても非表示設定できる部分が多いですし、パターンライブラリのパターンも Lightning G3 ＆ theme.json 有効 の前提で作ってますので、Lightning Pro だと一部崩れたり細かい設定項目がでなかったりします。
Lightning Pro はテーマの説明にも記載の通り旧型ですので、新規リニューアルなら Lightning 無料版 + G3 Pro Unit の利用をおすすめします。
既に書いたCSSがいくつか効かなくなって設定しなおしになるかもしれませんが、
やりとりを見る限り昔から Lighting Pro を使っていたというよりこれからというサイトに見受けられますので、それなら少しでも新しいテーマを使っておいた方が良いと思います。あとCSSカスタマイズにつきましてもこちらも確認すると自分で対応できる幅が増えると思います。
ご丁寧にありがとうございます。
モバイル等に大カッコの概念があることも知りませんでした、過去いらないカッコだと思い消してしまっておりました。
ご丁寧に分かりやす記載を教えていただき本当にありがとうございます！ありがとうございます！
こんなサイトですが、もう５年ほどLgitning Proを使っており、Lightning 無料版 + G3 Pro Unit の移行も検討しましたがメインの業務のすき間時間でサイト編集をしているため、大幅なサイト崩れにすぐに対応できないため心配で取り組めておりませんでした…石川様がこれからのサイトとご覧いただくレベルなので、大幅な崩れほどではなさそうですし、現在少し時間的にサイトを編集する時間があるので、この機会に移行してみようかと思います！
参考ページを教えていただけ、大変ありがたいです！
あ、なるほど、昔からの運用だったのですね。
それなら Lightning Pro の使用も納得です。とは言え G3 への切り替えもよほどカスタマイズしていなければそんなに大変じゃないと思うので、
頑張ってみてください。また不明点など出ましたらお気軽に投稿ください。
- このトピックに返信するにはログインが必要です。
