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

*

サブコンテンツ

危険な高額塾

タグ

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

アーカイブ

エステトラブル

このページの先頭へ