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 ソースコードを美しく」にコメントを残す

サブコンテンツ

危険な高額塾

タグ

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

アーカイブ

エステトラブル

このページの先頭へ