WordPress2.5では画像のタイトルに全角文字を使っていると、記事に画像を挿入する際にエラーが出てしまう場合があるみたいです。
画像の代替テキスト（alt=”****”)には画像のタイトルが使われますので、全角文字が使えないのは困りますが、今回はとりあえずタイトルをデフォルトのままで挿入してから、HTMLで画像のAlt=”***”部分を書き換えて対処しました。大した手間ではないのですが何かスッキリしません。
で、せめてどんなエラーが出ているのか調べようとして同じ条件で画像を再アップロードしたんですが、今度はエラーが出ず・・・・まあ良くあることですが（＾_＾；
以前にSimpleCodeの代用品として作成したEncCode.htaですが、前記事のように、WordPress2.5.1ではペーストしたコードが文字化けしてしまうため、それに対応するように修正しました。
以前のバージョンをご利用の方は新しいバージョンに差し替えてご利用ください。
ここのブログのコードは一応すべてこのEncCodeを使っていますので、自分で気づいた点があれば修正していますが、もし何かお気づきの点がありましたらご指摘いただけると嬉しいです。
このブログでは記事内にソースコードを表示していますが、2.5から2.5.1にアップデート後にcodeタグ内のシングルクォーテーションとダブルクォーテーションの表示の一部が全角に化けてしまうようになってしまいました。
具体的には、codeタグで囲んである部分の、
・シングルクォーテーション（'）が全角になってしまう
・ダブルクォーテーション（"）が全角になってしまう
・連続したシングルクォーテーション（''）が全角のダブルクォーテーションになってしまう
等が確認されました。これにより記事からペーストしても正常に動作しない状態になってしまいました。
これらの文字は文字コードで指定すれば化けないようですので（もともと文字コードで記述すべきなのでしょうが）、過去の記事につきましてはとり急ぎ修正しましたが、不具合がありましたらコメントお願いいたします。
WordPress2.5.1日本語版がリリースされていましたので、さっそくアップデートしました。
今回も前回の2.5へのアップデート同様、こちらの記事の方法で問題なくアップデートできました。
外観や機能面では2.5とほとんど変わりませんが、バグフィックスの中には重要なものもありますので、アップデートする価値はあると思います。
パフォーマンスの向上に関しては、とりあえず記事を一つ書いてみたところではエディタのレスポンスが軽くなった様な気がする、といった程度でしょうか。
2.5ではパッチを当てなければならなかったIEでのメディアのアップロードの問題は修正されています。
またまたショートコードタグですが、今回はGoogle Mapsを表示するショートコードタグです。GeoCodingを利用しているので住所をタグで囲むだけでマップが表示されます。これも前回の翻訳タグ同様、GoogleのサンプルJavaScriptをほとんどそのままラッピングしているだけです。
// [gmapwithgc (nosinglemsg="message" id="id" width="width" height="height" zoom="zoom")]address[/gmaiwithgc]
// googleマップを住所で表示
function gmapwithgc_func($atts, $content='') {
extract(shortcode_atts(array(
'nosinglemsg' => '',
'id' => 'gmap0',
'width' => '500px',
'height' => '300px',
'zoom' => '14',
), $atts));
if($nosinglemsg != "" and !is_single()){
return $nosinglemsg;
} else {
return <<<_EOT_
<script src="http://maps.google.com/maps?file=api&v=2.x&key=●●" type="text/javascript"></script>
<div id="$id" style="width: $width; height: $height"></div>
<script type="text/javascript">
map = new GMap2(document.getElementById("$id"));
geocoder = new GClientGeocoder();
geocoder.getLatLng("$content",
function(point) {
if (!point) {
alert("$content" + " not found");
} else {
map.setCenter(point, $zoom);
var marker = new GMarker(point);
map.addOverlay(marker);
marker.openInfoWindowHtml("$content");
}
});
</script>
_EOT_;
}
}
add_shortcode('gmapwithgc', 'gmapwithgc_func');
ソースの●●部分はご利用のGoogle Maps APIキーに置き換えてください。
使い方は記事内に以下のようなタグを入れると、Google Mapsが表示されます。
[gmapwithgc]東京タワー[/gmapwithgc]
サイズや拡大率を指定できます。
[gmapwithgc width=”400px” height=”350px” zoom=”10″]富士山[/gmapwithgc]
シングルページのみマップを表示する場合は以下のようにシングルページ以外で表示されるメッセージを指定してください。
[gmapwithgc nosinglemsg=”記事のタイトルをクリックしてシングル表示にしてください”]東京タワー[/gmapwithgc]
ひとつの記事に複数タグを入れたい場合は重複しないidを指定してください。
[gmapwithgc id=”gmap2″]東京タワー[/gmapwithgc]
以下は実際にタグを埋め込んだサンプルです。
シングルページにするとマップが表示されます
WordPress2.5のショートコードタグ関連のネタとして、Google翻訳APIを利用するショートコードタグを作ってみました。とはいっても実質はGoogleのドキュメント内のサンプルJavaScriptをラッピングしているだけですが(^^;
// [gtranslate (sl="SourceLang" tl="TargetLang" id="id")]content[/gtranslate]
// タグに囲まれた部分をgoogle翻訳する(デフォルトは日→英)
function gtranslate_func($atts, $content='') {
extract(shortcode_atts(array(
'sl' => 'ja',
'tl' => 'en',
'id' => 'gtrans',
), $atts));
return <<<_EOT_
<div id="$id"></div>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("language", "1");
function initialize() {
google.language.translate("$content", "$sl", "$tl", function(result) {
if (!result.error) {
var container = document.getElementById("$id");
container.innerHTML = result.translation;
}
});
}
google.setOnLoadCallback(initialize);
</script>
_EOT_;
}
add_shortcode('gtranslate', 'gtranslate_func');
使い方としては記事内に以下のようなタグを入れれば、次の行の様に翻訳されます。
[gtranslate]我々はこの老人を知っています。[/gtranslate]
ひとつの記事に複数タグを入れたい場合は重複しないidを指定してください。
[gtranslate id=”gtrans2″]いえ、この眼差しと顔の傷を知っています。[/gtranslate]
先の記事でソースのヘッダに実際にタグ名が入っていますが、これをタグと認識させないために以下のようなショートコードを定義しています。
// [addsb]content[/addsb]
// contentにスクエアブラケットを追加します
function addsb_func($atts, $content='') {
return @"[" . $content . "]";
}
つまり上のソースのコメントの1行目は[addsb]addsb[/addsb]content[addsb]addsb[/addsb]となっているわけです＜ますます分かんない？
ところで２．５のエディタなんですが、HTMLモードではフルスクリーンは使えないんですね。
というかサイズ変更もできなくなってる(；´Д｀)・・・ソースコードを貼り付ける時とか、結構HTMLモードも使うのでこれは何とかしてほしいです。
WordPress2.5の新機能であるショートコードタグですが、使い方がだんだんわかってきました。
基本的としては、phpで関数を記述（記述場所はテンプレートのfunctions.phpが適当)して、その関数をadd_shortcodeで登録しておけば、記事内にて、[タグ名 属性名="属性"]または[タグ名]…[/タグ名]といった形で、記事内にオリジナルの機能を持ったタグを追加できるというものです。
wp-includes/shortcodes.php内にサンプルの記述がありましたので、それを参考に遊びでタグを作ってみました。
// [randomface id="number"]
//idに対応した顔文字を表示(idなしの場合はランダム)
function randomface_func($atts) {
extract(shortcode_atts(array(
'id' => '0',
), $atts));
$faces=array('', '(・∀・)', '(´∀｀)', '(´・ω・｀)',
'Σ (ﾟДﾟ;)', 'ヽ(；´Д｀)ノ', '(*´Д｀*)', '＿|￣|○');
if($id =='0'){
return @$faces[rand(1, count($faces) -1)];
} else {
return @$faces[intval($id)];
}
}
add_shortcode('randomface', 'randomface_func');
簡単に説明しますと、タグ内の属性はfunctionの引数として配列で渡されます。つまりこの場合は$atts['id']にnumberの値が入ります。次のextract…は配列を変数に展開するもので、これを通すと先ほどの属性値が$idで参照できるようになります。この中で使われているshortcode_attsですが、1番目の配列に2番の配列を上書きするような動作をするようで、これによってid属性が指定されなかった場合のデフォルト値を設定できるようになります。つまりこの場合はidが指定されていない場合は最初に指定された配列の値が有効になるので０になるといった具合です。
それ以降はテンプレート内とほぼ同様にテンプレートタグやphpが利用できます。ただしループ内でしか利用できないタグはうまく動かないものがあるようです。
こうして関数を定義したら、最後にadd_shortcode(’タグ名’,'呼び出される関数名’)と記述すれば、それ以降は記事内でタグが利用できるようになります。
上のタグを実際に記事内に入れるとこんな感じです。
(´∀｀)
テンプレートタグとショートコードタグを組み合わせると、これまでの記事では難しかった動作を簡単に指定することができます。
例えば以下のようなショートコードを定義しておくと、シングルページでしか表示しない部分を投稿編集画面から簡単に指定することができます。上のものと違ってこれはタグで囲い込む形ですが、これもひな形として覚えてしまえばいいと思います。残念ながらショートコードタグは入れ子構造には対応していないみたいです。
// [issingle]content[/issingle]
// 個別記事ページの場合のみタグ内を表示します
function issingle_func($atts, $content='') {
if(is_single()){
return @$content;
}
}
add_shortcode('issingle', 'issingle_func');
↓ここにシングルページでしか表示されないテキストがあります
以下は上の応用で、GoogleMapsを読み込むJavaScriptですが、表示が重くなるのを避けるためシングルページのみで表示されるようになっています。
個別記事表示にするとマップを表示します
WordPressでよくつかわれているプラグインにSimpleCodeというものがあります。
これは記事にＰＨＰやＨＴＭＬなどのソースを入れたいときに記号などがＨＴＭＬタグとして判別されないよう、文字参照に変換してくれるもので、非常に便利なのですが、一度記事の編集画面を抜けないと利用できないとか、日本語が文字化けしたりとかで、ちょっと使いにくい点もあり、もしかしたらこれは独立したアプリのほうが使いやすいのではないかと思い、同様な動作をするＨＴＡアプリケーションを作ってみました。ＨＴＡなのでWindowsでしか動作しませんが。
以下のスクリプトをコピーして、ファイル名を「EncCode.hta」で保存するか、アーカイブをダウンロードして解凍ください。ファイルをダブルクリックすれば実行されます。
使用法に関しては別に説明するまでもないと思いますが、ソースコード欄にソースを入力して「変換」ボタンを押せば、下のエンコード欄に変換されたコードが表示されます。これを記事編集の画面をコードのモードにてペーストしてください。なお再編集するとWordPressの性質上文字化けしてしまう可能性があります。その際は再ペーストしてください。
「変換」以外のボタンは、
ClipBoard取込＝クリップボードから取り込んで変換
ClipBoard自動＝クリップボードから取り込んで変換してクリップボードにコピー
となっています。クリップボードを操作するために裏でＩＥを呼び出しますので、環境によってはレスポンスが悪いかもしれません。
また、変換するコード内に空行がある場合、WordPressはそこでコードが終わりと判別してしまいますので、コード内に空行が入らないように注意して下さい。
※2008/4/30 WordPress2.5.1でのダブルクォーテーション、シングルクォーテーションの文字化けに対する修正を行いました。以前のものをご利用の方は新しいバージョンに差し替えてご利用ください。
<HTA:APPLICATION SCROLL="no">
<html>
<head>
<title>EncCode</title>
</head>
<body>
<h2>EncCode</h2>
<form id="Form1">
<p>ソースコード:<br>
<textarea id="TextBox1" rows="10" cols="40"></textarea></p>
<p>エンコードHTML:<br>
<textarea id="TextBox2" rows="10" cols="40"></textarea></p>
<p><input type="button" id="CommandButton1" value="変換"> <input type="button" id="CommandButton2" value="ClipBoard取込"> <input type="button" id="CommandButton3" value="ClipBoard自動"></p>
</form>
'
<script language="VBScript">
Option Explicit
Sub Window_onLoad
Call Window.ResizeTo(340,500)
Form1.TextBox1.focus()
End Sub
'
Sub CommandButton1_onClick
Call Encode()
End Sub
'
Sub CommandButton2_onClick
Form1.TextBox1.value = GetClipBoard()
Call Encode()
End Sub
'
Sub CommandButton3_onClick
Form1.TextBox1.value = GetClipBoard()
Call Encode()
SetClipBoard(Form1.TextBox2.value)
End Sub
'
Sub Encode()
Dim sourceCode
sourceCode=Form1.TextBox1.value
sourceCode=HTMLEncode(sourceCode)
sourceCode="<code>" + sourceCode + "</code>"
Form1.TextBox2.value= sourceCode
Form1.TextBox2.select()
End Sub
'
Function HTMLEncode(byVal inString)
inString = Replace(inString, "&", "&")
inString = Replace(inString, "<", "<")
inString = Replace(inString, ">", ">")
inString = Replace(inString, """", """)
inString = Replace(inString, "¥", "¥")
inString = Replace(inString, "'", "'")
inString = Replace(inString, " ", "  ")
inString = Replace(inString, vbTab, "  ")
' 以下はWordPress以外の場合に使い分け
' inString = Replace(inString, vbCr, "<br>" + vbCr)
' inString = Replace(inString, vbTab, "<pre>" + vbTab + "</pre>")
' inString = Replace(inString, "|", "¦")
HTMLEncode = inString
End Function
'
Function GetClipBoard()
Dim objIE
Set objIE = CreateObject("InternetExplorer.Application")
objIE.Navigate("about:blank")
GetClipBoard = objIE.document.parentwindow.clipboardData.GetData("text")
objIE.Quit
End Function
'
Sub SetClipBoard(byVal inString)
Dim objIE
Set objIE = CreateObject("InternetExplorer.Application")
objIE.Navigate("about:blank")
objIE.Document.ParentWindow.ClipboardData.SetData "Text", inString
objIE.Quit
End Sub
</script>
</body>
</html>
アーカイブ:enccode02.lzh
MEを導入していたため、公開直後にいきなりアップグレードの必要に迫られてしまいました当ブログでしたが、こちらの記事のおかげであっさりとアップグレードすることができました。感謝。
wordpress 2.3.2 日本語版へのバージョンアップ
2.3で追加されたタグを表示するようにテーマもちょこっと修正。とはいってもテンプレートの適当な場所に
<?php if (get_the_tags()) :?>
<?php the_tags('タグ：', ', '); ?>
<?php endif; ?>
な感じでタグを入れるだけなので、たいした作業ではありません。それでもアップグレードよりむしろこちらのほうに時間がかかってしまいました。2.3のタグ対応で、ますます無意味になっているとは思いますが、前の記事でしたようにタグもkeywordsメタに入れてみたりするとこんな感じです
<?php if(is_single()) : while(have_posts()) : the_post();
foreach(get_the_category() as $category){
$keyh[$category->cat_name] = $category->cat_name;
}
if (get_the_tags()){
foreach(get_the_tags() as $tag){
$keyh[$tag->name] = $tag->name;
}
}
foreach($keyh as $kw){
$keywords .= $kw . ',';
}
$keywords = substr($keywords, 0, strlen($keywords)-1);
print '<meta name="keywords" content="' . $keywords . '">' . "¥n";
endwhile; endif;
?>
まあ、keywordsメタにあまりこだわるのも何なので、これぐらいでやめておきます（＾＾；
kotani(こたに)
30台後半になって突然脱サラ。フリーのスクリプト系プログラマーとして独立を目論む謎のおやぢ。東京都在住。趣味は古本屋巡り、文具いぢり、機械いぢり、Ｂ級グルメ探索等々多岐にわたる。PCを使う作業に関しては何でもかんでも自動化したがる自動化オタク。