に投稿 コメントを残す

WordPressのホーム

WordPressのテンプレートでHome.phpを使う時、ちょっとだけ注意する事について書きます。

テンプレートを自作していると、ホームページに新着記事を読み込ませたいなあって時があります。
その時、query_posts()にカテゴリーを指定したループで記事を読み込ませると、それ以降Home.phpがアーカイブページとして認識されてしまうようです。 例えば、query_posts()のループ以降ではis_home()でホームページとして認識されなくなったり、場合によっては次の記事へっていうようにホームページの2ページ目が表示されるようになります。

ということで、今すぐSeesaa ブログに新規登録して充実のブログライフを満喫しよう! としてもいいんですけど、
WordPressでホームページに記事の一覧を読み込ませたい時は、get_posts()を使ってループさせてみるのがいいですよ。

に投稿 コメントを残す

WordPressのキャプション機能

WordPress(MU2.6.5で実験)では記事内に画像を挿入するとき、キャプション欄に設定したテキストがimgタグのaltに指定されます。

 
キャプション入力欄

【※注意、以下の内容は真似をすると危険です。挿入した画像以降の記事内容が削除されてしまう恐れがあります。】

このとき、画像のキャプション欄に特定の禁じられた言葉が指定されていた場合、挿入した画像以降の記事が削除されてしまいます。
画像を挿入した時点では問題はなさそうですが、そのまま投稿を保存もしくは公開してしまうと上記の通りその画像以降の記事が削除されてしまいます。
対処方法は、キャプション欄になにも書かないか画像を挿入後にaltの値を変更するなどがあります。

 
禁じられた言葉を入力
 
ソース表示、投稿を保存するまでは問題ない
 
一旦保存してしまうと問題の部分以下の記事が削除されてしまう

原因は、WordPressのHTMLタグをチェックする機能がうまくutf-8に対応できていないようなそうでないようなところです。
そこで、このHTMLタグをチェックする機能を修正して正常に文字列を判定できるようになる日がいつかくればいいなとおもいながら、そうめんを茹でて晩御飯にしました。 おいしかったです。

晩御飯を食べながらふと、そういう日はいつまでもこないかもしれないとおもったので、ひとまず画像を挿入したときにキャプション表示はされたままでaltの値には何も指定されないよう修正しました。
get_image_tagという関数をadd_filterで再定義するような形にしたんですが、まだまだadd_filterやapply_filtersの挙動を把握しきれてなくて結構苦労します。 この辺の機能を使いこなせればもっと自由にWordPressのカスタマイズができるようになり、週末は別荘でグリルをしながらの立食パーティーを開催できるようにもなるんではないかとおもってみたりします。

 
修正した

ついでに、キャプションのショートコードも再定義して、divとpをspanに変更してみたんですが、後でdisplayにblockを指定したのであんまり意味がなかったです。

ともかく、これでもう恐る恐るキャプションを指定しなくてもよくなり、一安心でココアを淹れました。 おいしかったです。

に投稿 コメントを残す

CSS3の機能を試してみる

Push Your Web Design Into The Future With CSS3という記事を参考に、実際に帆船堂サイトへCSS3の機能を適用してみました。

  • [border-radius]四角いBoxをまーるく収めまっせー、という機能です。

     
    border-radius 左:IE7、右Firefox3.0.5
  • [border-image]一枚の画像を元にBoxを囲む機能です。 ここからWebデザインの新たな技法が出て来そうな予感です。

     
    border-image 左:IE7、右:Google Chrome
  • 文章やBoxに影を付加することが出来ます。 文章に影を落とす事で、より自由な背景の組み合わせが行えるようになるでしょう。 多分。

     
    text-shadow box-shadow 左:IE7、右:Safari(Win)
  • [rgbaとopacity]opacityは現在も比較的良く使われている機能で、要素を透過することができます。 rgbaも透過機能なんですが、こちらはrgbをaします。 colorで指定したものを透過させるときに使うようです。

     
    rgba opacity 左:IE7、右:Firefox3.0.5

あと、記事にはfontの機能も紹介されていますが、うまく実験をまとめられなかったので割愛しました。 もう少し手軽に埋め込み用のフォントを作ることが出来るようになれば非常に強力な機能になるとおもわれます。 Webサイトだけではなくフォント関連は色々と課題がありそうです。
(2009.1.14 一覧画像に説明を追記しました。)

に投稿 コメントを残す

【アナログ】

CSS HappyLifeの記事が楽しかったのでWordPress用のプラグインにする実験をしてみました。
当サイトをインターネットエクスプローラー6で見ると、右上にアナログという表記が現れます。

こういったものをきっかけにIE以外のブラウザを試してみる方が増えれば、今後の技術の加速へと繋がるんではなかろうかなという気がします。

ちなみに、最近までOperaは有料ブラウザだとおもってました。
実はもうとっくに無料になっていたのでした。

に投稿 コメントを残す

ダイジェスト表示

startstop-sliderというJavaScriptを使って商品のダイジェスト表示をおこなってみました。
設置例(hc707.com)

商品のタイトルと説明と写真を用意するだけでOKなので、既存のサイトに少し動きを追加したい時などにちょうどよさそうです。 また、写真付きブログの新着記事表示用にも使えそうな感じでした。

ところで、ダイジェストの意味について、いまいちハッキリと把握できていなかったので改めて調べてみました
こういう感じの言葉は、うっかり使ってしまって後でドキドキすることが多いです。

に投稿 コメントを残す

WordPressのギャラリー表示を素敵にしたい

WordPressのプラグインlightbox-galleryを参考に、ギャラリー表示をそこはかとなく素敵にする実験をしてみました。
プラグインの機能を使用しているページを特定して、そのページにだけCSSやJavaScriptを読み込ませるというのが難しい感じです。 ひとまず今回は頭痛にならない範囲で切り上げました。 ゆくゆくはdonation wareとして公開して大繁盛の大儲けで欧州に別荘を構えてのんびり暮らしたいなあとおもったりしました。

写真は去年の暮れに開催されていた『パリと京都の読書時間』という展示の模様です。
(2009.1.8追記:画像の一覧表示に鏡面処理を施してみました。)