SyntaxHighlighter ソースコードを美しく

こんにちはメルです。

今日は、前々から入れてみたかったプラグインを入れました。

 

SyntaxHighlighter
ブログなどでソースコードを公開するときなどに、美しく表示できるプラグイン

 

WordPress標準でやろうとすると、スタイルシートをカスタマイズしたりしなければならないのですが、標準のblockquoteを使うとこんな感じに。。↓


あああああああああ


しかも、<html>のタグに使われているは半角のままだとHTMLとして表示してしまう為、ソースとして見せたい場合には<などに変換してやらないといけないので非常にめんどくさいのです。

このプラグインを導入するとそういった面倒も一切なくなり、[html]と[/html]の間にソースをコピペするだけで良くなります。

こんな感じです↓

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<title>PHP Code Example</title>
</head>
<body>
	<h1>PHP コードサンプル</h1>

	<p><?php echo 'Hello World!'; ?></p>

	<p>この行はハイライトされました</p>

	<div class="foobar">
		この	行は	スマート
		タブ	の	例
		です。
	</div>

	<p><a href="http://wordpress.org/">WordPress</a></p>
</body>
</html>
body{ color: #333; }

/*●リンク文字*/
a{ text-decoration: underline; }

a:link,
a:visited{ color: #00b; }
a:hover,
a:active{ color: #f60; }

#! /usr/local/bin/perl

$ENV{'TZ'} = "JST-9";
($sec,$min,$hour,$mday,$mon,$year,$wday,$yday,$isdst) = localtime(time);
$year  = sprintf("%02d",$year + 1900);$month = sprintf("%02d",$mon + 1);
$mday  = sprintf("%02d",$mday);$hour  = sprintf("%02d",$hour);
$min   = sprintf("%02d",$min);$sec   = sprintf("%02d",$sec);
$week = ('日','月','火','水','木','金','土') [$wday];  $today = "$month/$mday($week) $hour:$min";

 

まぁほとんどの方は必要のないプラグインなのでしょうが、前々から導入したかったのでうれしくてつい書いちゃいました(笑

 

 

SyntaxHighlighterプラグインのインストール方法

 

1.管理画面のプラグイン新規追加ページに移動する。

SyntaxHighlighter01

 

 

2.「SyntaxHighlighter」と記入し、プラグインの検索をする。

 SyntaxHighlighter02

 

 

3.いますぐインストールをクリックで自動的にインストールされます。

SyntaxHighlighter3

 

 

4.プラグインを有効にしたら終了です。

 

 

SyntaxHighlighterの設定

WordPress管理画面の「設定」の中にメニューが追加されますので
そこから設定が出来ます。

 SyntaxHighlighter4

 

設定ーページに移動したらまず、SyntaxHighlighterのバージョンが3だと、ソースの折り返しが使えないのでバージョン2に変更。

SyntaxHighlighter5

 

次にテーマですが、色々あるので試してみてかっこいいと思うものを選んでください。変更するとページ下でプレビューしますので確認しながら選ぶと良いです。
私はデフォルトを使用しました。

 SyntaxHighlighter6

 

この部分の設定は見た飯だと思いますが、私の設定は感じですね。

SyntaxHighlighter7

 

設定完了後、変更を保存をクリックすれば終わりです。

 

 

この投稿は役に立ちましたか? 役に立った 役に立たなかった

 

ネットビジネス速報メールマガジン

 

メルのネットビジネス速報では、悪質高額塾などの被害が拡大しないように
新しい悪質販売者の情報が入り次第、速報でお伝えいたします。

Dreamweaver、Fireworks、PhotoshopなどのTipsやチュートリアルの紹介、
最新SEO情報、その他ネットビジネスに関する情報をいち早く配信しています。

お名前(必須)
メールアドレス(必須)

One Response to “SyntaxHighlighter ソースコードを美しく”

記事「SyntaxHighlighter ソースコードを美しく」にコメントを残す

*

サブコンテンツ

危険な高額塾

タグ

CS6 短縮URLツール モザイク 日本語入力変換ソフト 宮田麗花 原田真 管理画面 新井浩 レビュー ビジネス 株式会社A-ブログレス Windows 7 蝶乃舞 高額塾 小笠原健一 トレンドキーワード 転売大園塾 サイト改ざん LinkShaker ざくざく君 短縮URL 村上省吾 tool 固定ページ ネットガレージ シャンプー ソースコード アフィリエイト ブラシ 北川 雅嗣 Ban Hammer 賢威 大園式転売塾 MT インターネット functions.php SyntaxHighlighter 無料オファー 池田純矢 postpost ブロック Adobe ハート エディタ エクスチェンジ レイアウト崩れ 画像 ボタン Login LockDown Google Maps インターネットエクスプローラー 株式会社WINGOOD 放射線 BUYMA 表示 getElementById 不正アクセス ワードプレス SEO 定型文 与沢翼 エクスプローラー 不正送信 Tiger-Wing プロモーション JavaScript system MasterCollection 中山秀人 ソフト 久積篤史 株式会社SRシステム 上位表示 レンタルサーバー 与沢翼×蝶乃舞 インターネットビジネススクール @PAGES 自動化 配布 wordpress 改竄 山下 ドメイン バイマ 改ざん レイアウト セキュリティ 詐欺組織 バナー アンダーグラウンドアフィリエイトクラブ ランキング リンクシェイカー 石井匠 SmoothScroll.js 切り抜き サンタ 株式会社SRシステム コピーボタン Diamond Affiliate Masters Program ネットショップ 情報商材 大園麗花 伊藤 歩 ライブチャット 権利収入 無料 株式会社Free Agent Style KMSpico DOCTYPE followmatic カスタマイズ 特定のメールアドレス アンダーグラウンドメソッド EC html RMT 自己アフィリ YouTube Maniax 2017 切抜き force puzzle ブルートフォースアタック 不労所得の神 既得権益 加藤 秀吉 RSS Includes Pages 脆弱性 High Concept Marketing IE デスクトップ アイコン PHP スタイルシート もざ 到達率 Newpost Catch テーマ がら空きビジネス 詐欺 バイドゥー アレックス 株式会社ニュース クリックランキング google トラフィック ウインドウ ブラクラ タスクバー BBIZ ヤフー メルマガ配信システム 副業術 レタープレス wp-login.php CGI やしろひろたみ Extension Manager 伊藤虎太郎 関根塾 スムーズ 管理ツール Chrome 復元 大園転売塾 アフィ匠 iphone 背景 関根義光 アクセスアップ ツール スマホ マルウエア DTD 自己アフィリエイト 秀吉塾天下統一 IBS document.all 大西良幸 ECサイト RSS 無断送信 クロスアフィリエイト クラック 登録禁止 高速ゲーム ウイルス ロリポップ 球体 Cash on Wordpress Favicon Line MovableTYpe 自動 ぼかし 特権ビジネス タイガーウイング 流出 Thunderbird プロファイル テンプレート ブラウザ エキスパートメール クラウド入力機能 ムーバブルタイプ アドセンス グラデーション 個人情報 ヤフーショッピング 人物 ネットビジネス最後の楽園 explorer スクロール Agency Business 量産 インペリアルゴールド Firefox 三橋美仁 Windows 伊藤 虎太郎 SKナレッジ 81a338 getElementByTagName ping Google Maps API ネットビジネス ツイッター IP Internet Explorer せどり ネットビジネス大全集 office 出店料 フレンドシップメール WEB ライオンアフィリエイト 百度 twitter 掲示板 土屋ひろし FTP 感染 ユーチューブマニアクス2017 css 個人情報流出 wpXサーバー 比較 WP 音量アイコン Wordpress Content Slide トレンドアフィリエイト moza ブロックポリシー XHTML .htaccess マイクロソフト クラウド変換 株式会社バンザイ ライン 伊藤塾 立体 アレックス式ネオせどりスクール インフォトップ ping送信 滑らか プラグイン ネットゲーム パズル Youtube 秒速で1億円稼ぐ男 ネオヒルズアカデミー 優先順位 メモ フォローマティック マニュアル CS5 ソース KMS認証 加工 やしろ塾 申請金ビジネス HTML4.0 PPC アクセス制限 android FireWorks ヤフオク Yahoo ファビコン スカイプ バックアップ Baidu

アーカイブ

エステトラブル

このページの先頭へ