ブログカードでリンクを張ってみる

提供: とある社畜の頭脳整理
ナビゲーションに移動 検索に移動

本当はWordpressのプラグインで実現したかったのだけど…(存在はしています…)プラグインの競合がいやだったので、ブラウザにChrome使っていることだし、Chromeのアプリを使って実現してみました。なので…カテゴリ的には本来Wordpressではないのですが…やりたいことは「Wordpressにブログカードでリンクを張りたい」だったのでWordpressにカテゴライズしました。

Chromeの拡張機能を使っているので、基本的な使い方は…リンクしたいページで「Create Link」を使ってURLをコピーして…Wordpressの記事に貼り付ける感じです。

「Create Link」のインストール

GoogleのChromeのインストールが必須です…。インストールしていない人は…ほかの手段考えてください…

  1. GoogleChromeを起動する。
  2. ブックマークの一番左に(あるはずの)「アプリ」をクリックする。
  3. アプリの一覧から「ウェブストア」をクリックする。
  4. 左上の「ストアを検索」テキストボックスに「Create Link」と入力し、エンターキーを押す。
  5. 拡張機能の「Create Link」の右側の「+無料」ボタンをクリックする。
  6. 「新しい拡張機能の確認」ウインドウで「追加」ボタンをクリックする。
  7. Chromeの右上にアイコンが追加され、インストール完了

「Create Link」の設定

ブログカードで貼り付けられるようにするためには、設定する必要があります…

  1. Chromeの画面の右上にある「Create Link」のアイコンをクリックする。
  2. メニューから「Configure...」をクリックする。
  3. 「Formats」の表の下の「+」をクリックする。
  4. 「Name」の欄に適当な名前を入れる。(僕は「BlogCard」にしたよ)
  5. 「Format」に以下のソースを入力する。
    <iframe style="border:none;display:block;margin:0 0 1.7rem;overflow:hidden;height:155px;width:100%;max-width:100%;" title="%title%" src="http://hatenablog.com/embed?url=%url%"></iframe>
    
  6. 以上で設定完了。

使い方

前出で説明したとおり、URLを取得するときに「Create Link」を使って、リンクのソースを記事に貼り付けます。

  1. リンクを作成したいページを開く。
  2. 適当なところで右クリックして、「Create Link」→「前の手順で設定した名前(BlogCard)」をクリック。
  3. Wordpressで作成している記事に貼り付ける。(ブログカードのhtmlが貼り付けられる)
  4. 記事が書き終わったら公開する。

参考サイト

ちなみに…以下の「Create Link」を使って作成しました…。MediaWikiユーザも便利!

Chrome拡張機能「Create Link」を使ってブログカードを適用する方法 | でこにく
WordPressで「はてなブログカード」のような埋め込み機能作成 | セルティスラボ