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

*

サブコンテンツ

危険な高額塾

タグ

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

アーカイブ

エステトラブル

このページの先頭へ