WordPressでcssを個別の記事,固定ページに適用させる方法

この記事が面白いと思ったらシェアをお願いします★

あまり活用の場がない無駄知識をあなたに。

訳あってよそ様のWordpressで執筆することがありました。どうしても個別の記事だけCSSを適用される必要があったのですが、投稿権限のみで、プラグインやFTPからいじることでもできず、どうにかCSSを当てられないかと考えていました。(通常は個別にCSSを適用させるプラグインや、wordpressのstyle.cssを触ればすぐにできるのですが)

スポンサーリンク

Javascript(jQuery)をインラインで記述してCSSを当てる

あたりまえですが、Javascriptでcssを追加、削除、変更などの操作ができます。javascriptの記述は

  • 外部ファイルを読み込み
  • headerのscriptタグに記載
  • 要素に直接書く

推奨されてはいませんが、要素にインラインでJavascriptを書いても動きます。

投稿画面でテキストエディタを開き、最下部にscriptタグをいれて記述します。

jQueryでのcssの操作方法

今回はjQueryが動くwordpressだったので、jQueryで記述してきます。

こんな感じで要素に対してcssを付け加えることができます。

ほかにも下記のような操作もできます。

要素を消す

hogeクラスがついたpタグが消えます。hideでも消えますが、hideとremoveの違いがいまいち分からず……。

違うテキストを表示させる

hogeクラスがついたpタグの中身がyourmomに変わります。

ではでは。

スポンサーリンク

この記事が面白いと思ったらシェアをお願いします★

コメントをどうぞ

メールアドレスが公開されることはありません。