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

サブコンテンツ

危険な高額塾

タグ

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

アーカイブ

エステトラブル

このページの先頭へ