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

*

サブコンテンツ

危険な高額塾

タグ

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

アーカイブ

エステトラブル

このページの先頭へ