highlight.jsの導入

よくブログに、コードを埋め込んであるけど、どのような方法があるの？？

このような疑問に回答したいと思います。

結論からいいます。highlight.jsを使用しましょう。

highlight.jsとは

コードをハイライトさせることが出来るJSのプラグインです。

このようにいい感じでハイライトしてくれます。

（highlight.jsなし）

<h1> <?php echo do_shortcode();?></h1>
<?php echo do_shortcode('[name]');?>
<?php while(have_posts()):the_post();?> 　　　　　　　　　　　　　　　　　　　　　　body {
background: #fff;
font-size: 1em;
}

(highlight.jsあり）

<pre><code>
<h1> <?php echo do_shortcode();?></h1>
<?php echo do_shortcode('[name]');?>
<?php while(have_posts()):the_post();?>

body {
  background: #fff;
  font-size: 1em;
}

</code></pre>

いかがでしょうか？

こんな感じでいい感じにハイライトできてしまいます。

詳細は次の公式サイトからどうぞ

Affinger5でのhighlight.jsの使用方法

Affinger5でhighlight.jsを使用するためには次の手順で行うことができます。

コピペするコード（現地点で有効なコード）

あとは、デコレートしたい部分を<pre><code> </code></pre>で囲むだけです。

<pre><code>

<h1><?php echo do_shortcode() ; ?></h1>

</code></pre>

よくプログラマーがおしゃれにコードを記述されていますよね。

これであなたもプログラマーの仲間入りですね。