2017.06.14皆さん、WordPressのカスタマイズ楽しんでますか!?デザインをカスタマイズしだすともう止まんなくなるんですよね。そんな暇あったら記事書けよって話なんですが・・・。好きにやるのが一番です。そんなわけで、WordPressの面白いカスタマイズを紹介・・・。いきたいところですが、今回はもっと基本的な部分。スタイルシート(CSS)の綺麗な書き方について紹介したいと思います。web制作においては超基本的なことなんですが、WordPressはweb素人の方も使っている人が多いと思うので。知っておくと地味に良いですよ、これ。目次WordPressのCSSはコメントアウトで見やすく整理CSS追記で思わぬデザイン崩れが起きることも・・・コメントアウトはコードを見やすくするための”メモ”最後にスポンサーリンクWordPressのCSSはコメントアウトで見やすく整理カスタマイズを繰り返していると、スタイルシート(CSS)が長くてごちゃごちゃしてきます。今はweb初心者も、コピペのみで簡単なカスタマイズが出来ますからね。やっているうちに、気付いたら「これ何のコードや・・・」なんてこともよくあるでしょう。CSS追記で思わぬデザイン崩れが起きることも・・・スタイルシート整理の前に知っておいてもらいたいこともあります。それは、CSSの追記にはデザイン崩れの危険性もあるんだということ。WordPressに関していえば、テーマの違いによってCSSの記述方法も違います。自分のサイトにあったCSSコードじゃないと、思わぬところでデザインが崩れてしまうこともあるんですよ。有料テーマで細部まで独自に作り込まれている場合は特にですね。特殊な構造してますから。最低限、自分のテーマに対応しているか確認しておくと安全でしょう。そんなわけで、自分が追記したCSSコードはしっかり管理しておくことがけっこう重要。問題が起きても自己責任ですからね。CSSの知識が浅い人ほどよくよく整理しておきたい。コメントアウトはコードを見やすくするための”メモ”それでは本題。スタイルシートをきれいに記述する方法の紹介です。スタイルシートを整理するときには「コメントアウト」という機能を使います。これは簡単に言うと、コードの途中に”メモ”が書ける機能です。実例を見てみましょうか。僕が使っている「Simplicity」というテーマのCSSファイル(親テーマ)を見ると、こんな感じでコメントアウトが使われています。「この部分のCSSコードは基本設定に関するやつ!」と一目で分かりますね。どれだけ記述が長くても、このようにその都度メモしておくことで、後で見返したときすぐに何に関するコードなのかが思い返せます。これをやっておくことで、万が一レイアウトの不具合を見つけたときにも、非常に対応が取りやすいんですよ。実際には、コメントアウトはこれだけのコードで出来ます。/*メモ*/ですが、これだけではせっかくのメモ書きも見にくくて仕方がない。「/*」~「*/」の間は何を書いてもいいので、視覚的にパッと目に飛び込んでくるように工夫しているわけです。こんな感じもありでしょう。最後にWordPressのカスタマイズは、スタイルシート内で出来ることが非常に多い。今は、記述コードがちょっとでもいずれ必ず増えてくるでしょう。できるだけ早いうちにこの方法で整理しておくことをおすすめします。それでは楽しいカスタマイズライフを!WordPressカスタマイズTwitterFacebookはてブPocketLINE今村りょうCooNelNelスポンサーリンクスポンサーリンクスポンサーリンクスポンサーリンクプロフィール今村りょう普段は家でブログ、アフィリエイト、ネットショップをやってます。趣味は料理と家飲みです。みの牛すじカレー!お取り寄せレトルトカレーの魅力2020.02.10活きたうなぎを捌いて「蒲焼き」と「白焼き」を作ってみた2020.01.23民芸コンロを使ってちょっと贅沢な家飲みを!卓上七輪としても使えます2020.01.19焼き鳥との相性97%以上の日本酒「純米吟醸94(きゅうじゅうよん)」で家飲み!2020.01.13熊本馬刺しは熊本産じゃない!?「純熊本産馬刺し」は全国流通たったの1%2019.12.18ポテトサラダにクリームチーズを加えて居酒屋風ポテサラを作る!2019.11.29きびなごの刺身の漁師漬けが酒のつまみとして最高な件2019.11.21プロフィール今村りょう料理が好きな家飲みブロガーです。お店ではなく、家でゆったり飲む「家飲み」の情報を発信中。普段は在宅でwebのお仕事してます!包丁に関する知識や、家で魚を捌いて食べる楽しさを発信する「包丁日記」も運営中。CooNelNel.。