ShareHtmlメーカーやっとわかった!!ブックマークレット

ShareHtmlメーカーやっとわかった!!ブックマークレット

ここ最近、
インターネット自体をする機会がめっきり減ってしまって…。
（というか、正確に表現するとネットとPCを使って何かを作成するということがめっきり減って）

数年前にブックマークレット（Bookmarklet）自体の存在は知っていて、
使ったこともあったのに…。

ブックマークレット - Wikipedia
ブックマークレット (Bookmarklet) とは、ユーザーがウェブブラウザのブックマークなどから起動し、ウェブブラウザで簡単な処理を行う簡易的なプログラムのことである[注釈 1]。携帯電話のウェブ ...

ブログ等でよく目にする綺麗なリンク先紹介。

こんな感じのもの
↓
Windowsカスタマイズ!!徒然なるままに…。エココラムなど備忘録

これは、
以下サイトのShareHtmlメーカーにて作成したものです。
ShareHtmlとFocusHtmlもリニューアルしました♪ | 普通のサラリーマンのiPhone日記

以前から、
知ってはいたのですが使い方がよく分からず(;´д｀)ﾄﾎﾎ…、
ブックマークレットを作成しては、クリックしてみたら
「inputmemo」とか表示されてしまうのでサイトを消してしまっていて…。

ほんとトホホな状態でした。

最近ブラウザにSleipnirを再使用し始めたのですが、
（Bloggerブログの表示をIEの場合とそうでない場合の表示を確認する為）
Sleipnirだとマウスジェスチャー機能が働いてしまい、
ブックマークバーにドラッグ・アンド・ドロップで追加ができなかった。

折角以下画面にて作成したブックマークレットを無駄に？してしまっていました。


なんてもったいない。

ですが、
右クリックでお気に入りに追加をして
やっと？？普通にブックマークバーに登録でき、
リンクしたいサイトを開いたままでブックマークバーの
ブックマークレット（ShareHtmlメーカー）をクリックでスクリプトが動き、
しっかりとタグを吹き出してくれました。

ちなみに、
勢いでプレビュー表示版とポップアップのみ版の2つ作成してしまった。

Chromeだと動かないと記載はあったものの、一応Sleipnirだし…。
などと高をくくっていたのがそもそもの原因。

Sleipnirにても動作しましたし、IEにても動作しました。
しかし、
Sleipnirだと時々タグを吐き出してはくれるのですがSleipnir自体が固まってしまう場合がある。

現在も、その為IEにて途中から投稿している。

参考にさせて頂いたサイトを早速勢いで作ったブックマークレット：ShareHtmlでリンク作りまくりの貼りまくりしたっかが、
Sleipnirにて表示されている参考にさせて頂いたサイトが機能していない為ちょっと無理状態。

o(´^｀)o ｳｰ

とりあえず、ShareHtmlメーカーの直リンクを作成。

ShareHtmlメーカー
ShareHtmlメーカー

こんな感じ。

忘れないように、
導入方法と使い方をメモしておく。

『作成方法』

まずは、作成先に行く。
↓
ShareHtmlメーカー

上記作成時に、
inputmemoに記述したらブックマークレット作成時のHTMLの欄コメント欄に<strong>タグがあったので、強調されてしまった（汗）。

まぁ、
さて置き
以下の画面の様に１～２の選択できる所を選択していきます。

ポップアップのみの場合のキャプチャーです。




『導入方法』

そして、
３をクリックにて、下部にブックマークレットが作成されます。
下の方に移動していくと下部画像の様になっています。




そしたら、
普通に(^^)(^^ゞブックマークバーにドラッグ・アンド・ドロップでブックマークバーに登録。

以上。
導入編。

『使い方』

リンクを作成したいサイトを表示したまま、ブラウザ上部のブックマークバーに登録した、
ブックマークレット（ShareHtml）をクリック。



すると、inputmemoがポップアップされます。
ここは、
なにも記入してもしなくても綺麗にリンク先がサムネイル画像付きで作成されます。




そのまま、「OK」押下。
すると、タグが吐き出されます。




そのリンクタグをコピーして、
ブログ等の投稿画面にて、HTMLの貼り付けをすれば完成。

とても簡単に紹介先サイトのリンクが作成できる優れもの！！

ちなみに、
ShareHtmlメーカーの直リンクを作成した際、
inputmemoで「ShareHtmlメーカー」と記入したので、
強調表示になっていますが、

ShareHtmlメーカー
ShareHtmlメーカー ...

サイトの中の記事を選択したままブックマークレットをクリックすると、
選択した記事部分がタイトルの下に上記の様に綺麗に表示されます。

こっちの方が通常の場合であれば綺麗かもしれません。

と言った感じで作成から導入、使い方でした。

＜参考サイト＞
これは常備品レベル！リンク紹介に便利なブックマークレット『ShareHtml』 - Sunabox
ブログのデザインを変えたり、色々したりする際、けっこう参考にさせて頂くサイトを貼ることが多くなってきて、文字だけっていうのも味気ないかな？・・・と思っていたところに、良さそうなブックマークレットを作っ ...

FocusHtml NEOがすごい！Twitterアイコンまで加えた全部のせリンクを作るブックマークレットをご紹介！ - Sunabox
どこをどう巡って辿り着いたのかを忘れてしまったのですが、こんなブックマークレットを使って、なんとも素敵なリンク紹介をされているサイトを見て、自分でも使ってみることにしました！ ...

平均PVを上げるために「ShareHTML」でリンクタグを作成する際に加えている一工夫 | OZPAの表4

神ブックマークレット ShareHtml , AppHtml の導入＆使用方法（作者 @hiro45jp さん） | なまら春友流
質問内容わかりやすいです！これは、ShareHtmlのことですね！！ 教えましょう教えましょう！ いや、むしろ教えさせてください！（笑） ...

意外!?とすんごく簡単ですんごく便利なツールです。

これからは、ずっとお世話になっていこう。

みなさんもリンク先作成時に使ってみてはいかがでしょう(^^ゞ