"Add to favorites" with JavaScript in Opera

Question

How to make this work in Opera? I found this piece of code for Opera, but it doesn't work for me:

 function AddToFavorites(title, url) {

 if (window.sidebar) { // Mozilla Firefox Bookmark
  window.sidebar.addPanel(title, url,"");
  return false;
 } 
 else if( window.external ) { // IE Favorite
  window.external.AddFavorite( url, title); 
  return false;
 }
 else if(window.opera && window.print) { // Opera Hotlist
                var elem = document.createElement('a');
                elem.setAttribute('href',url);
                elem.setAttribute('title',title);
                elem.setAttribute('rel','sidebar');
                elem.click();
                return false;
 }
 }

The Dragonfly error console is silent, no errors are occuring.

Answer 1

Are you passing in values for url and title? IE complains to me that those are not defined.

Answer 2

The following code works in Opera 8.54. It does not work in 9.27 or 9.63 (the only two other versions I have available for testing). In 9.27 and 9.63 it simply navigates you to Yahoo!:

var url = 'http://www.yahoo.com/';
var title = 'Yahoo!';
var elem = document.createElement('a');
elem.setAttribute('href', url);
elem.setAttribute('title', title);
elem.setAttribute('rel', 'sidebar');
elem.click();

I suspect that they removed the ability to add a bookmark/favorite without the user initiating it. Since you can already force the browser to navigate to a new URL using window.location that probably isn't considered a DoS vulnerability.

The following works fine if the user clicks the link:

var url = 'http://www.yahoo.com/';
var title = 'Yahoo!';
var elem = document.createElement('a');
elem.setAttribute('href', url);
elem.setAttribute('title', title);
elem.setAttribute('rel', 'sidebar');
elem.appendChild(document.createTextNode('Add Bookmark'));
document.getElementsByTagName('body')[0].appendChild(elem);

Additionally, window.external.AddFavorite(url, title); no longer allows non-user initiated Favorite addition in Internet Explorer 8 Beta 2. However, if you include it as the onclick event of a link, it works fine:

<a href="http://www.yahoo.com/" title="Yahoo!" onclick="window.external.AddFavorite(this.href, this.title);return false;">Add to Favorites</a>

Both Firefox 2.0.0.18 and 3.0.4 currently support non-user initiated Bookmark addition, but I wouldn't be a bit surprised to see them remove it in a future version as well.

I believe it is considered bad form and a bit rude to try to force a visitor to a website to add a Favorite/Bookmark without them clicking a link or taking an explicit action that would do that. Simply visiting a website is not sufficient reason to try to force those visitors to add a Favorite/Bookmark to it.

Answer 3

Opera enforces the same user-event requirement to allow bookmarking, thus the code you have won't work, because the user never clicked on the link you just created.

You need something more like this:

function AddToFavorites(obj, title, url){
  if(window.sidebar){
    // Mozilla Firefox Bookmark
    window.sidebar.addPanel(title, url,"");
    return false;
  } else if(window.external){
    // IE Favorite
    window.external.AddFavorite( url, title);
    return false;
  } else if(window.opera && window.print){
    //Opera Hotlist
    obj.setAttribute('href',url);
    obj.setAttribute('title',title);
    obj.setAttribute('rel','sidebar');
    obj.click();
    return false;
  }
}

CAll with

<a href="#" onclick="AddToFavorites(this, 'your title', 'your url');">Bookmark This Page</a>

(feel free to make more unobtrusive, I just wanted to indicate the user-event requirement)

Answer 4

If you insist on it, then do it without dynamically generated redundant links:

 <a href="http://real.url.example.com" title="Bookmark me, pleaeease!" 
    rel="sidebar"
    onclick="return !addToFav(this.href,this.title)">

but please, just don't do it.

As Opera user I will be grateful for not pushing that fad – I can easily drag'n'drop tab to bookmarks bar/panel/speedial if I choose to.

Answer 5

The way to get "Add to favorites" link work in Opera 10 is to dynamically add a rel attribute to a link

$('#add_to_favs').attr('rel','sidebar');