Error, group does not exist! Check your syntax! (ID: 4)
みなさんは、「ブックマークレット」をご存じでしょうか?
「ブックマークレット」と似たような言葉に、「ブックマーク」があります。
「ブックマーク」はほとんどの人が理解していると思います。
お気に入りのページの「URL」を登録しておいて、
いつでもそのURLに飛べるようにしておくものですね。
この機能を応用したのが、「ブックマークレット」なんです。
ブックマークと違うのは「URL」を登録するのではなくて、
「プログラムコード」を登録しておきます。
それで、いつでもこのプログラムが簡単に呼び出せるようになります。
このブックマークレット、探してみると
ブログを書く時、アフィリエイト・コードを生成する時など、
便利なものがたくさんみつかります。
本レポートは、そんなブックマークレットをまとめてみました。
1 ブックマークレットとは?
ブックマークレットという言葉を目にしたことがあるでしょうか。
好きなウェブページを「お気に入り」として保存して、
いつでも飛べるようにする「ブックマーク」と言葉が似ていますね。
それもそのはず、ザックリ言うと、
ブックマークレットはブックマークの友達みたいなものだからです。
さて、どんな友達か。 彼はなかなか賢いヤツです。
ブックマークの役割が「好きなウェブページにジャンプできる」だとしたら、
ブックマークレットは「好きなウェブページでちょっと便利な機能が使える」になります。
例えば、
YouTubeの動画をリピート再生する、見ているページの短縮URLを表示するなどです。
では、ブックマークレットは、どんな仕組みのものなのでしょうか?
上の画像は、Facebookのブックマークを編集しようとしているところです。
ブックマークを右クリックして「プロパティ」や「編集」というボタンを押せば、
同じような画面が開くはずです。
「URL」欄にはウェブページのアドレスが入っています。
一方、こちらの画面はブックマークレットの編集画面。
「URL」欄が大きく違いますね。
先頭に「javascript:...」と書いてある通り、
ブックマークレットは「JavaScript」というプログラミング言語でできた簡単なプログラムなのです。
ここが大きな違い。
このプログラムが動くことによって、「ちょっと便利な機能」たちが使えるわけです。
とは言え、難しいことは考えなくてダイジョウブ。
使う側にとっては、クリックしてウェブページへ飛ぶか、プログラムを動かすかの違いだけです。
プログラムといっても、何か危ないものではありませんし、
PCに負担をかけるようなものでもありません。
2 ブックマークレットの登録と使い方
ここでは、実際にブックマークレットを登録して利用するまでを説明していきます。
ブックマークレットには色々な機能があるので、
ブックマークバーに追加する時にそれぞれ設定が必要なものもあります。
まずは、ブックマークレットをツールバー(ブックマークバー)に
追加していつでも使えるようにするというところから。
基本的には、ブックマークバーにブックマークレットをドラッグするだけです。
「はてなブックマーク」の「はてなブックマークレット」登録を例として示します。
「はてなブックマークレット」は、ブラウザのツールバーなどから手軽に、
閲覧中のページをはてなブックマークに追加することができるものです。
ちなみに、「はてなブックマークレット」を利用するには、
「はてなブックマーク」にユーザー登録されていなければなりません。
「はてなブックマーク」のトップページは、こちらになります。
また、ブックマークバーが、ブラウザに表示されていないという場合があります。
その場合は、4 ブックマークバーを表示させる方法を参考にしてください。
はてなブックマークレットのページはこちら↓
このページを下の方にスクロールしていくと
「ブックマークレットのセットアップ」という項目があります。
その部分の「ブックマークする」というリンクボタンを
ブックマークバーにドラッグします。
ブックマークバーに追加できたら、完了です。
あとは好きなページでこのボタンをクリックすると、
開いているページをブックマークすることができます。
3 便利なブックマークレットをいくつか紹介します。
ウェブ上には、たくさんのブックマークレットが配布されています。
ここでは、ブログの記事書きやアフィリエイトに役立ちそうなブックレットを紹介します。
(1)アフィリエイトに便利なブックマークレット
◆ カエレバ
Amazonや楽天で商品ページを開いておいて
1クリックでアフィリエイトリンクを作成できるものです。
アフィリエイトリンクのコードが1クリックで生成されるので、
あとはこれをブログにコピペするだけです。
◆ リンクシェア・ブックマークレット
好きな参加企業のウェブサイトを見ながらクリックするだけで、
いつでも簡単にアフィリエイトリンクが作成できます。
◆ Amazonアソシエイト・リンク作成用
Amazonの商品ページから、商品のアマゾン・アソシエイトリンクを簡単に作れます。
◆ ShareHtml
自分のブログの過去記事や他の人の記事を紹介するときに
便利なブックマークレットです。
紹介したいページを開いて、1クリックで紹介用のリンクが完成します。
ShareHtml
使い方は、次に示すページをご参照ください。
ShareHtmlの設定と使い方
ShareHtmlをカスタマイズする方法
◆ HTMLのタグチェック
HTMLのタグの閉め忘れやミスを指摘してくれるブックマークレットです。
チェックしたいページでこのブックマークレットを起動させると、こんな感じでミスを指摘してくれます。
ちょっとしたミスでレイアウトが崩れたり、HTMLの構造にミスがないかをチェックできます。
具体的には次の事ができます。
- タグの閉じ忘れを検索する
- 開きタグがない閉じタグを検索する
- 親より先に閉じちゃってる子がないか検索する
- タグ対応エラーの一覧と、ソースコード中のハイライト表示
- タグのミスをチェックして、そのページのソースコードと一緒に表示してくれる。
ミスのあるソースコードは、ハイライトされて探しやすいようにしてあるので非常に便利です。
◆ RWD Bookmarklet
レスポンシブデザインのサイトやブログで、
「タブレット」や「スマートフォン」の見た目を簡単にチェックできる
ブックマークレットです。
◆ Bookmarklet Combiner
ブックマークレットで便利だけど、
ブックマークバーをどんどん占領していくよねって人に、
おすすめなのが「Bookmarklet Combiner」というブックマークレットです。
複数のブックマークレットを1つにまとめてくれます。
起動させると画面上に登録したブックマークレットの一覧が出現するので、
使いたいものを選択するようになっています。
詳しい設定等は、下に示す記事をご参照ください。
複数のブックマークレットを1つにまとめるブックマークレット【Bookmarklet Combiner】
◆ SEOチェキのブックマークレット
ブログの評価、SEO対策に非常に便利なSEOチェキのブックマークレットです。
詳しくは、下に示す記事をご参照ください。
サイトの評価をチェック!SEOツール【SEOチェキ】のブックマークレット
(2)ウェブページの閲覧が捗るブックマークレット
◆ Scrible
ウェブページにハイライトを引いたりコメントつけたりした後、
ファイルに書きだしてオフラインに保存することもできるブックマークレットです。
◆ Google Personalized Off
Googleアカウントでログインした状態でGoogle検索をした際、
よく見ているページなどを検索上位に掲げる「パーソナライズ検索」。
しかし、ブログやウェブメディア、あるいはECサイトを運営している方なら、
自分のページが検索で「本当は何番目に表示されるか」は気になるところです。
このブックマークレットを使えば、アカウントからログアウトすることなく、
パーソナライズ検索を無効にできます。
(3)YouTubeがもっと楽しく&使いやすくなるブックマークレット
◆ YouTubeRepeat
通常はリピート再生できないYouTube動画を、リピート再生するための
ブックマークレットです。
再生したい動画のページでクリックすると、
リピート再生サービス「YouTube Repeat」で動画を開きます。
◆ Songdrop
Songdropは、
YouTubeやSoundCloudなどに点在するウェブ上の音楽を一括整理できるサービスです。
ブックマークレット経由で音楽をどんどん登録すれば、
まとめて「Songdrop」のサイト上で楽しめます。
◆ Wadsworth Constant
ほとんどのYouTube動画は最初の30%をスキップしても
問題ないという説に基づいて作られたブックマークレットです。
動画ページで使うと、全体の1/3まで飛ばします。
◆ 動画ダウンロード用リンク追加処理
YouTubeの動画ページで起動すると、通常はない「ダウンロード」ボタンが出現します。
いくつかのファイル形式から選んで動画をダウンロードすることができます。
(4)TwitterなどのSNSで使えるブックマークレット
◆ ソーシャルてんこ盛り1.3
SNSへ投稿するボタンがないようなページでも、
TwitterやFacebook、はてなブックマークなど、任意のSNSへリンクをつけて投稿できます。
◆ Twitter のハッシュタグ挿入ブックマークレット
Twitter公式サイトや「HootSuite」「ついっぷる」などのブラウザ上で
動作するクライアントで使えるブックマークレット。
あらかじめハッシュタグを上記のサイトで登録し、ブックマークレット化しておきます。
あとは、ツイートの入力ボックスを選択した状態で起動させれば、
設定したハッシュタグが挿入できます。
◆ p.tlブックマークレット
イラスト投稿サイトのpixivが提供しているURL短縮サービスのブックマークレット。
好きなページで使うと、小さなウィンドウが開き、タイトルと共に短縮URLを表示してくれます。
特に文字数制限のあるSNSで投稿したい時に使えます。
URLをそのまま貼り付けると長すぎて収まりが悪い…という時にも。
◆ Encipher.it
圧縮ファイルであればパスワードを設定できますが、
Encipher.itは「文章そのもの」にパスワードをかけられます。
ウェブメールの作成画面などに暗号化したいテキストを入力し、ブックマークレットを起動。
パスワード入力画面が表れます。
設定すると、テキストが暗号化されます。
暗号化を解除するには、再度ブックマークレットを起動し、パスワードを入力すればOK。
暗号化したテキストをやり取りするときは、
双方がEncipher.itを使えなくてはならないのがややネックですが、
TwitterのDMやFacebookメッセージで
重要情報をやり取りするような際にも使える手段かと。
4 ブックマークバーを表示させる方法
色々なブラウザで
ブックマークバーの表示/非表示させる方法が異なっているので、整理しておきます。
GoogleChrome、Firefox、Internet Explorerでのブックマークバーの表示方法を示します。
(1)Google Chromeでブックマークバーを表示させる
GoogleChromeでブックマークバーが表示されていない場合は、
図4-1に示すように、
アドレスバーの右端にある赤枠で囲ったツールアイコンをクリックして、
表示されるメニューから順次下に示す項目を選択します。
「ブックマーク」⇒「ブックマークバーを表示」
「ブックマークバーを表示」にチェックを入れることで、
ブックマークバーを表示することができます。
※ クリックすると、図が拡大します
(2)Firefoxでブックマークバーを表示させる
まず、図4-2に示すように、
画面の右上にある赤枠で囲ったツールアイコンをクリック、
表示されるメニューから「カスタマイズ」を選択します。
カスタマイズの画面になるので、
画面下の「ツールバーを表示/隠す」という項目をクリックして、
「ブックマークツールバー」にチェックを入れます。
チェックを入れたら右の「カスタマイズを終了」をクリックして完了します。
(3)Internet Explorerでブックマークバーを表示させる
まず、Internet Explorerを起動し、
「新しいタブ」の右側の何も表示されていない箇所を右クリックします。
※ クリックすると、図が拡大します。
右クリックするとメニューが出てくるので表示された一覧から、
「お気に入りバー」をクリック。
これでブックマークバーが表示されるようになります。
以上
Error, group does not exist! Check your syntax! (ID: 3)