1. fill.media
  2. Prism(プリズム)を使ってWor..
2024-02-06 01:43

Prism(プリズム)を使ってWordPressにコードをシンタックスハイライト表示する手順

Prism(プリズム)の使い方-WordPressサイトにコードを簡単にシンタックスハイライト表示できる人気ツール


fillメディア編集部では、WordPress上でコードを手軽にシンタックスハイライト表示できる便利ツール、Prismの使い方に関して、日本語解説記事を公開しています。


コピペで使えるコード等も掲載していますので、是非、ご覧下さい。

00:00
こんにちは。今日は、フィルメディア編集部から、WordPress上でコードを手軽にシンタックスハイライト表示できるプリズムの使い方をお伝えします。
まずは、プリズムの公式サイトにアクセスします。
画面右上に表示されているダウンロードのバナーをクリックします。
続いて、圧縮レベルを選択します。
その際、開発向けバージョンを選択すると、ファイルサイズがやや大きくなります。
ひとまずは、対象版を選択しておけばOKです。
次に、表示テーマを選択します。
気になるテーマがあれば、切り替えて表示を試してみましょう。
特段こだわりがなければ、デフォルトを選択しておけばOKです。
続いて、対応したいプログラミング言語を選択します。
後で付け足したい場合、改めてJSとCSSをダウンロードすれば良いだけですから、ひとまずは最低限の言語選択で良いでしょう。
次に、プラグインの選択を行います。
人気の高いプラグインとしては、一部の行をハイライト表示できるLINEハイライトや、
行番号を左側に表示できるLINEナンバーズ、クリップボードにコードをコピーできるようにするコピーボタンなどがあります。
なお、一部のプラグインにチェックを入れると、自動的に他のプラグインにもチェックが入ることがあります。
こうした関係は、プラグイン同士の依存関係によるものです。
続いて、ここまでの選択に沿ってカスタマイズされたJSファイルおよびCSSファイルをダウンロードします。
次に、ダウンロードしてきたJSファイルおよびCSSファイルをFTPソフトなどを使用して、
WordPressのコテーマフォルダに配置します。
その後、コテーマのファンクションPHPファイルにコードを追加します。
実際に追加すべきコードやその他利用上の注意点については、
フィルメディアの公式サイトの記事にて詳しくお伝えしています。
興味のある方は、コメント・概要欄をご覧ください。
01:43

コメント

スクロール