読者です 読者をやめる 読者になる 読者になる

太陽がまぶしかったから

C'etait a cause du soleil.

『あわせて読みたいG』が停止したので暫定対応版を緊急リリース

プログラミング プログラミング-はてなブログカスタマイズ

f:id:bulldra:20151203084126j:plain

Google Feed API停止に伴ってあわせて読みたいGが停止

Google Feed APIというAPIサービスが終了した様ですね。
「Yahoo! Pipes」サービスが終わり、次いで「Google Feed API」サービスも終了した、と。
しかもほぼ同時期に!?

 Google Feed APIが停止されたの? 全然知らんかった。これに伴ってあわせて読みたいGが停止しました。

 Googleスプレッドシートを使う方法などの代替案があるようですが、ぱっと作れるものではないので一旦は暫定版をリリースします。もともとは別件で作っていたものなので見た目が大きく変わってますが、こちらはYahoo PipesもGoogle Feed APIも使っていないのでちゃんと動いてます。

<div class="hatena-module-foot">
<h3>あわせて読みたい</h3>

<div style="display:inline-block;">
<div class="hatena-module hatena-module-entries-access-ranking"
     data-count="3"
     data-display_entry_category="0"
     data-display_entry_image="1"
     data-display_entry_image_size_width="364"
     data-display_entry_image_size_height="90"
     data-display_entry_body_length="0"
     data-display_entry_date="0"
     data-display_bookmark_count="1"
     data-source="access"
>
<div class="hatena-module-body">
  </div>
</div>

<div class="hatena-module hatena-module-entries-access-ranking"
     data-count="3"
     data-display_entry_category="0"
     data-display_entry_image="1"
     data-display_entry_image_size_width="364"
     data-display_entry_image_size_height="90"
     data-display_entry_body_length="0"
     data-display_entry_date="0"
     data-display_bookmark_count="1"
     data-source="total_bookmark"
>
  <div class="hatena-module-body">
  </div>
</div>

</div>

<style>
.hatena-module-foot .hatena-module-entries-access-ranking {
  width:362px;
  border:0;
  box-shadow:none;
  display: inline-block;
}

.hatena-module-foot .hatena-module-entries-access-ranking .hatena-module-body {
  margin:0;
  padding:0;
}

.hatena-module-foot .hatena-module-entries-access-ranking .hatena-module-body {
  margin:0;
  padding:0;
}

.hatena-urllist {
  position: relative;
  background: #fff;
  width: 100%;
  overflow: hidden;
  margin-top: 2px;
}

.hatena-urllist li {
  border-bottom: 0;
  line-height: 1.5;
  position: relative;
  margin-bottom: 1px;
}

.hatena-urllist li a {
  text-decoration: none;
}

.urllist-item-inner.recent-entries-item-inner,.urllist-item-inner.entries-access-ranking-item-inner {
  height: 100%;
}

.urllist-with-thumbnails li .urllist-image, img.urllist-image.entries-access-ranking-image {
  margin: 0;
  padding: 0;
  top: 0px;
  left: 0;
}

a.urllist-title-link.recent-entries-title-link.urllist-title.recent-entries-title,a.urllist-title-link.entries-access-ranking-title-link.urllist-title.entries-access-ranking-title {
  position: absolute;
  top: 0px;
  left: 0;
  word-break: break-all;
  overflow: hidden;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 5%;
  background: rgba(77, 77, 77, 0.62);
  color: rgba(255, 255, 255, 0.985);
  font-size: 15px !important;
  text-align: left;
  text-shadow: -1px 1px rgba(0, 0, 0, 0.15);
  -webkit-transition: all 0.5s ease-out;
  -moz-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}

a.urllist-title-link.recent-entries-title-link.urllist-title.recent-entries-title:hover,a.urllist-title-link.entries-access-ranking-title-link.urllist-title.entries-access-ranking-title:hover {
  background: rgba(255, 255, 255, 0.05);
  color: transparent;
  text-shadow: none;
  padding-top: 30px;
  text-decoration: none;
}

a.bookmark-widget-counter img {
  position: absolute;
  right: 5px;
  bottom: 5px;
}
</style>
</div>

動作の仕組み

 はてなのサイドメニューにランキング情報を非同期で表示させる仕組みを横取りして、スタイルをあわせて読みたいっぽく変更しています。

 本当はカテゴリを選ばせたり、色々やらなきゃいけないことがあるのですが、動ける時間がないので完全版は先になってしまいそうです。申し訳ありませんが、よろしくお願い致します。