ga.js版「Cookieで自分のトラフィックを除外するフィルタ」 - Rewish
以前にGoogle Analytics「Cookieで自分のトラフィックを除外するフィルタ」と言う記事を書きましたが、Google Analyticsより新トラッキングコード ga.js が公開されているので改めて紹介したいと思います。 基本的な設定はGoogle Analytics「Cookieで自分のトラフィックを除外するフィルタ」と同じです。本記事ではCookie設定用のページの相違点を説明します。 サイト上にCookie設定用のページを作成 トラフィックを除外したいサイト上に以下のページを作成して下さい。 <html><head><title>Set cookie</title></head> <body onload="javascript:pageTracker._setVar('no_report');"> <h1>トラフィック除外</h1> <p>Cookieセット完了。<
CSSの@importを動的に1ファイルにまとめて圧縮するPHPのクラス「CSS_DynamicCompressor」 - Rewish
CSSを小分けにして@importで読み込んで管理している方も多いかと思いますが、これではHTTPリクエストがファイルの数だけ発生して、パフォーマンス的に良くありません。 Googleがページの表示速度を検索結果に反映するとか言い出したりもしているので、これはもうリクエスト数を減らすしか無いですね！ でも手動でファイルを一つ一つ連結するのはとても面倒です！と言うわけで、そんな面倒な作業を自動でやってくれるPHPのクラスを書いてみました。 ライブラリについて @importで複数のファイルを読み込んでいるCSSを、動的に解析し、連結・圧縮を行います。また、表示する際にLast-ModifiedやExpiresなどのHTTPヘッダーを送出したり、gzip圧縮を行うなど、リクエストを出来るだけ軽減できるようにしています。 ダウンロード CSS_DynamicCompressor ライセンス MI
Twitterの機能をJSで簡単に導入できる「@Anywhere」の使い方メモ - Rewish
Twitterの諸機能をサイトに導入するためのJavaScriptフレームワーク「@Anywhere」がリリースされましたね。 その場でフォローしたりサイト上から直接Tweetしたり、Twitterがナチュラルに様々なサイトに組み込まれるようになるんですかね。 と言うわけで僕も軽く試してみたので、使い方のメモと雑感を書いてみます。 まずはアプリケーション登録 New Twitter Applicationでアプリケーション登録を行う。 Application Name @AnywhereでTweetした時に表示されるアプリケーション名。</dd> Application Website Application NameにリンクされるサイトのURL。 Organization 組織名？とりあえず空白で。 Callback URL コネクションの許可などで一度Twitterにアクセスした場合に
WordPressのパーマリンクを日付ベースにする方法 - Rewish
WordPressのパーマリンクを/YYYY/MM/DD/hhmmの様な日付ベースにしようとすると、日付アーカイブになってしまい記事単体のページとして認識されません。 秒まで設定(/YYYY/MM/DD/hhmmssなど)すれば記事単体のページとして認識されますが、微妙に長くなってしまうので見た目もちょっと・・・ですよね。 と言う訳で今回は、半ば強引にパーマリンクを日付ベースにしてみたいと思います。 日付ベースのパーマリンクを有効にするコード 以下のコードをテーマファイルの何処か(functions.phpなど)に記述。 <?php add_action('parse_query', 'date_base_permalink'); function date_base_permalink($wp_query) { $q = (object)$wp_query->query_vars; //
ブログに「はてなスター」を設置してAutoPagerizeに対応する - Rewish
Hatena.Star.Token = 'トークン'; Hatena.Star.SiteConfig = { entryNodes: { 'article > header': { uri: 'h1 a', title: 'h1', container: 'h1' } } }; AutoPagerize(+AutoPatchWork)への対応 継ぎ足しされるノードをHatena.Star.EntryLoader.loadNewEntries()に渡すイベントリスナーをwindow.addEventListener()で登録する。 注意点として、Hatena.Star.SiteConfig.entryNodesで指定したセレクタに、継ぎ足しされるノードが含まれる場合、継ぎ足しされるノードからのセレクタに修正する必要がある。 ウチのブログの場合、継ぎ足しされるノードがarticle要素なので、
JavaScriptのDateオブジェクトを拡張してPHPのdate関数を実装 - Rewish
某勉強会のグループチャットにて、「JavaScriptでXMLを取得、パースして適当に表示しなさい」というお題が出た時、ちょっと欲しいなと思ったので勉強がてら作ってみました。 一応date関数に対応する全てのフォーマット文字列が使えますが、タイムゾーン周りを正確に実装するのは実質不可能なので、 e は「 Asia/Tokyo 」、 T は「 JST 」固定になっています。 その他、副産物で日付周りのメソッドも色々生えてるので、良かったら使ってみて下さい。 ダウンロード php_date.js 簡単な使い方 date関数風に使う基本 インスタンス化したDateオブジェクトのformatメソッドを使ってdate関数風にフォーマット。 var date = new Date(); alert(date.format('Y-m-d H:i:s')); //=> 2005-08-15 15:52:0
Expiresヘッダを送出するPHPのクラスとmod_rewrite - Rewish
レンタルサーバーではmod_expiresが使えない場合が多いので、PHPとmod_rewriteで頑張って追加してみよう的な感じです。 ただ、以下で示す方法は、画像などの静的ファイルにExpiresヘッダを追加するため、ファイル数分のPHPが動くのでサーバーに大きな負荷をかけてしまいます。 上記理由により、アクセスが多いサイトでは、使用しない方が無難かも知れません。 概要 header関数を利用して Expires / Last-Modified / Cache-control / Content-Type を送出するPHPのクラスと、それを利用するためのmod_rewriteの設定。 大まかな処理の流れ リクエストされたファイルが存在する場合、ファイルのフルパスをPHPに渡して処理。 拡張子からMIMEタイプを判別してContent-Typeを送出。 デフォルトの設定ではGZIP圧縮し
WordPressのはてな記法プラグイン「WP Hatena Notation」 - Rewish
はてなダイアリーでおなじみのはてな記法。慣れるとさくさく記事が書けてなかなか良いので、PHPのはてな記法パーサHatenaSyntaxを利用してWordPressのプラグインを作ってみました。 手軽に導入できるので、はてな記法が大好きなWordPressユーザーはぜひ使ってみてください。 ダウンロード WP Hatena Notation - 2.0.x 開発リポジトリはrewish/wp-hatena-notationです。 ライセンス GPLv2 or later サポートする記法 使用可能な記法についてはHatenaSyntaxに依存しています。詳しくはサポートする記法 - HatenaSyntaxマニュアルを参照してください。 キーワード記法については タグページへのリンク となります。 はてな記法の設定 【設定】メニューの【はてな記法】から設定を変更できます。 バージョン2.0未
WordPressに移行してHTML5で組んでみた - Rewish
2009 - 06 - 15 その他/告知 0user 0user MTはある程度使えるレベルになったので、PHP製CMSのWordPressに移行。同時にデザインも変更してHTML5っぽい感じにしてみました。 移行に伴って色々やってみたのですが、その辺は個別でまとめるとして、今回は簡単に書けそうな部分にだけ触れます。 HTML5について 現状、仕様を完全に追いきれて無いので、割と感覚で組んだ部分があります。結構難しいですねHTML5。適当にやってたら直ぐに置いていかれそう。でも面白い。 疑問点 セクションの関係を意識してたらh1がやたら増えた。こんな感じでいいのだろうか。まだ策定段階なので見本はほとんど無いし、仕様書見てもあんまり解らなかった。 と言うことで仕様が確定するまで取り敢えず待つことにする。 表示の高速化関連 CSS Spriteを使った(まとめ方が若干変) CSSを一つのファ
PHPとjQueryでCometっぽいモノを実装する - Rewish
クライアントからのリクエストに対してすぐに応答せず溜めておき、何らかのタイミングを見計らって応答する技術。 Comet - Wikipedia 例えばチャットなんかで使うと、相手が発言したタイミングでレスポンスが返ってくるので、リアルタイムに会話が出来たりする訳です。 ※あくまでも実装の一例なので、このままでは利用シーンがかなり限定される事をご留意下さい。 注意事項 以下の実装方法は、知識的なコストがあまり必要ない替わりに、サーバー的なコストを多く消費します。 共有レンタルサーバーなんかで使うと、アカウント制限・停止などの処置がとられる場合があるので、共有で使うスペースなどでの使用は避け、専用サーバーや自前のサーバーなどで使用して下さい。 Comet動作の流れ 大まかな流れはこんな感じです。 Ajax(XMLHttpRequest)を利用してサーバー(PHP)にリクエストを送る リクエスト
PHPで作る「ちょっと便利で優しい404ページ」 - Rewish
アドレスバーに直接URLを打ち込んで移動すると、タイプミスで間違ったページへ移動してしまい「404 Not Foundが表示された」なんて言う経験、ありますよね？ そんな時でも安心な、ちょっと便利で優しい404ページを作ってみたいと思います。 概要 「ちょっと便利で優しい404ページ」とは、予めサイト内のURLリストを書き出しておき、間違って入力されたURLと比較して、もっとも近い 実在URL を返す404ページです。 PHPで扱えればURLのリスト自体は何でも構いませんが、今回はsitemap.xmlを使った方法を紹介します。 ソースコード 404.php <?php /** * もしかしてお探しのページは [URL] ではありませんか？ * * @param string $sitemap サイトマップファイル * @return string 最も近い実在URL */ functio
「高さを揃えるCSSを利用した横並びリスト」の夏がやってくる - Rewish
タイトルはホッテントリメーカーで生成。 「リストを横並びにし、背景を付け、高さを揃える」こんなデザインが有ったり無かったりする訳ですが、リスト（ul+li）で実装しようとすると結構面倒だったり。 というわけで、高さの異なるカラムを揃えるスタイルシートを利用して上の条件を満たしたリストを考えてみたいと思います。 背景色のみ 背景色（画像）のみであれば比較的簡単に実装できると思います。 Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet, consectetur adipisicing elit Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Webデザインに関するアンケートのお知らせ - Rewish