アドセンスを非表示にする記事を書こうとしたら、
説明のためのタグを入れると、
そのタグが有効になってしまって困りました。
説明のためにタグを記載して、
・タグが機能しないように
・しかもコピペができるように
するにはどうすればいいのかな。
良く見る こういった状態にしたい。 ↓
<div class='non-ads'> <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <!-- レクタングル中01 --> <ins class="adsbygoogle" style="display:inline-block;width:300px;height:250px" data-ad-client="ca-pub-4232461656474788" data-ad-slot="061698734"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> </div>
そこでいろいろ調べて、こちらも時間をかけてやっとできましたので忘れないように記事にしておきます。
目次
ソースコードをエディタのように表示できるプラグイン
SyntaxHighlighter Evolvedをインストールする
Word Press の管理画面 ダッシュボードに行きます。
プラグイン → 新規追加 を選択します。
次に キーワード の覧に SyntaxHighlighter Evolvedと入力します。
SyntaxHighlighter Evolved の 今すぐインストール をクリックします。
インストールができたら、 有効化 をクリックして有効化します。
これで SyntaxHighlighter Evolved が有効化されました。
SyntaxHighlighter Evolvedの設定をする
左側のメニューの 設定 → SyntaxHighlighter Evolved を選び、SyntaxHighlighter Evolved の設定画面に移動します。
SyntaxHighlighter Evolvedのバージョンを選ぶ
バージョン2 または バージョン3 のどちらかを選びます。行の折り返しが許可されています。
•バージョン3
長い行の場合は横スクロールバーが表示されます。
訪問者がマウスを使用してドラッグかダブルクリックで、コードの部分を強調表示し、クリップボードにへコピーできます。
SyntaxHighlighter Evolvedのテーマを選ぶ
テーマ のところで、ソースコードの表示スタイルを選びます。私は Django を選んでいます。
表示スタイルは、設定画面の下のほうに プレビュー が表示されていますので、そちらで確認ができます。


規定の設定をする
規定の設定これで、 投稿の編集 画面を閉じて、各記事の画面に移動します。
SyntaxHighlighter Evolvedの使い方
記事の中でショートコードを設置する
表示したい記事の投稿ページにいきます。
そこで 表示したいソースコードを [ ]ソースコード[/ ] で囲みます。
例えば、下記のようにすると
このように表示されます。
<div class='non-ads'> <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <!-- レクタングル中01 --> <ins class="adsbygoogle" style="display:inline-block;width:300px;height:250px" data-ad-client="ca-pub-4232461656474788" data-ad-slot="061698734"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> </div>
ソースコードの種類によって [ ] の中を変更します。
これで完成です。