大阪のホームページ制作会社 株式会社TREVO
スタッフブログ

WordPressでソースコードを紹介する時に便利なプラグインSyntaxHighlighter Evolved

2016.02.01.

WordPress

twitter Facebook Pocket LINE はてブ

株式会社TREVOの月額制ホームページ制作サービス
PR

20160201-3WEB制作などの技術情報をブログで紹介する場合HTML、CSS、PHP、JavaScriptなどのプログラミングのコードを説明することがよくあります。
ただプログラミングのコードをそのままブログ記事にしてアップしてしまうと、プログラムが稼働して紹介するコードが表示しなくなったり、記事の投稿がエラーになったりします。
そんな時に便利な記事の中で表示されるソースコードをキレイに表示してくれるプラグイン「SyntaxHighlighter Evolved」をご紹介いたします。
WordPressで制作・技術関係のブログを運営している方がの多くが利用している便利なプラグインです。

使用できる言語

actionscript3、bash、clojure、coldfusion、cpp、csharp、css、delphi、erlang、fsharp、diff、groovy、html、javascript、java、javafx、matlab (keywords only)、objc、perl、php、text、powershell、python、r、ruby、scala、sql、vb、xml
公式サイトに詳細にも対応言語一覧がありますので参考にしてください。

■注意事項
テキストモードで使用してください。
ビジュアルモードで使用すると、ソースコードの一部が除去・変更されることがあります。

 

使い方

ソースコードを入力して言語名で囲みます。
例:HTMLの場合

[html]
<h1>これはテストです。</h1>
<p>これはテストです。</p>
[/html]

 

他のコードでも同じ方法で使用できます。
CSSは[CSS]、JavaScriptは[javascript]といったように記述します。

例:CSSの場合

[css]ソース[/css]

[css]
#text {
font-size: 14px;
font-weight: bold;
color: #F00;
}
[/css]

 

例:JavaScriptの場合

[javascript]ソース[/javascript]

[javascript]
function slideSwitch() {
var $active = $(‘#slideshow a.active’);
if ( $active.length == 0 ) $active = $(‘#slideshow a:last’);
var $next = $active.next().length ? $active.next()
: $(‘#slideshow a:first’);

$active.addClass(‘last-active’);

$next.css({opacity: 0.0})
.addClass(‘active’)
.animate({opacity: 1.0}, 1000, function() {
$active.removeClass(‘active last-active’);
});
}

$(function() {
setInterval( “slideSwitch()”, 6000 );
});
[/javascript]

まとめ

簡単に利用できて、しかもソースコードが見栄えよくなるのでプログラムなどの技術系のブログを運営している方には使い勝手のよいプラグインです。

PR:株式会社TREVOのホームページ制作のポイント

ホームページ制作で成功する為の重要はポイントがあります。高い金額を支払ってホームページを制作する前に抑えておきたいポイントを知っておく事で完 成するホームページが違ってきます。
詳しくは弊社スタッフブログの「ホームページ制作 で成功するための重要なポイント」でも詳しく説明しています。

ホームページを制作する目的を考える

なぜホームページが必要だとおもいましたか?

名刺がわり、製品カタログ、実績の紹介、集客、告知などホームページといっても用途は様々です。 用途によっても必要なページ、デザイン、構成、予算は大きくかわってくるのでまずは目的を明確する事が重要です。 弊社スタッフが詳しくヒアリングを行い、方向性や必要なページ構成、機能等をご提案させていただきます。

ホームページを担当する方がホームページをどの様に活用したいのか?どんなユーザー様にお届けしたいのか?など目的をしっかりと持って一緒に ホームページ制作 取り組んでいただけるとより良いホームページを制作する事が可能です。

ホームページ制作でお困りの方はお問い合わせかお見積もりフォームからお気軽にご相談ください。お見積もりフォームで詳しい情報をご入力いただければ詳細なお見積書を作成させていただくことも可能です。

PR:株式会社TREVOのSEO対策

現在のSEO対策では、ページの設計、内容・情報が大切な要素となります。 最近、googleでは検索エンジンの制度を上げる為にアップデートを頻繁に繰り返しており、これまでSEO対策の基本だったリンクを増やす作業はマイナスの要素となるようになりました。

現在のSEO対策では、ページの内容(コンテンツ)、更新頻度等が重要になっています。 また、googleのロボットが理解しやすいサイト構造やHTMLソースの調整等もしっかりと行います。

TREVOのSEO対策はビッグキーワード だけじゃないからSEOに強い。

1割から2割がビッグキーワードで、その他の8割のスモールキーワード(ロングテールキーワード)を確実に取る事がSEO成功への秘訣です。 9~8割の見込み客を逃さない為にスモールルーキーワード(ロングテール)の事も考えたSEO対策を心掛けています。

その為にはSEO対策だけで十分じゃありません。せっかく検索で訪れたお客様にホームページを見て頂かなければ意味がありません。 サイト全体を見直す事でただのSEO対策以上の効果が期待できます。

そこでホームページのデザイン・内部構造・サイト構成・運営力(更新等)が重要です。 トレボではこれらすべての要素をアドバイス・改善致します。

twitter Facebook Pocket LINE はてブ

関連の記事