Wordpressで、一つのページだけに特別なクラスをつける方法を知りたい

Question

優しい方の回答をお待ちしております。(´･ω･`)

Wordpressについての質問です。

###悩んでいること
作成中のブログで、あるコードを実装するために、トップページのwrapperの部分に特別なクラスをつけようと思ったのですが、

• 特別なクラスをつけるためのコード
• コードを書く場所

この二つがわからず、停滞しています。

###求めていること
どうやったら、トップページのwrapperに特別なクラスをつけることができるのでしょうか。

###試したこと
特別なクラスの付け方ついての記事を探した
見つけた記事：https://on-ze.com/archives/1316（body_classの使い方について）
https://takuo4649design.com/weblog/note/archives/9686(CSSでのクラスの付与方法について)
https://www.sejuku.net/blog/25620（CSSでのクラスの使い方について）

###コード
ソースコードなんですが、こちらのサイトで、ディベロッパーツールを使うと見れると思います。
「直接ここに貼れよ！」と思うかもしれませんが、
ディベロッパーツールのコードがコピペできないので、直接ここに乗せることができないのです。
（自分がディベロッパーツールのコピペの方法を知らないだけだったら申し訳ない）
サイトURL：https://idealsblog.com/

###補足情報
Wordpressのバージョンは5.4.2です。
使用中のテーマは「lionblog」です。

Comments

[CHERRY]

トップページのどの部分にどのようにつけたいのでしょうか？

その部分の HTML やソースコードを提示していただくことはできないでしょうか？

[idealsblog]

ご質問ありがとうございます。
トップページの「div.l-wrapper」の部分に、クラスをつけたいと考えています。

「そこに独自のクラスを追加すればいいだけでは？」
と思うかもしれませんが、知識不足のために独自のクラスの追加方法がわからないのです。
知識不足で申し訳ございません(´;ω;｀)

追記：特殊なテーマの為、body_class()にhomeとかのクラスがつかないようになっています。
だから、「homeを識別に使う」ということは残念ながら出来ないのです。

[idealsblog]

追い追記：ソースコードなんですが、こちらのサイトで、ディベロッパーツールを使うと見れると思います。

「直接ここに貼れよ！」と思うかもしれませんが、
ディベロッパーツールのコードがコピペできないので、直接ここに乗せることができないのです。
（自分がディベロッパーツールのコピペの方法を知らないだけだったら申し訳ない）
サイトURL：https://idealsblog.com/

[m.ts10806]

ガンガン後だしする人に優しくできる人ってなかなかいないと思います。厚意で成り立つ場です。
出せるものは最初から全部だしてください。
折角の回答が無駄になります。

[m.ts10806]

４時間探したとか書かれてもその４時間やったことをなにも書かなければなにもやってないのと同じです。
量ではなく質を伝えてください。
やり方が悪ければ何日かけても見つからないし、良ければ数分で見つかる。
でも「なにをどうやったか」書かないと良いか悪いかも誰も判断できない。
だから「丸投げだ」という指摘がつきます。

[idealsblog]

この質問を見て不快感を感じた、有識者の皆様へ

曖昧な質問をしてしまい、本当に申し訳ございませんでした。
今後は、このようなことがないよう、誠心誠意努めていきます。
大至急、質問を分かりやすいように編集しますので、
しばしお待ちください。

Answer 1

ただ識別したいだけの目的なら、そのテーマがbody_class()関数を使っていれば、homeなどのクラスが勝手に付きます。そのテーマがbody_class()関数を使っていれば、それにクラスを独自に追加することもできます。

【body_class() | Function | WordPress Developer Resources】
https://developer.wordpress.org/reference/functions/body_class/

【WordPress：body_class()に独自のclassを追加する方法＋代替で独自のidやclassのみをbodyに指定する方法 | NxWorld】
https://www.nxworld.net/wordpress/wp-body-class-adding-more-classes-and-alternative-method.html

Comments

[idealsblog]

なるほど、それなら解決できるかもしれません...
しかし、私のテーマは特殊なテーマの為、
body_class()にhomeとかのクラスがつかないようになっています。
だから、「homeを識別に使う」ということは残念ながら出来ないのです。
つまり、独自のクラスをつけるコードを書く必要があるのです。
（そこで、このコードの書き方がわからない）

ただ、普通のテーマを使っている人ならこの方法はとても良いと思います。

[kei344]

単純にテーマの編集の仕方がわからないのでしょうか。それとも、WordPressによる分岐でしょうか。どちらも「テンプレートの作り方」が載った入門書を探すことをお勧めします。既存のテーマを編集する際には「テンプレートの作り方」の知識があったほうが、問題の箇所を探したり解決したりがやりやすくなりますよ。

[idealsblog]

kei344様、ご返信ありがとうございます。
詳細を明示できていなくて申し訳ございません。

分からないことの詳細：CSSを使っての、wrapperへの独自classの付与の仕方が分からなかったのです。

追記：これを学ぶための入門書はもちろん購入予定です。
ですが、一か所だけホームページの改良をしたいと思っているので、
本が届くまでのしのぎとして、このクラスの付与のやり方をここで質問しました。

この質問の経緯をご不快に感じたのなら、本当に申し訳ございません。

[kei344]

本文>見つけた記事
そのリストなら「WordPress 分岐 トップページ」で検索してみてください。

[idealsblog]

解決できそうな条件分岐のやり方のサイトが見つかりました。
（URL:https://webdesignday.jp/inspiration/wordpress/4765/）

今回は極めて悪質な質問をしてしまい、本当に申し訳ございません。
そして、こんな質問に親切に答えてくださった皆様、
本当にありがとうございました(｀･ω･´)ゞ

[kei344]

> 悪質な質問
何についていっているかはわかりませんが、公式の「質問するときのヒント」をふまえて質問すれば（比較的）丁寧な質問になると思います。

【質問するときのヒント｜teratail（テラテイル）】
https://teratail.com/help/question-tips