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

*

サブコンテンツ

危険な高額塾

タグ

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

アーカイブ

エステトラブル

このページの先頭へ