rcmdnk's blog

ブログに設置してあったお気に入りに登録の ボタンをなにげに押してみたら上手く動かなくなってました。

確かに前は動いたはずなのに。。。

Sponsored Links

設置してあったボタン

設置してあったボタンはこんな感じ。

javascript部分が

source/javascripts/utils.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
jQuery(function () {
  $(".add_bookmark").click(function () {
  if ( ! $(this).data('page_title') || ! $(this).data('page_url') ){
    return addBookmark(document.title, location.href)
  }else{
    return addBookmark($(this).data('page_title'), $(this).data('page_url'))
  }
  });

  function addBookmark(title, url) {
    var metaKey = (navigator.appVersion.indexOf('Mac') != -1) ? 'CMD' : 'CTRL';
    if(navigator.userAgent.indexOf("MSIE") > -1){
      //Internet Explorer
      window.external.AddFavorite(title,url);
    }else if(navigator.userAgent.indexOf("Firefox") > -1){
      //Firefox
      alert("サイドバーではなく、通常のブックマークにする場合、\n\"このブックマークはサイドバーに読み込む\"のチェックを外して下さい。");
      window.sidebar.addPanel(title,url,'');
    }else if(navigator.userAgent.indexOf("Opera") > -1){
      //Opera
      window.open(url,'sidebar','title='+title);
    }else if(navigator.userAgent.indexOf("Flock") > -1){
      //Flock
      window.sidebar.addPanel(title,url,'');
    }else if(navigator.userAgent.indexOf("Chrome") > -1){
      //Chrome
      alert("Push "+metaKey+"-D to add favorite!");
    }else if(navigator.userAgent.indexOf("Safari") > -1){
      //Safari
      alert("Push "+metaKey+"-D to add favorite!");
    }else if(navigator.userAgent.indexOf("Lunascape") > -1){
      //Lunascape
      alert("Push "+metaKey+"-G to add favorite!");
    }else{
      //other
      alert("Please use the browser's bookmark function!");
    }
  }
});

こんな感じ。ブラウザチェックして適当な関数を呼ぶように。 小さなjavascriptの関数とかは source/javascripts/utils.jsに書いて source/_include/custom/head.html等に

<script src="/javascripts/utils.js"></script>

として読み込んでます。

ボタンはsass内でcustom/_styles.css等に

sass/custom/_styles.scss
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
.link_btn {
  background-color:$nav-bg;
  padding:2px;
  padding-left:5px;
  padding-right:5px;
  position:relative;
  text-decoration:none;
  //color:$nav-bg;
  border: solid 2px darken($nav-bg, 15);
  border-radius: 10px;
}

.link_btn:active {
  padding-bottom:1px;
  padding-left:5px;
  padding-right:5px;
  padding-top:3px;
  top:1px;
}

.link_btn::before {
  background-color:$nav-bg;
  content:"";
  display:block;
  position:absolute;
  width:100%;
  height:100%;
  padding:1px;
  left:-1px;
  top:-1px;
  z-index:-1;
  border-radius: 10px;
}

li.bookmark {
    width: 130px;
    height: 21px;
    line-height: 15px;
}

こんな感じの物を作って、 source/_includes/post/sharing.html内に

1
2
3
4
5
6
7
    <li class="bookmark">
      {% if index %}
      <input class="link_btn add_bookmark" type="button" value="{{site.favorite}}" data-page_title="{{post.title}} - {{site.title}}" data-page_url="{{site.url}}{{post.url}}"/>
      {% else %}
      <input class="link_btn add_bookmark" type="button" value="{{site.favorite}}" data-page_title="{{page.title}} - {{site.title}}" data-page_url="{{site.url}}{{page.url}}"/>
      {% endif %}
    </li>

といった感じで追加しておきます。

これで今まではFirefoxではサイドバーのチェックを外す警告の後に ブックマークのメニューが出てきてたんですが、何故か出て来なくなった。。。

Firefox23からの変更?

上の関数は割りとどこでも見られる物なので、 適当に同じようなボタンを設置してあるページを探して押してみたところ やっぱり機能してませんでした。アドオンとかを外しても駄目。

で、ちょっと探してたら Firefox 23 サイト互換性情報 のページに、

Ref: サイドバーパネル追加機能が削除されました

との記述が。どうもざっくり削除されたようです。

適当に検索しても英語のページでも全然情報がひっかからないので、 こういうお気に入りボタンを設置してる人はいるものの、 普段使ってる人ってのは実際にはほとんど居ない感じなんでしょうか? (自分で設置しても自分で押すことは滅多に無いので、一度テストしたら 二度と押さないから気付かないかもしれませんが。。。)

という訳で、とりあえずブラウザのせいだと思うので、諦めて、 他に方法も良くわからないので、Chrome等と同じように 自分でショートカットを押して下さい、と表示することに:

//Firefox
-alert("サイドバーではなく、通常のブックマークにする場合、\n\"このブックマークはサイドバーに読み込む\"のチェックを外して下さい。");
-window.sidebar.addPanel(title,url,'');
alert("Push "+metaKey+"-D to add favorite!");

多分、全く使われてないのでいっそ削除してしまってもいいんですが、 なんとなく見栄え的に取っておきたいと言うことで暫くこのまま放置。。。

Firefoxでブックマークする方法

ついでに、Firefoxでのブックマークに関していくつか。

上に書いたように、Ctrl-dで現在のページをブックマーク出来ますが、これを含めて

  • Ctrl-d: このページをブックマーク
  • Ctrl-Shift-d: 全てのタブをブックマーク
  • Ctrl-b: ブックマークサイドバーを表示/非表示
  • Ctrl-Shift-b: 全てのブックマークを表示

等があります。(Macの場合はCtrlの代わりにCmdで。)

ただ、FirefoxにはVimperator を入れてるので、これによってキーマップが変わってます。 Vimperatorを入れてる場合はaまたは:bmarkコマンドで ブックマークを。コマンドの場合は引数でタイトル等の指定も可能。(:h bmarkでチェック)

ショートカットも便利なんですが、普段ブックマークする時は Add Bookmark Here と言うアドオンを使ってます。 このアドオンを入れると、ブックマーク一覧の中に Add Bookmark Hereというボタンが出てきて、各フォルダを見ながら 直接その場にブックマークを入れることが出来て便利です。

もう一つ、ブックマーク関連のアドオンで、 MyBookmarks というのも結構便利です。これは単に自分のブックマーク一覧のページを作ってくれて、 about:mybookmarksと言うアドレスで表示出来るようになります。

Vimperatorとの組み合わせで

nnoremap b :open about:mybookmarks<cr>

な感じでbでMyBookmarksを開ける様に。 (bはVimperatorではbufferコマンド(Firefoxでのタブ操作)に割り当てられてますので使う人は別キーへ。)

それから最後にXmarks。 これで全ての端末のブックマークを同期してます。 直接iPhoneでXmarksのアプリを導入すると、アプリ自体は無料ですが、 同期するには有料アカウントが必要だという罠があるので注意です。

ですが、XmarksはSafariやIEとは無料で同期できるので 1 これらのブックマークをさらにiCloud経由でiPhoneと同期させればOK。 Safariなんかは普段全く起動したことすら無いですが、 このためだけに存在してると言っても過言ではない状態に。。。

Sponsored Links
  1. FirefoxやChromeはアドオンとして入れられますが、SafariやIEはMacやWindowsで 専用ソフトを入れて、それを使って同期を行います。

Sponsored Links

« Vimプラグインlightline導入 ウェブページを読みやすくするBeeLine Reader »