If you have notice after you pin a website (i.e facebook.com) on the taskbar and you right click on it, a menu will pop-up, this menu is called Jump List. This it is a quick and easy way to access different sections within the website or other important links. Note: The number of items display by a Jump List will vary from website to website or applications. Today we are going to learn how to implement a simple Jump List for IE9 without the need of a plugin; that way when people using Internet Explorer 9 pin your site in their Windows 7 taskbar, they are going to have faster access to content and richer experience. OK, lets start: 1- First, you are going to need a 32×32 pixels favicon image in your WordPress website, this is the image that will be display when you pin a site in Windows 7 taskbar; and you are also going to need another favicon image for each of the Jump List item; they could be 16×16 pixels.
If you don’t know how to create a favicon image, do a search online for “favicon generator”, there are a lot of websites that would let you upload and convert any .jpg and .png or other types of image files to a favicon (*.ico) file format. After you’re done, upload them to your WordPress website! Warning! Remember to always make a backup of your site before modifying any file. 2- Log in to your WordPress site, browse to your theme template folder, locate and open the header.php file. Look for a line of code that is similar to this one: <link rel=”shortcut icon” href=”/image-folder-path/favicon.ico” /> If you already have this line, the only thing that you have to do is to paste the following Jump List code below under this line.
Remember to replace the content in orange with your website settings and save the header.php file when you done.
If not have the first line of code I mentioned above, you will need to paste the following code before the.
/image-folder-path/favicon.ico” />Remember to replace the content in orange with your website settings and save the header.php file when you done. Tip: Clear all your browser cache files and restart the IE9 before pinning your website to the taskbar. Also note that the web browser could take some time to sync with the favicon images.
Code explained: The first line, is the line that the web browser is going to look for to grab and display an image in the browser tab. Example: <link rel=”shortcut icon” href=”/image-folder-path/favicon.ico” />
Starting with the release of IE9 Beta, Microsoft has introduced HTML meta tags:
This meta tag has two attributes name that must have the “application-name” value and content attribute that should be filled with the name of your website. Example:This meta tag has two attributes name that must have “msapplication-tooltip” value and content attribute that hold the tooltip name of a link. Example:Next, to add an item to the Jump List you will need the following meta tag (Repeat this process for each item that you want to include. Try to limit the numbers of items to 4 or 5):
This meta tag has two attributes name that must have the “misapplication-task” and the content attribute that has 3 strings values (name, action-uri, and icon-uri) explained in the example below: Example:For WordPress you could use in “action-uri=” the code, this will pull the website URL and for “icon-uri=” the code, this will pull the theme directory location.
WordPress example: <meta name=”msapplication-task” content=”name=News; action-uri=/news; icon-uri=/image-folder-path/favicon.ico” />
Pureinfotech now also supports Jump List, so If you like to see Jump List in action using Internet Explorer 9, try pinning Pureinfotech.com to your Windows 7 taskbar. I hope this info was helpful to you, remember to leave a comment in the section below. Thanks!
All content on this site is provided with no warranties, express or implied. Use any information at your own risk. Always backup of your device and files before making any changes. Privacy policy info.
