Warning: Invalid argument supplied for foreach() in /home/takemitasaki/route58.org/wp-content/plugins/head-cleaner/head-cleaner.php on line 2895

Warning: Invalid argument supplied for foreach() in /home/takemitasaki/route58.org/wp-content/plugins/head-cleaner/head-cleaner.php on line 2895

Warning: Invalid argument supplied for foreach() in /home/takemitasaki/route58.org/wp-content/plugins/head-cleaner/head-cleaner.php on line 2895

Warning: Invalid argument supplied for foreach() in /home/takemitasaki/route58.org/wp-content/plugins/head-cleaner/head-cleaner.php on line 2895
表示 | 国道58号線をのんびりと行く

アーカイブ

‘表示’ タグのついている投稿

WordPress 記事内でソースを表記するプラグイン Syntax Highlighter for WordPress

2010 年 5 月 24 日 コメントはありません

WordPressの本文(記事内)でHTMLやCSS、PHPなどのソースをきれいに表示するプラグインはいくつかあるのですがこのブログで使っているのはSyntax Highlighter for WordPress。

Syntax Highlighter for WordPressのダウンロード先( http://wppluginsj.sourceforge…….ghlighter/ )からzipファイルをダウンロードして解凍。
プラグインフォルダにアップロード後、使用開始すればいいだけという、誰にでも簡単にはじめられるプラグインです。

Syntax Highlighter系のプラグインは他にもたくさんあるのですが、テーマとの絡みでしょうか。
このブログにはSyntax Highlighter for WordPressが一番しっくり来ました。

本文内では半角の大カッコ [] で[css]とか[html]とか[php]とかを括ってソースを記述し、最後に[/css]や[/html]、[/php]などで閉じるだけ。

具体的にはこんな感じで記述。

[css] .hogehoge {background-color : #FFF ;}[/css]

記事本文の[css]などは全角の大カッコ使ってますのでコピペすると動かないので注意して下さい。
[css]などの必要タグはAdd Quick Tagプラグインを導入して、登録しておくと記事の作成が楽になります。

この先は自分のちょっとCSSカスタマイズメモ。
デフォルトに#e3e3e3の外枠を付けてみました。

syntax-highlighter/css/shThemeDefault.css にボーダーを追加します。
shThemeDefault.cssの冒頭を以下に変更。

.syntaxhighlighter
{
	background-color: #fff !important;
}

.syntaxhighlighter
{
	background-color: #fff !important;
	border:1px solid #e3e3e3 !important;
}

以上、これだけでだいぶ見やすくなります。

ちなみにフォントサイズやスタイルを変更するには syntax-highlighter/css/shCore.css を触ります。
このブログではフォントファミリーにMS ゴシックを追加しています。

font-family: "MS ゴシック", "Consolas", "Bitstream Vera Sans Mono", "Courier New", Courier, monospace !important;

新着アイコンを表示させるPHP

2010 年 4 月 1 日 コメントはありません

新着アイコンを表示させるPHP

<h2><a href="<?php the_permalink() ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a><?php
$days=3;
$today=date('U'); $entry=get_the_time('U');
$diff1=date('U',($today - $entry))/86400;
if ($days > $diff1) {
echo '<img src="/images/icon_new.gif" alt="New" />';
}
?></h2>
カテゴリー: WEB, Wordpress タグ: , ,

計画通りに いかないことが たくさんある~ ♪

Positions by Seo-Watcher