記事一覧

Slimbox風にムービーを表示

ファイル 141-1.jpg

以前Slimboxの設置を解説しましたが、スクリプトを追加すると
動画もSlimboxと同じように表示することができます。

表示可能な動画はYoutubeMetacafeGoogle VideoiFilm
オリジナルのflash(.swf)も表示することができます。
JW FLV PLAYERと併用することで、flvファイルの再生も可能になっています。
(注:ニコニコ動画のようにログイン必須の動画サイトからは無理)

表示にはSlimboxのときと同じmootoolsを使います。
こちらのvideoboxは1つのパックの中に必要なもの(js、player)が
全て入っているため、設置がとても簡単なのも魅力です。

【参考元】 ※動作サンプルは最初のサイトにて
・Videobox: Lightbox for videos
・【ハウツー】ゼロからはじめるVideobox - Flashムービーにエフェクト効果

≫以下、設置方法

mootoolsで別窓表示

prototype.jsを利用した別窓表示はすでに解説されているのですが、
mootoolsを使った別窓表示は
英語で紹介されているものぐらいしか見当たらなかったので解説。
XHTML1.1 SE でなんとtarget復活?との話もありますが、まだ先の話になりそう。

【出来ること】
●target="_blank"の代わりにrel="popup"を使うことで
 リンクを別窓を開くことができる。XHTML1.0対策。
●開くウィンドウのサイズを決めることができる。
 (拍手やアンケートフォームなどに便利)

【参考サイト】
・moopop: “unobtrusive” popups with mootools | a pint of javascript (and general web stuff)

≫以下、設置方法

Web Clapスキン 「MACARON for clap」

ファイル 134-1.gif

【ダウンロード】 ※ サンプルページはこちら
・clap_macaron(lzh)
・clap_macaron(zip)

今のところ、一番使用率が高い(と思われる)MACARONタイプの
Web Clap用スキンです。
角丸で囲ってあり、記事部分は白背景となります。
全体の背景を変えても角丸内には影響しませんので、
色々壁紙を変えてサイトにマッチした雰囲気にすることができます。

オプションで名前記入欄、日記返信チェックがついていますが
必要のない方は.htmlスキンからその部分のフォームを削ってください。

WebDiaryProスキン 「MACARON」

ファイル 124-1.jpg

※2007/10/17
スキンファイル「top.html」「profile.html」追加。
インデックスページ表示、管理人プロフィールでの角丸が消える問題
を補正します。
※2006/12/21
スキンファイル「list.html」追加。
リスト表示にするとデザインが変だったのを補正します。

【ダウンロード】 ※ サンプルページはこちら
・skin_macaron(lzh)
・skin_macaron(zip)

ベーシックな角丸2カラムスキン。全体的に左寄り。
画像を背景・角丸部分などに使用しています。
素材はAzPainterでちまちま自作。
記事をひとつづつ角丸で囲みたいという方のサンプルにもどうぞ。

このスキンは著作表示を80x15バナーで表示しています。
テキストの方が良いという方は、navigation.htmlを書き換えて
いずこかの部分(footer.htmlなど)にWeb Libertyへのリンクを張り直してください。

WDPでBlogPetを設置する

あんでるどんさん作「BlogPet飼育箱」を使用した
Web Diary Pro用の設置方法です。

これを使用すると、ブログのRSSから言葉を覚えたBlogPetが
自分の日記に投稿をしてくれます。
通常ですとブログ内の自分の記事に紛れ込んで投稿されるのですが、
飼育箱使用ではペット独自の日記に投稿されます。

…ただの「BlogPet飼育箱の使用法」な気もしてきましたが、
iframeを使わずに日記を表示することもセットにしてみました。汗

※まだHaloScanの設定は行っておりません。
 スパムが激しい中、コメント機能やTB機能をつけることに
 不安があるためです。HaloScanも含めた設定は「喜怒哀楽」さんの
 記事を参考になさって下さい。

≫以下、設置方法

ページ移動