メシのタネ

Webプログラミング 備忘録

  • AWS移行でコケ中

    現在このWebサイトが稼働している、このサーバーのMySQLをマスターとし、AWS上のRDSをスレーブとして、データ移行をしようと思ったが、バイナリロギングの取得が上手くいかない。多分の手順VPSのDBでスレーブ用のユーザ作成バイナリロギングを行うスレーブ側RDSにマスターのDUM[...]

    続きを読む
  • AWS ソリューションアーキテクト アソシエイトに合格しました。

    実は、今日までIT無資格でした。ええ歳だし、そろそろなんか資格取っておくかーと考えだしたので、取って嬉しい資格を取ろうと思ってたところ、AWSの資格あったなーと思って、調べてみたら、みんな14日で受かる!とか言ってるので、じゃあというこで、試験日14日後とかにして、試験の予約入れたのが地獄の始まり[...]

    続きを読む
  • DOMをPHPで操作できたらいいよね

    そうだよね。そう思うよね。JavaScriptでやると、画面がガタついたりするもんね。そうならないようにする方法もあるかもしれないけど、僕はできませんので、サーバー側でなんとかできたらええなぁと思って挑戦したけど、できませんでしたよ。PHP標準でHTMLをDOMにできるらしい今、技[...]

    続きを読む
  • 設計書ってなんで書くの?

    設計書をなぜ書くのかから始めてかれこれ3年近くこの禅問答をやっているわけですが、いまだに答えは出ません。ただ、その禅問答をやる中で設計書に対する取り組み方は大きく変わったので、その一部でも書いていきたい。基本設計はとにもかくにも必要だと思う設計書はいらぬ!という話をよく聞くし、自分[...]

    続きを読む
  • 書ききってやる。

    久々に書いてみる。久々に文章を書くということをやってみようと思う。伝える作業を観察したいと思ったからそうしたいと考えた。情緒的な文章は基本的にゴミ箱にぽいしてきましたが、情緒的なのも自分だと思う。「文章をかくという作業は、とりもなおさず自分と自分をとりまく事物との距離を確認すること[...]

    続きを読む

【Web】pocketボタンをつける方法

ahiru
私のブログの性質上、中々いいねとか皆しないと思うので、
後で読むができるpocketのソーシャルボタンをつけました。
全然むつかしくないので、気軽につけれます。

pocketソーシャルボタン設置

こういうソーシャルボタンってなんかパターンありますよね。
Enchant.jsとかでプログラム作ってるんだろうか。
とりあえず2014/7/22時点でWordPressではこう設定します。

</p>
<p>		&lt;a data-pocket-label=&quot;pocket&quot; data-pocket-count=&quot;horizontal&quot; class=&quot;pocket-btn&quot; data-lang=&quot;en&quot; data-save-url=&quot;&lt;?php the_permalink();?&gt;&quot;&gt;&lt;/a&gt;<br />
		&lt;script type=&quot;text/javascript&quot;&gt;!function(d,i){if(!d.getElementById(i)){var j=d.createElement(&quot;script&quot;);j.id=i;j.src=&quot;https://widgets.getpocket.com/v1/j/btn.js?v=1&quot;;var w=d.getElementById(i);d.body.appendChild(j);}}(document,&quot;pocket-btn-js&quot;);&lt;/script&gt;</p>
<p>

プロパティなど分かる範囲

どうやらこのAタグの中で色々調整するっぽいです。

</p>
<p>		&lt;a data-pocket-label=&quot;pocket&quot; data-pocket-count=&quot;horizontal&quot; class=&quot;pocket-btn&quot; data-lang=&quot;en&quot; data-save-url=&quot;&lt;?php the_permalink();?&gt;&quot;&gt;&lt;/a&gt;<br />

該当記事を後で読む追加

このAタグのdata-save-urlのパラメータを該当記事にしてやれば、
その記事を後で読むに追加してくれるみたいですね。

This is the url that will be saved when the button is clicked. If the data-pocket-count attribute is set to show a counter, the counter will show the number of saves of the provided url.

getpocket.comより引用

だそうで。

表示をバルーンにしたい

data-pocket-countパラメータで後で読むに追加した数の表示方法を指定できます。
値はnone,horizontal,verticalです。
verticalにすればバルーンになって、horizontalならこのブログのようになります。

左寄せしたい

Webサイトの都合上このボタン左にしたいとか右にしたいとかあると思います。
そういう時たいてい、おらーってCSSごりごり書いたりするんですけど、これは大丈夫みたいですね。
data-pocket-alignプロパティがあるので。

設定できる値は
left,center,rightだと思います。
leftとrightだけ試しましたけど、centerやってません。
でも、このパターンならこれだと思います。

This property is really only useful when using a button with data-pocket-count set to horizontal. It sets how the button will align inside of the button’s iframe.

getpocket.comより引用

水平にこのSNSボタンがセットされた場合にこのプロパティは有効
で、このインラインフレーム内の左、真ん中、右が設定できるよ

みたいな事言ってると思います。多分。

それでは・・・
一覧記事にしかついてないので、アカウントある人誰かためしに押してみて下さい!ナンチッテー。

ではまたー。

参考はこっちらー

関連記事

  1. PHPサムネイル

コメントをお待ちしております