PHGへの対応は終わりましたか?AppHtmlにアプリダウンロードボタンを付けました。

f:id:sattelle:20130907063153j:plain2013/9/7時点の記事です。

私はブログ初心者ですが、いっちょまえにiTunesアフィリエイトプログラムに参加しています。

リンクシェアからPHGへ

「10月1日より、iTunesアフィリエイトプログラムの提携先が、リンクシェアジャパンから、PHGに移行します。」

iTunesアフィリエイトチームからの電子メールで以前より認知していたのですが、初心者なりに記事を出来るだけ沢山書くことに精一杯で、iTunesリンクの差し替えがついつい後回しに。しかし、残り一ヶ月をきって、そうも言ってられない様子。

AppHtmlがPHGに!

@hiro45jpさんのAppHtmlは非常に便利。普段より、iTunesリンクを作成する際に使用させて頂いておりました。
この度PHG対応版が出来たとのことで、またもや、お世話になる事に。
http://ichitaso.com/iphone/itunes-mac-app-store-apphtml/
http://delaymania.com/201308/blog/apphtml_for_phg/
AppHtmlとiBooksHtmlなど、PHG対応版ブックマークレット | iPhoneとマヨテキメモ

以上の、私がRSS購読している、@ichitasoさん、@delaymaniaさん、そして、@mayo1950さんの記事を参考に、AppHtmlのPHG対応版を遅れ馳せながら、自分もカスタムしてみました。

EverGear ダウンロードボタンfor PHG

EverGear - Evernote投稿ツール 2.0.5(¥350)App
カテゴリ:仕事効率化, ビジネス
販売元: Lakesoft - Hiroshi Hashiguchi

全てのバージョンの評価: (70件の評価)
アプリをダウンロードする

仕上がりはこんな感じ。
私が普段ライフログに利用している多機能アプリEverGearのリンクです。
みなさんの過去記事を参考にダウンロードボタンを追加してみました。(Html、CSSJavascriptの区別もロクに出来ない私には丸一日かかりました。)
iOS7がフラットデザインという事で、ボタンのシャドウやグラデーションはどうしようか迷いましたが、あった方がボタンらしく見えると娘ちゃんの助言があったので、今まで使っていたものをそのまま流用してます。アイコン画像とアプリ名、ダウンロードボタンがリンクになっております。参考までにコードを置いて置きます。
AppHtml AppLink ボタン付き暫定版

<div style="color:#oobfff;background-color:whitesmoke;margin:10px;padding:17px 10px 12px 10px;border-radius:15px;-moz-border-radius:15px;-webkit-border-radius:2px;min-height:100px;"><a href="${phgurl}" target="_blank" rel="nofollow"><img width="100" class="alignleft" align="left" src="${icon100url}" style="border-radius: 20px;-moz-border-radius:22px;-webkit-border-radius:22px;margin: 0px 15px 1px 5px;border:none;padding:0px;float:left;"></a><a href="${phgurl}" target="_blank" rel="nofollow" style="color:dimgray;font-size:130%;font-weight:bold"><strong>${title}</strong></a><a href="${phgurl}" target="_blank" rel="nofollow"><img src="http://ax.phobos.apple.com.edgesuite.net/ja_jp/images/web/linkmaker/badge_appstore-sm.gif" style="vertical-align: text-bottom;"width="70" alt="App" ></a><br />カテゴリ:${category}<br> 販売元: ${seller}<br><br> 全てのバージョンの評価: ${allverstar}(${allreviewcnt})  ${univ}<br><div class="appDownloadButton"><a href="${phgurl}" target="_blank" rel="nofollow"><img src="http://cdn-ak.f.st-hatena.com/images/fotolife/s/sattelle/20130730/20130730133746.jpg" style="margin-left:5%;margin-right:5%;border-radius:5px;box-shadow:1px 2px 3px gray;" width="90%" height="25%" alt="アプリをダウンロードする" /></a></div><br style="clear: both;"></div>

以上を@ichitasoさんのAppHtmlメーカー for PHGにおいて、直接カスタマイズ欄にコピペしてお使いください。画像を自分のモノに差し替えるといいと思います。ただし、初心者ゆえコードが強引ですので、Javascriptsについて知識のある方はキレイに修正してください。
なお、@ichitasoさんの記事にて、使用上の注意も記されておりますので、熟読された上での使用をオススメします。


f:id:sattelle:20130731235017j:plain
  • ツールのカスタマイズは大変だけれど、実際動くと結構、感動する。
  • iPhoneのみでのデバッグ作業は地味でツライ。
  • Html、CSSJavascriptを勉強すれば、楽しい事がもっと増える?
  • ブログの更新が遅れるのをツールの所為にしては駄目。
さあ、リンクも整った事だし、ブログ更新ペースを上げられるよう頑張ります‼