週末はWordpressに新しい機能の実装すべくたくさんの方のブログを読み漁っております。
HTMLとCSSの知識はほぼゼロですが自分の手でコードを書くことで覚える！慣れる！
34歳でもまだまだ新しいことに挑戦できるってことが嬉しいです。
でも、もし結婚して子育てをしていたら日々の生活に追われてできなかったんだろうな～と思ってしまいます。
せっかく手に入れた知識技術を無駄にはできませんね。今日も頑張るしかない！！
ということで、今日は記事ごとに個別でCSSを適用する方法を勉強しました！
参考URL: プラグインを使わずWordPressで個別記事ごとにCSSを適用する簡単な方法
ちょっとプログラミングができるとプラグインには頼りたくないって思っちゃいません！？
評価の低いプラグインは使いたくないし、プラグインばかりになっちゃうし、なにより｢これなら自分でできるんじゃ？｣という謎の自信w
ということで早速こちらがコードです。(参考サイトのそのままなんですが･･･)
これをfooter.phpの</body>のすぐ上にコピペしました。
|
1 2 3 4 5 6 7 8 9 10 11 12 |
<script> (function() { var doc = document; var wpCss = doc.getElementsByClassName('wpcss'); var wpCssL = wpCss.length; for (i=0; i < wpCssL; i++) { var wpStyle = doc.createElement('style'); wpStyle.textContent = wpCss[i].textContent.replace(/\s{2,}/g,""); doc.head.appendChild(wpStyle); } })() </script> |
そして、記事のカスタムHTMLにCSSを記述。
下のコードで背景をピンクにしてみました～！
body {
background-color:#dc143c;
}
background-color:#dc143c;
}
まぁ、詳しいことは参考サイトに書いてあります！！w
大事なことは、、、コードを公開してくれる神がかった方がいて、私みたいなコピペしかできないやつでもWordpressで遊べるよ！ということですね☆
今度は他のCSSも適用できるか実験してみようと思います～