アメグラの楽屋裏

アメグラの楽屋裏“アメリカン・グラフィティ非公式辞典”管理人MALの楽屋裏へわざわざようこそいらっしゃいました。

こちらではCSS3を使わずにXHTML+jQueryによるwordpressの構築実験を兼ねつつ、他愛ないblogを綴っております。



Valid XHTML + RDFa 正当なCSSです!
JQuery wordpress

最近の記事

wordpress携帯対応twitterボタンなど
スマホ全盛の昨今、ガラケー向け構築などいまどきライクではないのですが wordpressで構築したサイトを携帯にもちゃんと対応を。。 とのお話がございまして。。 ちょっとこのブログを間借りして実装実験。。の巻です。   使ったのはもちろん Ktai Style http://wppluginsj.sourceforge.jp/ktai_style/ header.phpの <?php /* ks_use_appl_xhtml(); */ ?> のコメントアウトを外す事によって appl_xhtmlが開放されてXHTMLソースに変身! メーカー別にヘッダを出力するので docomoであればi-XHTMLに対応します。 更に独自CSSも使えるという、魔法のような仕掛けのプラグイン。 僕も昔は携帯サイトを手がけましたが、ハマり出すと奥が深くって 絵文字の振り分けだけでも疲れた覚えがありますので ものすごい力作である事がうかがえます。拍手もんです。   その代わり、appl_xhtmlを使うと旧い端末では閲覧できなくなるかも? スタイリッシュな志向であればその辺はご勘弁。分岐も可能でしょうが今回は割愛。   Firefoxの偽装ブラウザアドオン“User Agent Switcher”を使って色々チェックしますと デフォルトの記事で改行を数段使うと吐き出してしまう &nbsp;がXMLパースエラーになってしまうので、preg_replaceでかわしてみたものの、 実はFirefoxの仕様なのだそうで、実際の端末ではスルーしてページを表示してくれる模様。 以下のシミュレータも参考に。 【docomo】iモードHTMLシミュレータ http://www.nttdocomo.co.jp/service/developer/make/content/browser/html/tool2/index.html 【SoftBank】ウェブコンテンツヴューア http://creation.mb.softbank.jp/mc/tech/tech_web/web_docandtools.html 【au】 EZアプリ(J)SDK http://www.au.kddi.com/ezfactory/tec/spec/download.html そんなわけで、気にせずサクサクっとデザインのみ変更。 参考になります↓ どや!?KtaiStyleをカスタマイズするときのポイントと注意点 http://musilog.net/webdesign/wordpress/wpktai-style.php ツイッターボタン このプラグインを尊重して、 文字コードはデフォルトのSJISのまま行こうと思ったので twitterに送信する際にネックになるであろう 「記事のタイトル」をmb_convert_encodingしようと思ったのですが なんだかややこしい変換だと気付き作戦変更。 考えて見たら、このブログはパーマリンクに/%postname%を使っているので basename($_SERVER['REQUEST_URI'])←(つまりURLのお尻の部分だけ抜粋) でいけるじゃん。。って事で以下のようにしました。 <div><a href="http://twtr.jp/share?url=<?php echo [more]
Facebookのogメタタグと適正なDOCTYPE宣言
公式Twitterボタンの改造に意外とアクセスがあるようですので 今日はFacebookのソーシャルボタンの実装がらみのアレコレ、です。   対外的なweb制作において、SEO対策を意識する事は当然なのですが かつてはSEOの雛型のように扱われたメタタグ群も、Google様はほとんど無視するご時世。 姑息ながらも、SNSを介した検索ヒット率向上を狙うのが当たり前になりつつあります。   日本でも登録者数1,000万人強とも言われるFacebookとの連携は グローバルな展開も期待できますので、企業HPなどでは大いに活用すべきかな?との思いもあります。 「いいね!」ボタン Facebookの「いいね!」ボタンは Facebookに登録していないなくともHPやブログに実装する事は可能です。 単にボタンをつけるだけなら↓を参考に。 「いいね!」ボタンを設置しよう http://www.facebook-japan.com/iine.html OGP記述 「いいね!」ボタンをちゃんと動作させるためには Facebook御用達のルール、OGP(OpenGraphprotocol)という情報を明記しなければいけません。   Facebookの「いいね!」ボタンの盲点。ボタンを設置するだけでは、押しても情報は広まらない。→OGPに対応しよう! http://nishi248.blog60.fc2.com/blog-entry-956.html これこそが、いまどきのメタタグ。 最低限の記述で良いとは思いますが Facebookユーザであればその情報ももちろん明記できますし ヘビーユーザ向けに色々なタグがあるようです。 フェイスブック、ミクシィ、グリーで使われている OGP (Open Graph Protocol) とは何か http://d.hatena.ne.jp/amachang/20110117/1295233078   wordpressでの記述 WP-OGPなるプラグインがあるようですが header.phpに手書きで十分でしょう。   ↓のサイトではog:imageを記事から抜粋するスクリプトが公開されています。 プラグインを使わずにWordPressにFacebook用OGP(Open Graph Protocol)を設定する http://webbingstudio.com/weblog/cms/entry-486.html たとえば、 アイキャッチ画像を指定しなくても、この画像をこの記事のog:imageとしてFacebookに送信できるわけです。 関係ない画像で釣りができそうですね?   ちなみに↑のサイト様ではsingle.phpとpage.phpの条件分岐がされていますが サイト環境に合ったphpの挿入コードを臨機応変に、です。 僕のこのブログでは、「フロントページ」(TOP)及び「投稿ページ」(Blog)のog:descriptionを <meta property="og:description" content="<?php [more]
Stanley Kubrick 鬼才の青春時代
1945年4月12日。 ルーズベルト大統領の急逝を知った弱冠16歳のスタンリー・キューブリックは、 街角の新聞販売店でうなだれる老人を撮った。     この1枚をきっかけにLOOK誌の専属カメラマンとなり 16,000点にも及ぶスチール作品を残しているのだそうだ。   1940年代の何気ないニューヨークの風景、人物、テーマ性を匂わせるシリーズ作品、 演出を仕込みながら偶発を狙った作品、後に活かされるステディカムの原点のような連写など   実験的と思える彼のファインダーを通した世界観には リアリティを超越した現実が描写されているように思います。   1951年。 フォトグラファー時代の模索と葛藤の末に 彼が追い求めたアートは映像という形で具現化され 映画監督として飽くなき野心を剥き出すのでした。。   中学生の頃衝撃を受けた『2001年宇宙の旅』や『時計じかけのオレンジ』、そして『シャイニング』。。 リスペクトしている監督の1人なのですが NHK BS歴史館 巨匠たちの青の時代 スタンリー・キューブリック 俺の眼を見つけた! http://pid.nhk.or.jp/pid04/ProgramIntro/Show.do?pkey=001-20120212-10-15420&pf=f 先日再放送された番組に感銘してしまい 思わずネットで拾った画像でPhoto [more]
Linksページ追加
↑のメニューに“Links”を追加しました。 といっても、面識や交流のある方々のブログのRSSを リンク化させた簡易なものでございます。 広告もしっかり飛んできておりますが、めんどいので駆除してません。。(ぇ?   3年前に、Hot Rod,Custom & [more]
アメリカン・ビンテージ大修復!ビフォー&アフター
2月9日からヒストリーチャンネルの新番組 『アメリカン・ビンテージ大修復!ビフォー&アフターS1』(American Restoration) http://www.historychannel.co.jp/detail.php?p_id=00359 が始まりましたね。 そもそも、ラスベガスの質屋を舞台にした、 米国ケーブルテレビ視聴率ナンバーワン番組、 『アメリカお宝鑑定団ポーンスターズ 』(Pawn Stars)に持ち込まれた ガラクタ同然のヴィンテージアイテムのレストアを請け負うショップとして シリーズ中にも何度か登場していましたが、 オーナーのリック・デイルの手腕が認められて実現したであろうという独立番組です。 もちろん実在するショップ。 Rick's Restorations http://www.ricksrestorations.com/ たまに、ええええ??っと思ってしまうような リック流にアレンジしたレストアをしてくれたり、 そこはやっぱマイナスネジを使ってくれよ。。っと思う事もあるのですが。。   見てて思うのは、レストア代金に作業時間がきっちり計上され クライアントにも理解されている点がさすがアメリカ。 じゃなきゃこんなマニアックな職人ビジネスも成り立ちません。   錆びててもオリジナルの方がいい!って人もいましょうが こうしたレストア物が日本にも結構入ってきている昨今 そのプロセスを見るだけでも勉強になります。 てか、ウチにもレストアしてほしいもんいっぱいあるんですが、、(ぁ。   ともあれ、これで日本でも本作と前述の『ポーンスターズ 』、 そして『眠ったお宝探し隊 アメリカン・ピッカーズ』(American Pickers)の 3本柱の放映が実現の運びとなりました。   今なら特番も組まれていて、アメリカのガラクタを拝見できる楽しい毎日です。 ちなみに今回『ポーンスターズ [more]
モバゲーやmixiの投稿時間表示
モバゲーがソーシャルゲームにシフトし始めて かれこれ2年半近く経ちましたでしょうか?   テクニックを要さず万人がプレイできるラフな作り、 プレイヤー同士がコミュニケーションもできるという ソーシャルゲームという新ジャンルの可能性に 面白さを見出そう、、、と思ってもいましたが   あからさまな子供騙しの課金誘発手口と その商魂が露骨になってきてから 呆れるばかりか軽蔑するようになりました。。   もちろん自制できないプレイヤー側にも非はあるでしょう。 物質的な対価は何も残らない事を承知で 実生活を省みず借金してまでハマる人もいるそうで。。 人間の所有欲、顕示欲って恐ろしいもんです。   そんな心理を逆手に取って開発するのでしょうからえげつない。 クレカがない子供でもwebmoneyなんてコンビニで決済OKですし ローン会社の広告まで打ってある親切さって、いったい何のトラップ?   しかも下請け業者に丸投げのゲームがほとんどで 稼ぐだけ稼いで利用者が減った頃にサービス終了なんて話はザラ。   あれって法で規制する事はできないんでしょうかねえ? どう考えてもグレーなビジネスだと思います。   と、本題から反れてしまいました。。   モバゲーでは、日記を書いたりコメントがついた場合 「投稿日時」がその日のものであれば「○時○分」と表示され、 午前0時を過ぎると前日の日付に変わります。   後にこの表示方法はmixiも真似しましたが、 mixiの場合、どちらかというと「ログイン」時間の表示ばかり気にするのがフツーの人。 このカラクリに「ふふふ」っと思ってしまうのがコード好きの違いでしょうか?   考えてもみてください。   投稿された時間から「○時間経過」と表示されるなら単なる引き算。 小学生でもわかります。 投稿日時から2日間「NEW!」というマークを表示しましょう、、 なんていう手法も、この考え方が基本です。   でも、閲覧している今のこの時間と投稿された時間を比べたところで 午前0時の存在を指すものがありません。 1日86,400秒増加し続けるUNIX時間からどう逆算するのか?   でも、PHPにはそんな関数がちゃんとあります。 mktime() http://php.net/manual/ja/function.mktime.php 今日の午前0時であれば mktime(0, 0, 0); 日付指定もできます。 この関数より投稿時間のタイムスタンプが大きければ(経過していれば)「時間」、 少なければ「日付」で表示、、 と導くようにするわけですね。   いまどきのブログなら当たり前のように RSSを取得するパーツが付随していると思いますが フツーのホームページを構築する上で indexページにmagpieなどで掲示板などの投稿日時のRSSを抜いて ヘッドラインを無理やり作る手法もあります。 MagpieRSS - PHP で使える RSS [more]