ShareHtmlメーカーのブックマークレットで記事紹介すると、ブログ画像・題名・コメント・はてブ数付きのリンクが簡単に出来てとても便利！！

↓のように作成するには下準備として「ShareHtmlメーカー」でブックマークレットを作成する必要があります。ブックマークレットを一度作ってしまえば簡単に見栄え良くブログ画像、題名、コメント、はてブ数付きのリンク記事紹介ができます。私はShareHtmlメーカーを利用すれば良いことまでは分かったのですが、そこからどのようにして使うのかでつまづきました。が、やっと使い方が分りました。分かれば簡単なのでブログ記事紹介する時に是非利用してみてください。

ShareHtmlとFocusHtmlもリニューアルしました♪ | 普通のサラリーマンのiPhone日記

ShareHtml製作者。ブログ更新にお世話になっておりますm(__)m

ShareHtmlメーカーでブックマークレットを作成する方法
ShareHtmlメーカーで記事を紹介する方法

１．ShareHtmlメーカーでブックマークレットを作成する方法

ShareHtmlメーカーは普通のサラリーマンのiPhone日記のブログ作成者さんが作ったブックマークレットです。まずは「ShareHtmlメーカー」を開いてみてください。（共有ドロップボックスで下記サイトがでます）

ShareHtmlメーカー

１．Bookmarklet名を入力して下さい

ブックマークの名前を登録することができます。私はテンプレートごとに名前を変更して分かりやすくしています。
まずは「ShareHtml左大」で登録してみましょう。

２．選択テキストの最大文字数を入力して下さい

紹介文の最大文字数を決めることができます。
私は既存の100文字のままです。

３．選択テキストを囲むHTMLタグを入力して下さい（任意）

初心者の私にはまだ手をつけられません。

４．コメントを囲むHTMLタグを入力して下さい（任意）

初心者の私にはまだ手をつけられません。

５．出力方法を選択して下さい

私は「プレビュー表示」を選択しています。

６．書式テンプレートを選択して下さい

書式テンプレート

書式テンプレートは以下のようになります。

LeverageNote: bloggerの「バックアップ/復元」に助かりました。HTML編集前は必ず必要なのでバックアップ/復元の方法を紹介します。

書式テンプレート「左サムネイル大ーalignleft」

LeverageNote: 祝儀袋の選び方・書き方・包み方、中袋の書き方は大人のマナーとして最低限必要なのでまとめてみました！

書式テンプレート「左サムネイル小ーalignleft」

LeverageNote: bloggerの「Google＋バッジ」ガジェットを使ってコミュニティをブログへ貼り付けてみると見栄えが良くて気に入りました！！

書式テンプレート「左サムネイル大ーtable」

LeverageNote: 【持ち物リスト】ハーフマラソン

書式テンプレート「右サムネイル大ーtable」

LeverageNote: 2013年7月21日【大阪国際トライアスロン舞洲大会】リザルト　スプリント・ディスタンスは初心者向き！！

書式テンプレート「サムネイル無し」

HTML初心者の方はまずは書式テンプレートのままでも良いと思います。私のブログには「左サムネイル大」のテンプレートをよく利用しています。

７．以下を直接カスタマイズすることもできます

書式テンプレートHTML

書式テンプレートを選択するとHTMLが表示されます。

８．Bookmarkletを生成する

「Bookmarkletを生成する」ボタンをクリックすると
下に『個人向けBookmarklet』が現れます

全てが完了したら「Bookmarkletを生成する」ボタンをクリックします。
すると９番以降が下に現れます。
※始めはここで迷いました。何がどうなっているのか分からなかったです。初心者の方は迷わずそのんまま9番へ進んで下さい。

９．デモおよびPC登録用

「ShareHtml]をブックマークに登録して下さい。ドラッグ＆ドロップで登録できます。
※１．でBookmarklet名を「ShareHtml左大」と名前を登録している時は「ShareHtml左大」と名前が変更されています。

１０．iPhone登録用

iPhone登録用です。私はPCでブログ更新をしているので登録していません。すみませんがこちらを知りたい場合はググって下さい。

１１．登録後に動かない場合、登録内容を編集して以下を上書きして下さい！！

今回はテンプレートをそのまま利用するのでHtmlはいじらずに登録します。また「Chromeで登録すると動かないんです。」とありますが問題なくうごくので大丈夫です。

２．ShareHtmlメーカーで記事を紹介する方法

ブックマークレットが登録できたら次はお気に入りのブログを自分のブログ記事に紹介してみましょう。

コメント欄記入

Chromeでのコメント欄

Safariでのコメント欄

紹介したいHP（サイト・ブログ）を開いてブックマークをタップします。ここでは「ShareHtml左大」のブックマークをタップします。すると上図のようなポップアップ画面がでます。ここに紹介コメントを100文字入力します。（２．で最大文字数を100と設定しました）コメント入力後に「OK」をタップします。

HTMLをコピー

開いていたHP上段にニョキッと「HTML」と「プレビュー」が表示されます。
下の赤枠はプレビュー画面が表示されています。上の赤枠にHTMLが書き込まれています。

上の赤枠の上に左から「プレビュー表示を消す」「HTMLを選択する」「HTMLの内容でプレビューを書き直す」と書かれています。「HTMLを選択する」をタップして全選択でコピーします。