WordPressでコードを表示して共有する!
プラグインHighlighter Code Block

ブログを読んだ後、違和感をもつことがあります。

たとえば、プログラミングのコードを紹介している記事です。

違和感を発展的に解消していきます。

コードを表示・共有 違和感の正体と解消

ブログを読んだ後で違和感をもつことがあります。

投稿された内容とは別に、表示に対してです。

とりわけプログラミングのコードを示されている記事では、

  • きれいに表示されている上に
  • コードのコピーが可能である

といった表示形式がみられることがあります。

これに対して、

  • スクリーンショットを貼り付け
  • コードを閲覧するのみ

という表示もみられます。

たとえば、私の過去記事(笑)。

残念な状態=改善対象です。

今回WordPressのプラグイン「Highliter Code Block」で
コードの表示と共有を発展的に解消してみました。

コードを表示・共有 プラグインHighliter Code Block

「code syntax highliter wordpress」などでウェブを検索してみると、
コードをWordPressで表示するためのプラグインが見つかります。

私が「Highliter Code Block」を選択した理由は以下の通りです。

  • 表示がすっきりしている
  • コードのコピーが容易
  • 複雑な設定が不要

WordPressの「プラグイン」より「Highliter Code Block」を
インストールして有効化します。

「設定」→「[HCB]設定」より機能の設定が可能です。

私は初期設定の状態にしています。

WordPressのエディタでは下記のように利用が可能です。
 (私はクラシックエディタを使用しています)

print('Hello World')

簡潔ですね(笑)。

とはいえ、「Highliter Code Block」を導入することで、
もやもやした違和感は解消できました。

コードを表示・共有 Give & Take

私はプログラマーではありません。

税理士業務の効率化の一環でプログラミングを利用できないか
試行錯誤しています。

泥縄式でプログラミングの知識を補っているので、
ウェブ上のサンプルコードも参照しています。

試行錯誤は、

  • サンプルコードを参照→実験→成果の確認

というプロセスです。

効率化を局所的にとらえるなら、上記のプロセスで完結します。

一方で、情報発信を通じて、

  • 現在何らかのかかわりのある方
  • 今後関わりの可能性のある方

へと視野を広げると自己完結では物足りなくなります。

ノンプログラマーだからこその目線で発信できる内容もあります。

「Highliter Code Block」の導入と利用は
そうした情報発信のきっかけにもなります。

 

蛇足
プラグイン「Highliter Code Block」は利用方法で悩みませんでしたが、
ウェブ検索で難儀しました。
「WordPress コード 表示」ではお門違いの記事ばかり…。
専門分野以外の調べ物はことばの壁にぶつかりますね。

<ご案内>

■林友範税理士事務所

ご依頼はこちらから

■副業をされている方も応援しています!

副業から始める確定申告セミナー動画