WordPressのおすすめコメントアウトの方法!

公開日:2013年11月11日
最終更新日: 2015年2月19日

commentout_photo_01

こんにちは!

WordPressでサイトを構築されている方は、必ずコメントアウトを使用されると思います。ただWordPressのファイルは「html」「PHP」などが混在しているので、非常にコメントアウトが面倒な時があります。

そんな時におすすめなのが、WordPressでのおすすめのコメントアウトの方法です。

その他、コメントアウトの方法にも「html」「PHP」「CSS」「JavaScript」「.htaccess」などのファイルによって色々な書き方があるので、備忘録も兼ねて記事にしておきたいと思います。

目次!

1.WordPressでのお勧めのコメントアウトの方法!
2.htmlのコードをコメントアウト!
3.CSSのコードをコメントアウト!
4.JavaScriptのコードをコメントアウト!
5.PHPのコードをコメントアウト!
6..htaccessのコードをコメントアウト!

念の為、コメントアウトとは?

WEBに関わり始めたばかりの方は、コメントアウトという言葉自体が何の事か分からないかもしれないですね。

要はプログラムなどのコードを修正する時に、消したい内容を削除するのではなく、コメント化する事で無効にする事ができます。

もしかしたら、後でそのコードを使用するかもしれないから念の為、残しておくんですね。後は注釈などに利用するケースです。

WordPressでのお勧めのコメントアウトの方法!

使用例

<?php /* ?>
<?php
$a = 0;
*/
?>
<?php */ ?>

「<?php /* ?>」と「<?php */ ?>」で囲んだ部分がコメントアウトされます。WordPressでのコメントアウトはこれが一番便利です。

注意点!

「<?php /* ?>」と「<?php */ ?>」で囲んだ部分に「/*」「*/」「//」があると、入れ子でコメントアウトされますので、上手く動作しません。

実際にホームページを作成中は、試行錯誤しながら作成するので、コメントアウトを使用する事は多いです。

WordPressでのコメントアウトする時は、上記の方法をおすすめします。

htmlのコードをコメントアウト!

htmlで記述されたコードをコメントアウトする方法は、コメントアウトしたい部分を「<!-- -->」で囲みます。

使用例01

htmlのコード


<!DOCTYPE html>
<html lang="ja">

<body>
htmlのコードを<!--コメントアウト-->しています。
</body>

</html>

実際にブラウザ上での表示

commentout_photo_02

「<!-- -->」で囲んだ「コメントアウト」部分がブラウザ上では非表示になります。

使用例02

htmlのコード


<!DOCTYPE html>
<html lang="ja">

<body>
<!-- 後で修正 -->
htmlのコードを<!--<h2>コメントアウト</h2>-->しています。
</body>

</html>

実際にブラウザ上での表示

commentout_photo_03

後で修正する時に分かりやすく注釈に利用したり、
htmlのタグなども「<!-- -->」で囲めば非表示になります。

「<!-- -->」で囲んだ「<h2>コメントアウト</h2>」部分がブラウザ上では非表示になります。

注意点!

「<!-- -->」で囲んだ部分はブラウザ上では非表示になりますが、htmlのソースで確認すると誰でも見る事ができます。もちろんそのデータも読み込まれるので、ページを表示させるダウンロード量も増えてしまいます(ページが重くなるという事です)。

commentout_photo_04

クロームでのページソースの確認方法。

画面を右クリックし、「ページのソースを表示」をクリックで、ソースが表示されます。

CSSのコードをコメントアウト!

CSSで記述されたコードをコメントアウトする方法は、コメントアウトしたい部分を「/*」「*/」で囲みます。

使用例

CSSのコード

body {
  /*background: #ffffff;*/
  color: #000000;
}

上記の場合は「/*」「*/」で囲んだ「background: #ffffff;」がコメントアウトされ、CSSが適用されません。

注意点!

「/*」と「*/」で囲んだコメントをさらに「/*」と「*/」で囲むような入れ子にする事はできません。

JavaScriptのコードをコメントアウト!

JavaScriptで記述されたコードをコメントアウトする方法は、コメントアウトしたい部分を「/*」「*/」で囲むか、「//」を使用します。

使用例01

JavaScriptのコード

<script type="text/JavaScript">
/*
document.write("JavaScriptを使用します!");
*/
</script>

「/*」「*/」で囲んだ部分がコメントアウトされます。

使用例02

JavaScriptのコード

<script type="text/JavaScript">
//document.write("JavaScriptを使用します!");
</script>

「//」は閉じタグがなしで、改行は不可です。

注意点!

複数行のコメントアウトする場合は 「/*」と「*/」を使用し、1行だけコメントアウトする場合は「//」を使用します。「//」は閉じタグがなしで、改行は出来ません。

PHPのコードをコメントアウト!

PHPで記述されたコードをコメントアウトする方法は、「JavaScript」と同じようにコメントアウトしたい部分を「/*」「*/」で囲むか、「//」を使用します。

使用例01

<?php
/*
$a = 0;
*/
?>

「/*」「*/」で囲んだ部分がコメントアウトされます。

使用例02

<?php
//$a = 0;
?>

「//」は閉じタグがなしで、改行は不可です。

注意点!

必ず「<?php ?>」の中で使用する必要があります。

.htaccessのコードをコメントアウト!

.htaccessで記述されたコードをコメントアウトする方法は、「#」を使用します。

使用例01

.htaccessのコード

#.htaccessを使用します!

「#」は閉じタグがなしで、改行は不可です。

使用例02

.htaccessを"#使用"します!

行の途中からコメントアウトする場合は「”」「”」で囲む必要があります。

注意点!

「#」は閉じタグがなしで、改行は出来ません。

機会があれば、ご参考にして頂ければと思います。

最後に!

これでコメントアウトを自由自在に使いこなせるはずです。制作中に必ず使用しますので、チェックしておいてください。

以上「WordPressのおすすめコメントアウトの方法!」でした!

それではまた。

公開日:2013/11/11
最終更新日: 2015年2月19日
カテゴリー:CSS, WordPress

関連記事

responsive_thumbnail

2014/07/25

レスポンシブWEBデザインのCSSの書き方!

カテゴリー:CSS
最終更新日: 2015年2月27日

記事を読む

ssl_ie8_thumbnail

2014/03/02

SSLを設定したらIE8でCSSが効かない!

カテゴリー:CSS, jquery・js
最終更新日: 2015年1月5日

記事を読む

google-adsense-photo_01_cach

2013/09/29

Google Adsenseを読み込む時に背景色が一瞬、黄色になるのは何故?

カテゴリー:CSS
最終更新日: 2016年1月2日

記事を読む

新着記事

コメント/トラックバック

トラックバック用URL:

この投稿のコメント・トラックバックRSS




管理人にのみ公開されます

正しい数値を入力して下さい *
Time limit is exhausted. Please reload CAPTCHA.

最新の記事

カテゴリー

過去の記事

プロフィール

  • 著者:Masaki Yamashita

    大阪でWEB制作の仕事をしています。
    WEBデザイン、コーディング、WordPress・EC-CUBEの設置やカスタマイズなど何でもやっています。

follow us in feedly