はてなブックマーク

外部サービス向けのAPIが公開されていないGoogle+のシェアボタンをオリジナルのデザインに変更するために、Javascriptで共有数を取得してみました。 どこからシェア数を取得するか？まずどこからShare数を取得すればいいのかが問題となります。Google+純正のシェアボタンの構造を見るとわかる通り、以下のページをHTMLのIFRAMEで表示しているようです。 https://plusone.google.com/_/+1/fastbutton?hl=ja&url=ページのURLこのページのソースを見てみると、以下のJavascriptが目的の値となります。 window.__SSR = {c: **.* ,si:*,su:*,e:'*@gmail.com',dn:'*',a:'bubble',at:'*',ld:[,[2,80,[] ,1,106] ] ,s:'widget',a

追記(2014/07/15): ZIP版が公開されたので、この記事の方法よりも楽に利用することが可能になりました。 AtomのZIPパッケージ版が公開されました！ http://blogger.weblix.net/2014/07/github-atom-zip-install.html Githubによって作成されたテキストエディターであるAtomをインストールしてみました。 このAtomは、Githubによって開発されたオープンソースのテキストエディターで、様々な言語にプラグイン形式で対応しています。なので理論上どんな言語にも対応することが可能です。デフォルトで利用できる言語は以下のとおりです。 C CoffeeScript CSS GO HTML Java Javascript LESS Objective-C Perl PHP Python Ruby SASS ShellScrip

以前、BloggerをOGPに対応させる時に問題になる「og:image」をなんとかするという記事を書きました。 BloggerをOGPに対応させるときのog:imageをなんとかする http://rrvf.blogspot.jp/2011/10/blogger-ogp-og-image.html この問題を解決するには、Blogger側で使用できるデータタグの中に「og:image」に適切なものが存在しないので、外部サービスを立ち上げて対応しました。 BloggerSpice http://bloggerspice.appspot.com/ このサービスを現在でも使っている方がたくさん居るみたいなので、嬉しいです。 動作内容としては、記事に使用されている一番最初の画像にリダイレクトする、という単純なものなのですが、これがないとBloggerでは、Twitterカードの「twitter:

今更ながら「GithubでWebサイトでも作ってみるか！」と奮起したので、その作り方をメモしておきます。 Github Pagesの魅力 基本無料！容量も60MBくらいで警告されるみたいですが一応無制限？ サブドメインを振ってもらえる！（GoogleDriveだと無理） 独自ドメインも簡単に使える！ Githubだから更新履歴を残せる。ロールバックできる。 動的なサイトは組めませんが、jQueryとかを使えば案外リッチなサイトも作れそうです。 環境と要求 OS は Windows 7 コマンドで構築するのに慣れていないからGUIでやりたい MacやLinuxを使っている方に怒られそうですが、コマンドでやるのって敷居が高そうなので以上のような条件です。 1. はじめに Githubでアカウントを取得しましょう。これがないと何もできません。 GitHub · Build software be

前回の「TERAをアンインストールする」の記事で削除したファイル以外にもnProtectはシステムにごみを残すようです。本当に凶悪なプロテクトですね。 なので、前回に引き続き削除を行いたいと思います。削除方法は以下のサイト様を参照させていただきました。この場を借りてお礼申し上げます。 How Do I Uninstall Nprotect Game Guard? - http://www.brighthub.com/video-games/pc/articles/1709.aspx この削除手段は、誤って実行するとOSが起動しなくなる可能性があります。不安な方や初心者の方は、システムのバックアップを取ったり、復元ポイントの作成を行ってから作業することをお勧めします。 システムドライバの削除 nProtectはシステムフォルダに2つのドライバを作成するのでそれを削除します。その際OSによって

最近ブックマークレットがマイブームなので、作るときに覚えておくと便利なサービスやTipsを紹介したいと思います。 コードの圧縮 Closure Compiler Service http://closure-compiler.appspot.com/home このサービスは、入力されたJavascriptコードを解析して最適化したコードを出力してくれます。パース時間の短縮や、実行速度の高速化も見込めます。 ちなみに、Google製です。 ブックマークレット化 WDF - Software : ブックマークレット作成スクリプト http://www.eonet.ne.jp/~wdf/software/bookmarklet_creator.html 上記サービスは、通常のJavascriptコードをブックマークレット形式に変換してくれます。 変換した後のブックマークレットをリンク状態で出力し

少し前にGoogleドライブに静的ファイルをホスティングさせる記事を書きました。 GoogleドライブにBloggerで使う外部CSSをホスティングさせてみる : たき備忘録 http://rrvf.blogspot.jp/2013/02/google-drive-css-hosting.html このブログでは、上記の方法を利用してJavascriptやCSSをホスティングしています。 その際に、いちいちアップロードしたファイルのIDを調べて、"http://www.googledrive.com/host/..."というURLを作るのが面倒だったのでブックマークレットを作りました。 ソースコードは以下の通りです。 javascript:(function(){ var v=document.getElementsByClassName("doclistview"); for(var i

前回、Google画像検索を利用して画像から情報を検索する記事を書きました。 Googleを利用して画像から類似画像を検索する方法 http://rrvf.blogspot.jp/2013/01/google-image-search.html この方法でも検索できるのですが、一度ローカルにファイルをダウンロードするかURLを入力する必要があるので少し面倒なので、ブックマークレットを作ってみました。 「誰娘」の使い方 まず下記のリンク（ブックマークレット）をお気に入りバーにドラッグしてください。 試す場合は、そのままリンクを開いてください。 誰娘 次に、検索したい画像が含まれるページで登録したブックマークレットをクリックします。 オーバーレイでページに含まれる画像の一覧が表示されるので、検索したい画像をクリックするとGoogle画像検索に飛びます。 画像以外の部分をクリックするとオーバーレ

今がチャンスです！ GoogleドライブにWEBホスティングが追加されたということで、前回、記事を書きました。 GoogleドライブにBloggerで使う外部CSSをホスティングさせてみる 外部CSSをGoogleドライブに置いて様子を見ていたところ、思わぬメリットがあることに気づきました。 Googleドライブに静的ファイルを置くメリット Googleのサービスで頻繁に使用されている次世代通信プロトコルである「SPDY」という技術があるのですが「もしかしたら、Googleドライブでも使えるかも！？」と思い、チェックしてみました。 SPDY - Wikipedia http://ja.wikipedia.org/wiki/SPDY Google Chromeで「SPDY」が使用されているかチェックする方法 以下の拡張機能をインストールすることで確認することができます。 SPDY indic

Googleドライブがアップデートされ、WEBホスティング機能が追加されたということで、外部CSS置き場としても使えるのかを試してみました。 GoogleドライブにWebホスティング機能が追加 - ITmedia ニュース http://www.itmedia.co.jp/news/articles/1302/06/news139.html 前回は速度なども詳しく検証しましたが、今回はあまり時間が取れないので、とりあえず使ってみながら様子をみることにしました。 前回の記事はこちら。 CSSやJavascriptを外部化する時にベストなサービス 追記 http://rrvf.blogspot.jp/2012/07/css-js-externalize-service.html GoogleドライブにCSSをアップロードし、外部から参照できるように設定する まず下記URLからGoogleドライ

Bloggerのテンプレートをカスタマイズしていくと、強制的に追加されるバンドルCSS「3950009988-widget_css_bundle.css」が非常に邪魔に感じるようになると思います。 しかも、このCSSは、読み込みに非常に時間がかかる場合があり、最悪500ミリ秒以上の遅延が発生することもあります。これが無くなるだけでBlogの表示時間を短縮できる可能性があります。しかも、ファイルサイズが21KBもあるのが悩みの種です。 今回は、自動で追加されるバンドルCSSを無効化してみようと思います。 前提 恐らく、このような問題に遭遇する方は、CSSをテンプレートに記述するのではなく、CSSを外部に移動させていると思います。 そのため、テンプレートの必須要素である「<b:skin></b:skin>」が空であることを前提とします。 そもそも、この「<b:skin></b:skin>」タグ

インターネットを巡回していると、出所が良くわからない画像や、名前の分からないキャラクター画像などに遭遇することがよくあると思います。 こんなときに役に立つのが、皆さんもいつも利用している「Google 画像検索」です。 Google 画像検索 http://images.google.com/ ご存知の方も多いと思いますが、この「Google 画像検索」は、キーワード検索だけでなく、画像から類似画像を検索するという機能もあるのです！。 [2014/03/04 追記] ブックマークレットの専用ページを公開しました。 類似画像検索ブックマークレット「誰娘」のGithubページを公開しました http://rrvf.blogspot.jp/2014/03/google-image-search-dareko.html [2013/02/26 追記] 超簡単に画像検索が使えるブックマークレット作り

本日（2012/08/15）からAdobeがAndroid用の「AdobeFlashPlayer」がGooglePlay上から削除されるとともに、開発やアップデートも停止されます。 これにより、今後発売されるAndroid端末や、OSのアップデートなどを行った端末などでは、フラッシュが閲覧不可となります。 そもそもなぜこのような判断をAdobeが下したかというと、HTML5でフラッシュと同等の機能が提供されることと、Android端末の数が増えすぎたことにより、開発が難しくなったという経緯があるようです。 しかしながら、現時点でもフラッシュプレイヤーを利用したサイトは依然数多く存在します（ニコニコ動画など）。 なので、2012/08/15以降でも「AdobeFlashPlayer」をインストールする方法を覚書しておきます。 APKファイルの入手 まず、Adobeが過去のFlashPlaye

自分でサーバなどを用意してWordpressなどでブログを運営する際にはあまり問題になりませんが、Bloggerなどの各種ブログサービスを利用する時に問題になるのが、CSSやJavascriptなどの外部化です。 別に外部化を行わなくても問題はありませんが、SEOやキャッシュ効果を狙うのであれば必要になってくる要素だと思います。 またここで悩むのが、どのサービスに外部化したCSSを置くか？です。このとき要求される要素としては、下記の2点が最重要となります。 高速なレスポンスと転送速度 安定したシステム 特に「高速なレスポンスと転送速度」が重要で、CSSの読み込みが完了するまでブラウザはページのレンダリングをブロックするので、表示完了までの時間が長くなってしまいます。 今回は「高速なレスポンスと転送速度」をメインにサービスを探してみたいと思います。 GoogleAppEngine Dropb

こんにちは。zerippeです。 前回の記事で「Bloggerのテンプレートをモバイル端末対応にしてデザインの自由度を格段にアップさせる方法」という記事を書きましたが、もうちょっと上を目指して"レスポンシブデザイン"をBloggerテンプレートに採用してみました。 レスポンシブデザインって何？ 自分もあまり詳しくはないのですが、どうやら「CSSのメディア属性を利用して、ディスプレイの解像度によってデザインを変化させ、様々なデバイスに対応するもの」らしいです（間違っていたらご指摘ください）。 ようするに、CSSだけでスマートフォンなどの低解像度端末や、中解像度のタブレット端末、高解像度のパソコンなどに適したデザインを自動で適応させるデザイン手法のことを言っているようです。 Bloggerのテンプレートをレスポンシブデザイン化するメリット まずはメリットから上げてみます。 スマートフォンなどの

先日までこのブログのモバイル用テンプレートに、Bloggerデフォルトの「シンプル」というモバイルテンプレートを使っていました。 しかし、デフォルトのモバイルテンプレートを使用する場合には、以下の点に不満がありました。 スマートフォンでアクセスしたときに、横にスワイプすると次の記事に勝手に移動する テンプレートの書き換えが一切できないので、ソーシャル的にも弱い 特に上記1のスワイプ回りの動作は、嫌がらせのような仕様なので早くなんとかしたいと思っていました。 そこで今回、極力テンプレートの修正を行わずにスマートフォンへ対応させてみました。 たき備忘録 - モバイル版 http://rrvf.blogspot.jp/?m=1 モバイルテンプレートを無効にしてカスタムテンプレートを有効にする まずはBloggerのダッシュボードから、「テンプレート」>「モバイル」>歯車のボタンから設定画面を開き

Bloggerの設定画面で、"設定 > 投稿とコメント > 最大件数で表示"からメインページで表示する最大件数の設定が可能です。 しかし、ラベルページやブログ内検索、アーカイブウィジェットでは、上記の設定は有効にならず、必ず20件ずつ表示されてしまいます。 この動作を変更するには、テンプレートを独自に書き換える必要があります。 今回はこの方法について説明してみようと思います。 ラベルページの最大表示件数を変更する たとえばラベルページの最大表示件数を変更したい場合は、まずテンプレートから下記のような記述を探します。 expr:href='data:label.url' 上記のような部分に修正を加えることで、表示件数を制限することができます。 具体的には下記のように書き換えればOKです。 expr:href='data:label.url + &quot;?max-results=5&quo

Android用のNintendo64（n64）のエミュレータをGalaxyS2インストールしてみました。 流石に3Dなので非常に動作が重かったり、そもそも動作しなかったりするソフトもあるのであまり実用的ではありません。 しかし、特定のソフトでは高いレベルでのエミュレーションが可能なようです。 以下の画像が、実際に"ゼルダの伝説 時のオカリナ"を動作させてみたスクリーンショットです。 スクリーンショットから分かるように、画面上にコントローラが描写されています。なので操作はかなり難しいです。 しかしながら、テクスチャ剥がれなどのバグもあまり見当たらないので、少し頑張ればプレイできそうです。 導入方法 この"N64oid"はGoogle Play上には公開されていないので、他のサイトからダウンロードする必要があります。 N64oid v2.6.2.apk http://www.mediafir

Bloggerのブログアドレスが地域によって色々なドメインにリダイレクトされるようになってから少し経ちました。 各種ブログパーツもBloggerの変更に対応してくれたお陰で今のところ問題なさそうだと思っていました。 しかし、最近になって「はてなブックマークのウィジェットがなんかおかしい」という点に気が付きました。 なにがおかしい？ このブログでは、新しい記事を書いたら自分ではてなブックマークボタンを押すようにしているのですが、ブックマークしてもウィジェットに反映されていませんでした。 ちなみにウィジェットの「Hatena.BookmarkWidget.url」には「data:blog.homepageUrl」を指定していました。 ちなみにこのブログの場合、data:blog.homepageUrl = http://rrvf.blogspot.jpです。 どこに問題があるのかが分からなかっ

主にDLLインジェクションを利用したDirectXのAPIフックを行う際に参考になったページの備忘録です。 APIフックや開発に便利なツールなども記述しておきます。 DirectX Hook Cheat Engine :: View topic - D3D Overlay http://forum.cheatengine.org/viewtopic.php?t=315593&postdays=0&postorder=asc&start=15 Direct3DCreate9と、それによって作成されたインスタンスのCreateDeviceをフックするコードが掲載されています。 動的リンクで呼び出している関数へのフック、DirectX9へのフック その2 http://asd.if.land.to/code/apihook4.html DLLProxy（またはDLLInjection）手法を利用

たった今気付いたことなのですが、このブログや、他の日本圏のブロガーさんのブログアドレスが変更されています。 このブログの場合は、以下のように変更されてしまいました。 変更前: http://rrvf.blogspot.com 変更後: http://rrvf.blogspot.jp 恐らくブログの設定で使用言語が「日本語」に設定されていると.comドメインから.jpドメインにリダイレクトされるようです。 [2012/03/18] この変更によって多くのブログが以下のような被害を受けているようです。 Google+やFacebookのいいね！、Twitterのつぶやかれ数が全てリセット（URLが変更されたことによる副作用） 海外からのアクセスの場合、blogspot.com.ukのようにURLが変化するので、アフィリエイトなどでは問題が起こる可能性がある [2012/03/17] 以下のペー

Bloggerを利用し始めてから早くも半年が過ぎ、テンプレートを少しずつ改良（改悪？）してよやくブログっぽくなってきました。 私は、Blogger以外のブログサービスを利用したことがあまり無いので強くは言えませんが、少なくともはてなブログやWordpress.comよりは高いカスタマイズ性があると感じています。 しかし、テンプレートを弄ったりしていると微妙にかゆい部分が出てくるもので、現時点でも結構不満があったりします。 各記事のアイキャッチ画像のリンクを示す要素がない 各記事に表示される「次の記事」「前の記事」に対象のタイトルが挿入できない 関連記事機能がない 上記の3点が特に気になる部分です。3は外部のサービスを利用することでなんとかなりますが、1と2に関しては少し難しいように思います。 そこで私は以前にbLinkerというプラグインを作成しましたが、どうせなら不満のある部分を全部カバ

最近Javascriptでの開発が楽しくてしょうがない私ですが、最近になってある問題が発生しました。そもそも私はJavascript関連の開発を行う際に、jsFiddleというWEBサービスを利用していました。 http://jsfiddle.net/ このサービスは、HTML＋CSS＋Javascriptという3つのソースを簡単に編集、実行することが可能なので非常に便利でした。 しかし、最近使っていて思ったのが、非常にレスポンスが悪いという点です。実行ボタンを押すと数十秒待たされることがよくあり、最悪タイムアウトしてしまいます。私の開発スタンスとしては、try and errorなのでやはりレスポンスは重要です。 そこでローカルで動くIDE（統合開発環境）を探していたのですが、Java環境で動くものが多く、Eclipseのように起動に数十秒かかるようでは、よくないと思っていました。 そこ

Tumblrにはタグクラウドを表示する機能がありません。なので今回はjQueryを使ってタグクラウドを表示するプラグインを作ってみました。既に他の方もやっているようですが、自分なりに改造しやすいような形で再開発してみました。初めてjQueryでプラグインを作ったので多少バグはあるとは思いますが公開します。 Tanglrの入手方法 GoogleAppEngineにスタティックファイルとしてアップロードしました。Tumblrにはファイルをアップロードできないので置き場が無い方は以下のリンクを利用してください。 http://zerippe.appspot.com/libs/tanglr/1.0/tanglr.js(非圧縮版) http://zerippe.appspot.com/libs/tanglr/1.0/tanglr.min.js(圧縮版) 多分ありえないとは思いますが、トラフィック的に