Adding the Add Bookmark link to a web page
Added by IBM contributorIBM on June 17, 2014
Rate this article 1 starsRate this article 2 starsRate this article 3 starsRate this article 4 starsRate this article 5 stars

To simplify the process of adding a bookmark to one's bookmark collection in IBM® Connections, the product provides an Add Bookmark button that users can add to their toolbar and can click to add the current web page to their collection. You can add similar functionality to your web application by adding an Add Bookmark link to a page. When a person clicks the link, the web page is added to the user's IBM Connections bookmark collection.



To simplify the process of adding a bookmark to one's bookmark collection in IBM® Connections, the product provides an Add Bookmark button that users can add to their toolbar and can click to add the current web page to their collection. You can add similar functionality to your web application by adding an Add Bookmark link to a page. When a person clicks the link, the web page is added to the user's IBM Connections bookmark collection.

About this task


The Bookmarks application provides the following resources to help you create the Add Bookmark link:


  • JavaScript™ library: A single file named doglink.js that defines a JavaScript object named "DogLink" and contains a post_to_dogear() method. The file is available from the following web address: http://{your_bookmarks_server}/dogear/tools/doglink.js
  • Icon resource: A file named favicon.gif that is located at the following web address: http://{your_bookmarks_server}/dogear/misc/favicon.gif

The post_to_dogear() method is invoked when a user clicks the Add Bookmark link. It opens a separate web browser window in which the user can modify the description or other fields, and then save the bookmark to her collection in the Bookmarks application.

To add the Add Bookmark link to your web page, complete the following steps:

Procedure

<script

	type="text/javascript"

	src="http://www.example.com/dogear/tools/doglink.js"/>

 

post_to_dogear(url, title, tags, description)


Table 1. post_to_dogear() method parameters

Parameter
Description
description
Description of the page. You can leave the field blank. If your pages have a <meta> tag for descriptions, you can use JavaScript code to get it and fill the field.
tags
Tags are labels that people can associate with a page to categorize it. You can leave this parameter blank or include default tags that you want people to use. Enter tags as a single word, separated by commas or spaces.
title
Title of the page. Specify document.title to refer to the title of the current page.
url
web address of the page. Specify location.href to refer to the current page.


For example:

<a

	href="#"

	style="text-decoration:none;"

	onclick="DogLink.post_to_dogear(location.href,document.title,'','');

	return false;">

	Add Bookmark

	</a>

 

<a

	href="#"

	style="text-decoration:none;"

	onclick="DogLink.post_to_dogear(location.href, document.title, '', '');

	return false;">

	<img

	height=16

	src="http://www.example.com/dogear/misc/favicon.gif"

	width=16

	border=0>

	Add Bookmark

	</a>


Note: Replace www.example.com with the address of your Bookmarks server.
  1. Include the JavaScript library in the <head> HTML block of your web page. For example, use the following HTML element, replacing "www.example.com/dogear" with the address of your Bookmarks server:
  2. In the web page, at the location in which you want the Add Bookmark link to be displayed, add an onClick event that calls the following method:
  3. Recommended: Include a bookmark icon that is displayed on the page in front of the Add Bookmark link text.

Example


Example:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

	"http://www.w3.org/TR/html4/loose.dtd">

	<html>

	<head>

	<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">

	<title>Sample Bookmark-able web Page</title>

	<script

	type="text/javascript"

	src="http://www.example.com/dogear/tools/doglink.js">

	</script>

	</head>

	<body>

	<h2>A sample web page with a bookmark link</h2>

	<p>Your content here. </p>

	<a

	href="#"

	style="text-decoration:none;"

	onclick="javascript:DogLink.post_to_dogear(location.href,document.title,

	'tag1,tag2 tag3', '');

	return false;">

	<img

	height=16

	src="http://www.example.com/dogear/misc/favicon.gif"

	width=16 border=0/>

	Add Bookmark

	</a>

	</body>

	</html>