解説

Prismを使用したシンタックス・ハイライト用のWordpressショートコード。
更新日:2017年2月16日

使用方法

「Post Snippets」に登録しておくことで、投稿画面から簡単に呼び出すことができるようになる。


[ins_prism type='{type}' title='{title}' title_type={type_type} number={number}]
<!--
コード
-->
[/ins_prism]

注意事項「コード」がコメントアウトされているが、これは必要なコードなので削除しないように!

パラメタ

type
ハイライト・タイプ(CSS等)
Prism - Supported languages
title
コードの上で表示するタイトル。
title_type
タイトル表示タイプ(true=重要、false=情報)
number
行番号表示フラグ。(true=表示、false=非表示)

コード(PHP)


下記コードを「function.php」に記載することで利用可能となる。


	/*------------------------------------------------------------------------------------------------------------------------
		Prism使用シンタックス・ハイライト
		説明:
			Prismを使用したシンタックス・ハイライト。

		ショートコードタイプ:
			囲み型ショートコードのみ。

		パラメタ:
			type		...	ハイライト・タイプ(CSS等)
			title		...	コードの上で表示するタイトル。
			title_type	...	タイトル表示タイプ(true=重要、false=情報)
			number		...	行番号表示フラグ。(true=表示、false=非表示)

		必須:
			1)Shortcodes Ultimate ( http://gndev.info/shortcodes-ultimate/ )
			2)シンタックスハイライト - Prism.js ( http://prismjs.com/ )

		注意事項:
			1)	囲い込まれたコンテンツの「<」「>」は自動的に変換されるため、使用可能。
			2)	「<--」「」のようなコメントアウトのコードは自動的に削除される。
			3)	囲い込まれたコンテンツのショートコードは実行されない。 
				但し、タイトル部分のショートコードは実行される。
			4)	囲い込みコンテンツのないものは、何も表示されない。

		更新履歴:
			2016/11/30	新規作成												浅野 利博
			2017/02/11	タイトルの表示方法を変更。								浅野 利博
	————————————————————————————————————————*/
	function prism_shortcode( $atts, $content = null )
	{
		// 囲み型ショートコード指定以外の場合には、空のコンテンツを返す。
		if( is_null( $content ) )
		{
			return ”;
		}
	    $param = shortcode_atts
	    		(
	    			array
	    			(
						‘type’ => ‘html’,
						‘title’ => ”,
						‘title_type’ => ‘false’,
						‘number’ => ‘true’
					),
					$atts
				);
				
		$result  = ‘<div>‘;
		if( strlen( $param[‘title’] ) > 0 )
		{
			if( $param[‘title_type’] === ‘true’ )
			{
				$result .= do_shortcode( ‘[su_label type="important" class="color_red"]‘ . do_shortcode( $param[‘title’] . ‘[/su_label]‘ ) );
			} else {
				$result .= do_shortcode( ‘[su_label type="info" class="color_red"]‘ . do_shortcode( $param[‘title’] . ‘[/su_label]‘ ) );
			}
		}
		$result .= ‘<pre><code class="language-' . $param['type'];
		if( $param['number'] === 'true' )
		{
			$result .= ' line-numbers';
		}
		$result .= '">';
		
		$content = str_replace( '', '', $content );
		$content = str_replace( '', '', $content );
		$content = str_replace( '<', '<', $content );
		$content = str_replace( '>', '>', $content );
		
		$result .= $content;
		
		$result .= '</code></pre></div>‘;
		
		return $result;
	}
	add_shortcode( ‘ins_prism’, ‘prism_shortcode’ );

注意事項

重要
  • 囲い込まれたコンテンツの「<」「>」は自動的に変換されるため、使用可能。
    但し、構文エラーになりますので、「&lt;」「&gt;」とすることをオススメします。
  • HTMLコメントアウトのコードは自動的に削除される。
  • 囲い込まれたコンテンツのショートコードは実行されない。
    但し、タイトル部分のショートコードは実行される。
  • 囲い込みコンテンツのないものは、何も表示されない。

更新履歴

2016/11/30 … 浅野 利博
新規作成
2017/02/11 … 浅野 利博
タイトルの表示方法を変更。

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.