wordpress 「ブログカード」をEmbedlyで作る方法メモ

ブログカードをwordpressの投稿にかっこよく表示させる

正式名称を知らないので便宜上「ブログカード」と書きます。

私もつい昨日ぐらいに知ったんですけどね。

「こっちのページを参考にして下さいね」ってリンクがかっこいいカード型になってるのを「ブログカード」と呼ぶみたいです。

文字にリンク設定するより、なんかかっちょいいです。

比べてみると普通のリンクが古くさくてかっこ悪く感じてしまいます。

私もかっこいいのやってみたい！！と思い立ちなんとかできたので、やってみた事を順番に説明します。

Ｅｍｂｅｄｌｙというサービスで簡単にブログカードが作れます。

自分でスクリプトを作る方法もあるようですがわたしには敷居が高いので今はやめておきます。

さて、まずは上記リンクからEmbedlyのサイトへ行って、ブックマークレットをブックマークに登録します。
ブックマークの登録のしかたは、下の①をブックマークバーにドラッグ＆ドロップするだけでOK。

または、①を右クリックで「リンクアドレスをコピー」して、ブックマークに登録してもいいです。

ブックマークレットを登録したら準備は完了です。ブックマークしたいページでブックマーク【+Embed 】をクリックします。

今回はworepressのページ。

ブックマークバーに登録していない場合は、ページを表示した状態でブックマークをクリックします。

すると、こんな画面が出てきます。

①サイトの画像

②投稿のタイトル

それぞれクリックすると縮小したり、表示を消したりできます。

投稿本文もクリックして本文を削除や短くしたりなどの編集が可能です。

編集をしたらソースをコピーして投稿に貼り付ければ完了です。

ちょっと満足。ちょっと不満。

投稿との境が分かりづらいので枠をつけてみたいと思います。

自分の記事との境目がわかりずらいのでブログカードを浮き立たせるようにします。

囲みのCSSコードにEmbedlyのコードをはさむと下のような状態になります。

Embedlyブックマークレットの使い方とカスタマイズ方法 | きょうものびてます。

こちらの記事のソースコードを使わせていただきました。

コードを「AddQuicktag」というプラグインに登録しておくと投稿画面で挿入できるので便利です。