WEB関連の知識や技術についての記事を書いています。

2010年7月27日 火曜日

ウインドウサイズのブックマーク

WEB制作者にとっては考慮しなければいけないウインドウサイズ。一般でよく使うウインドウサイズにサイズ変換してくれるブックマーク

2010年6月7日 月曜日

AppleがHTML5ショーケースを公開

AppleがHTML5&Web Standardsと言うHTML5ショーケースを公開したようです。

サイト内では以下7つのセッションに分けてhtml5の機能を紹介しています。

  • Video」
  • Typography
  • Gallery
  • Transitions
  • Audio
  • 360
  • VR

WEB制作者から見ると結構驚きの機能が満載!早く普及してくれるといいですが。。

■Apple HTML5 & WebStandards
http://www.apple.com/html5/

※ブラウザをSafariにしないと見れないものもあるようです。

2010年5月10日 月曜日

Contact Form 7

Web-diary.netにお問い合わせフォームを設置しました。

このフォームWPのプラグインを使っているんですが、設置がめちゃくちゃ簡単です。

ソースを貼り付けるだけ!

ダウンロードとインストール

WordPress.org のプラグインディレクトリ から最新版をダウンロードしてください。

  1. contact-form-7 フォルダを /wp-content/plugins/ ディレクトリに丸ごとコピーします
  2. WordPress の ‘プラグイン’ メニューでプラグインの有効化を行います

使い方

プラグインを有効にすると管理画面の左にお問い合わせの項目が追加されます。

編集を押すとすでにデフォルトのContact form 1に項目が入力されています。

そのページに表示されている[contact-form 404 "Not Found"] のコードをコピーして本文に貼りつければ表示されます。

テンプレートファイル内に直接書いて入れることはできないようなので、記事の投稿やページの投稿などにこのダグを入れる必要があります。

プラグイン内にCSSも入っているので調整も簡単にできるのでオススメです。

参考サイトはこちら:

ミblog

2010年1月23日 土曜日

Delicious × HeartRails Captureで作るBookmark

本日より新たなコンテンツとしてBookmarkページを追加しました。

このブックマークはソーシャルブックマークのDeliciousでブックマークした最新20件を自動的にWeb Diary.netに表示されるようRSSを取得しています。

Deliciousだけでは単にタイトルとURLの取得しかできないため、URLを入れるだけでキャプチャーを返してくれるAPI、HeartRails Captureを使用しています。

結構簡単にできるので簡単な導入方法をメモしておきます。

  1. まずDeliciousへの登録(yahoo.comにてアカウント作成が必要)を行い、好きなWebサイトをブックマーク。
  2. 各個別ページにRSSの取得ボタンがあるのでそこからRSSのURLを取得。
  3. wordpress内でincludeさせます。

    <?php // Get RSS Feed(s)
    include_once(ABSPATH . WPINC . ‘/rss.php’);
    $rss = fetch_rss(‘http://feeds.delicious.com/v2/rss/nishimura0913?count=20′);
    ?>

  4. 次にHeartRails CaptureのAPIを使う。
  5. この仕組が実に簡単です。

    例:http://capture.heartrails.com/?http://www.mozilla-japan.org

    頭に付いている赤文字のURLがキャプチャーするためのURL。なのでその後の青文字の部分にキャプチャーしたいURLを入力すればキャプチャーを返してくれます。
    その他キャプチャーサイズや角丸、ボーダーなんかの設定もできます。
    詳細はHeartRails Captureサイトで見てください。

  6. 仕組みがわかったところでWordPressへ組み込み
  7. <?php foreach ( $rss->items as $item ) : ?>
    <dl>
    <dt><a href=’<?php echo $item['link']; ?>’title=’<?php echo $item['title']; ?>’ target=”_blank”><img src=”http://capture.heartrails.com/310×230/shorten/?<?php echo $item['link']; ?>”></a></dt>
    <dd><a href=’<?php echo $item['link']; ?>‘title=’<?php echo $item['title']; ?>’ target=”_blank”><?php echo $item['title']; ?></a></dd>
    </dl>
    <?php endforeach; ?>

赤がHeartRails CaptureへのURL
青がDeliciousからRSSで取得するURL
このようにforeachを使ってリピートさせるとうまいことブックマークの完成です。

最後にひとつだけ問題点があります。このHeartRails CaptureはファーストビューをキャプチャーしてくるのでFlashサイトなど最初の画面が真っ白とかだとただの白い画像しか表示されません。 何か解決方法があればよいのですが・・・

興味のある方はぜひ使ってみてください。

2010年1月11日 月曜日

カテゴリーIDで記事を振り分ける

現在このWeb Diary.netはWordPressを使って構築しています。

トップページでDiaryとReferenceと言うカテゴリーで記事の振り分けを行っています。

このやり方がわからず作成まで時間がかかったので簡単にメモを残しておきます。

Aカテゴリーが、Bカテゴリーの祖先にあたるかどうかを返してくれるcat_is_ancestor_ofという関数があるようです。

<?php
$post_cats = get_the_category();
if ( $post_cats[0]->cat_ID == 1 || $post_cats[0]->category_parent == 1 || cat_is_ancestor_of( 1, (int)$post_cats[0]->category_parent ) ) { ?>
親カテゴリーAの記事の表示内容
<?php } elseif ( $post_cats[0]->cat_ID == 5 || $post_cats[0]->category_parent == 5 || cat_is_ancestor_of( 5, (int)$post_cats[0]->category_parent ) ) { ?>
親カテゴリーBの記事の表示内容
<?php } else { ?>
その他の記事の表示内容
<?php } ?>

参照元URL:http://ja.forums.wordpress.org/topic/1290