ワンクリックで綺麗なブログカードリンクを作成する方法(ChromeのCreate Link拡張使用)

昨日、Wordpress内部リンクをブログカード化するカスタマイズ方法を書きました。

URLを記入するだけ!Wordpressに内部ブログカードを実装するカスタマイズ方法
9月にはてなブログがリリースしたブログカード、かっこいいですよね。

で前回、外部リンクもブログカード化出来るようにFirefoxアドオンのMake Linkを利用した方法を書きました。

ワンクリックで綺麗なブログカードリンクを作成する方法(FirefoxのMake Linkアドオン使用)
昨日、Wordpressの投稿エディターにURLを貼り付ければ、はてな風のブログカードが自動的に表示される方法を紹介しました。 ...

今回は、外部リンクをブログカード化するのにChromeのCreate Link拡張を利用した方法を紹介します。

photo by Shannon Hauser

スポンサーリンク
レクタングル(大)広告

外部リンク紹介ブログカード

今回、Create Linkを利用して作成するブログカードのデザインは以下のようになります。

Make Linkアドオンを使用した方法と違って、Create Linkの場合、ページのメタディスクリプション(ページの概要文)を取得できる機能がありません。

ですので、ページの概要文は、xxxxxxxxxxの部分に、自前で記入する必要があります。概要文が不要の場合は、xxxxxxxxxx削除してしまってもOKです。

サムネイルが右のバージョンも作成しました。

もちろん、外部リンクだけではなく、内部リンク紹介用に使用してもOKです。(※ページ概要は、手動で入力)

12436288584_94d6bc46d2_b.jpg
AndroidエミュレーターのBlueStacksを利用した、Windows PCでAmazon Kindleアプリを利用する方法です。

極端に幅の狭いデバイスない限り、レスポンシブにも対応しています。

Create Linkでブログカードの作成を方法

では、上記のようなページ紹介用のブログカードをChrome拡張のCreate Linkで作成する方法を紹介します。

主な手順は以下の3手順です。

  1. Create Linkのインストール
  2. Create Linkの設定
  3. Create Linkで目当てのページのリンクを作成

Create Linkのインストール

まずは、ChromeにCreate Link拡張をインストールします。

Chromeで、Create Linkを開いてインストールを行ってください。

ChromeにCreate Linkのインストール

Create Linkの設定

Create Linkの設定は、Chromeのツールバーにある「Create Linkボタン」をクリックし、「Configure」を選択することで行えます。

Create Linkの設定

「Configure」を選択すると「Options – Create Link」画面が表示されます。

Create Linkに新しく設定を追加するには、テーブルの下の方にある「+」ボタンをクリックします。

Create Linkに新しく設定を追加

そして、以下の入力項目に次のように入力します。

ブログカード(左サムネイル)の追加

  • Name:任意の名前
  • Format:リンク作成用のコード

リンク作成用のコードは以下です。

ブログカード(左サムネイル)のコード

ブログカード(右サムネイル)のコード

入力し終わると、こんな感じになります。

ブログカード(右サムネイル)も追加

その他Create Linkの設定例

その他のCreate Linkの設定は以下に詳しく載っています。

ブログ記事の作成支援Chrome拡張「Create Link」の設定例まとめ
ブログ記事の作成を支援するのにタグ作成ツールの存在は欠かせません。 使用しているブラウザがGoogle Chromeなら、今のところ最...

Create Linkからブログカードリンクの作成

あとは、Chromeで紹介したいページに移動します。

ページを移動したら、ツールバーをクリックして目当てのメニューを選択し、リンクを作成します。

ChromeのCreate Linkでリンク作成

作成したブログカードリンクは、以下のようになります。(※概要文は、メタディスクリプションをコピペ)

12436288584_94d6bc46d2_b.jpg
ぱくたそ/PAKUTASOは、4963枚の写真素材を無料(フリー)で配布しています。会員登録なしで簡単ダウンロード可能、すべてレタッチ済みの高品質/高解像度です。ネタ系の素材もご用意しています。

以前、僕が使用していた方法で同様にリンクを作成すると以下のようになるので、多少見た目は良くなったかと思います。

写真素材・商用無料(フリー)ぱくたそ/PAKUTASO

ぱくたそ/PAKUTASOは、4963枚の写真素材を無料(フリー)で配布しています。会員登録なしで簡単ダウンロード可能、すべてレタッチ済みの高品質/高解像度です。ネタ系の素材もご用意しています

まとめ

僕は、用途に応じてFirefoxとChrome両方のブラウザを使用しています。

ですので、Firefoxを利用してリンクを作成する方法と、今回の方法で、どちらのブラウザでも、ある程度手軽にブログカードリンクを作成できるようになりました。

今後は、この新しく作成したブログカードリンクで、いろいろなサービスや記事を紹介できればと思います。