TOP

Chromeプラグイン「Create Link」で、画面キャプチャとはてぶ数のHTMLリンクを２アクションで作成する方法

昨日の記事で紹介したChromeプラグイン「Create Link」の、
より便利な小技を紹介します

HTMLタグを出力する時のフォーマットをカスタマイズできることに注目。

以下の書式をフォーマットに指定することで、画面キャプチャと
はてぶ数をHTMLタグに出力します。

オプションの設定

　前回同様、Create Linkの設定画面から「＋」ボタンを押して
　新しい定義を追加します。

　名前は適当に。今回は”HTML２”にしました。

　

　フォーマット定義は以下のとおりに記述します。（ちと長いですが）

　

&lt;table width=&quot;100%&quot;&gt;
	&lt;td class=&quot;httplinkimg&quot; width=&quot;150&quot;&gt;
		&lt;a href=&quot;%url%&quot; target=&quot;_blank&quot;&gt;
			&lt;img border=&quot;0&quot; src=&quot;http://capture.heartrails.com/150x130/shadow?%url%&quot; width=&quot;150&quot; height=&quot;130&quot; /&gt;
		&lt;/a&gt;
	&lt;/td&gt;
	&lt;td class=&quot;httplinkimg&quot;&gt;
		&lt;a href=&quot;%url%&quot; target=&quot;_blank&quot;&gt;&lt;u&gt;%title%&lt;/u&gt;&lt;/a&gt;
		&lt;a href=&quot;http://b.hatena.ne.jp/entry/%url%&quot; target=&quot;_blank&quot;&gt;
			&lt;img border=&quot;0&quot; src=&quot;http://b.hatena.ne.jp/entry/image/large/%url%&quot; /&gt;
		&lt;/a&gt;
	&lt;/td&gt;
&lt;/table&gt;

1

2

3

4

5

6

7

8

9

10

11

12

13

<table width="100%">

<td class="httplinkimg" width="150">

<a href="%url%" target="_blank">

<img border="0" src="http://capture.heartrails.com/150x130/shadow?%url%" width="150" height="130" />

</a>

</td>

<td class="httplinkimg">

<a href="%url%" target="_blank"><u>%title%</u></a>

<a href="http://b.hatena.ne.jp/entry/%url%" target="_blank">

<img border="0" src="http://b.hatena.ne.jp/entry/image/large/%url%" />

</a>

</td>

</table>

　定義を追加したら、いったんChromeを閉じて定義を反映させます。

使いかた

　Chromeを起動します。

　画面上で右クリックすると、先ほど追加したHTML２という
　定義が表示されます。

　

　これをクリックすると、HTMLタグがクリップボードにコピー
　されます。

　あとは、ブログのHTML編集画面などでペーストします。

　実際にWEBブラウザで表示させると、、、↓↓↓

　

HTMLリンクとタイトルを簡単にコピペするGoogle Chromeプラグイン

　
　画面キャプチャとはてぶ数がセットでHTMLリンクが表示されました！！。

　画面サイズなど見た目の細かいカスタマイズは、フォーマット定義を
　修正してください。

　ただ単にリンクを表示するより、見た目にもわかりやすい
　小技を紹介しました。

　自由度が高いプラグインは、いろいろカスタマイズできるから好き♪。

　(‘A`)ヴァー

いつもブログを見ていただきありがとうございます。よろしければシェアお願いします(o^-^)↓↓↓

Tweet

開発
公開日：2012/02/14
最終更新日：2013/08/06

おすすめの商品

ANKER Astro M3 モバイルバッテリー 13000mAh 大容量かつコンパクト 147 x 62 x 22mm ハイパワー電源アダプタ付属モデル 2USBポート同時充電 iPhone5 / 4S / iPad / Galaxy / Xperia / Android / 各種スマホ / Wi-Fiルータ等対応(日本語説明書付) Astro M3+adapter

ANKERのモバイルバッテリー「Astro M3」を購入。発売当初は13000mAhの大容量

レビューを読む

ANKER Astro3 第2世代高性能大容量モバイルバッテリー 12000mAh 3USBポート同時充電 iPhone5 / iPhone4S / iPad / iPod / Android / 各種スマホ / Wi-Fiルータ等対応(日本語説明書付き) Astro3 (2gen)

ANKERのモバイルバッテリー「Astro 3」を購入しました。以前のブログ記事USBポート

レビューを読む

【日本正規代理店品】JayBird BlueBuds X Bluetooth ヘッドフォン (ミッドナイトブラック) JBD-EP-000002

今年の6月に購入したBluetoothヘッドフォンのJayBird BlueBuds X。

レビューを読む

関連記事

WordPressのテーマ自作に挑戦その1

WordPressのテーマ自作に挑戦中。このブログはレンタルサーバー＆WordPressで作

記事を読む

リニューアル完了！WordPressのテーマ自作に挑戦その3

ブログのデザインをリニューアルしました。サイドバーへのプロフィール追加など、まだまだ

記事を読む

Dashcodeフリーズ再び、最新版を直接ダウンロードしよう

「Xcodeバージョンアップ後にDashcodeがフリーズ」するという事象。以前、記

記事を読む

iPhoneで作りたいアプリの構想を練ってみる

自分が作りたいiPhoneアプリのアイデアの取りまとめ。最初から凝ったものを作ろうと

記事を読む

WordPressプラグインSyntaxHighlighter Evolvedを導入

HTMLなどのコードを簡単に記事に埋め込んでくれるWordPressプラグインを導入しま

記事を読む

Message コメントをキャンセル

PREV : HTMLリンクとタイトルを簡単にコピペするGoogle Chromeプラグイン
NEXT : アプリクリエイター道場（４回目）に参加しました

NEW ENTRY

: プライバシーポリシー
プライバシーポリシー mastajim, Inc.（以下，「当社」と

: LumsingのBluetoothスピーカーを使ってみた
Amazon等でデジタルガジェットを販売しているLumsingさんから

: 10400mAhの大容量モバイルバッテリーLumsing Power Bankが今なら2,490円！
Amazon等でデジタルガジェットを販売しているLumsingさんから

: iPhone 5s純正レザーケース2ヶ月後の風合い
iPhone 5/5s用の純正レザーケースを購入後、早2ヶ月が経過。

: 支払い期日は12月5日(木)。東京マラソン2014の2次抽選に当選！
東京マラソン2014の2次抽選結果メールが到着東京マラ

→もっと見る

こんな人が記事を書いています。

　デジガジェ大好きなengineer 
　物欲に生かされる日々。
　iPhone、iPad、iMac、MBA
　使いのApple信者。
　詳しい自己紹介はこちら

カテゴリー
カテゴリー

タグ
Amazon anker astro3 Apple blog camera dPub emobile GL01P GL04P iMac iPad iPad mini iPhone iphone5 iPhone5s JayBird BlueBuds X kinoppy MacBook Macbook Pro MarsEdit PMP retina running SEO speck TSUTAYA wiiu wordpress イーモバイルケースジョギングスターバックスソフトバンクニュースビブラムフォアフットマラソンモバイルバッテリーランニングラーメン任天堂名刺朝礼ネタ東京マラソン電子書籍

人気記事

Tweet