お寺のサイトを作成しているので、「今日のことば」のような日めくりカレンダーをサイドバーに表示させてみたいと思います。
管理画面から「外観」「ヴィジェット」の「メインサイドバー」に「テキスト」を追加し、任意の HTML の入力ボックスに以下のコードを加えます。
<script language="javascript"> //<![CDATA[ myDate=new Date(); num=myDate.getDate(); document.write("<img src='https://yoursite.com/uploads/img_" + num + ".png' alt='today-word' width=100% />"); //]]> </script>
この例では、「img_xx.png」という日めくり用の画像ファイルを一ヶ月分の31枚 http://yoursite.com/uploads/
以下に用意しています (img_xx.png
の xx
は 1 から 31 までの数字)。
表示は以下のようになります。
WP jQuery Lightbox を利用する場合、例えば次のように書けるでしょう。
<script language="javascript"> //<![CDATA[ myDate=new Date(); num=myDate.getDate(); document.write("<a href='http://yoursite.com/uploads/img_" + num + ".png' rel='lightbox'><img src='https://yoursite.com/uploads/img_" + num + ".png' alt='today-word' width='100%' />"); //]]> </script></a>
「WP jQuery Lightbox」プラグインは、Lightbox 効果を得るために、画像をマークアップする <a> タグに、
rel="lightbox[ID番号]"
の属性を追加します。この属性のない画像ではこの効果は得られません。したがって、画像のアップロードは、FTP クライアントソフト等ではなく、必ず WP の設定画面から行なって、この属性を付与する必要があります。
表示例は以下のようになります。
- 表示例 (サイドバー) : http://ryogan.org
- 今日のことば: http://ryogan.org/today-words/