1. Eliecer Marchante
  2. Tricks
  3. Tuesday, 26 June 2012
  4.  Subscribe via email
This tutorial is based on Joomla 2.5, and Hotspots Version 2.0.5. Also, the SEO Settings are:

[color=#bb0000]Search Engine Friendly URLs:[/color] Yes
[color=#bb0000]Use URL rewriting:[/color] Yes
[color=#bb0000]Adds Suffix to URL:[/color] Yes
[color=#bb0000]Unicode Aliases:[/color] No

For the first part of this tutorial we will use part of the tutorial located at: http://www.ostraining.com/blog/joomla/how-to-link-from-one-joomla-article-to-another-using-hidden-menu/

First you need to attach the component (hotspot) to a menu, but you don't wanna show the map attached to an active menu. Then we need to create a new menu, and hide it.

How to hide a menu in joomla?
- Go to Menus/Menu Manager
- Select New
- Fill the information appropriately. Something like:

[color=#bb0000]Unique name:[/color] hiddenmenu
[color=#bb0000]Title:[/color] Hidden Menu
[color=#bb0000]Description:[/color] this menu contains my links
[color=#bb0000]Module Title:[/color] myHiddenMenu

- Save that menu
- Go to Menus and select Hidden Menu
- Select New
- Select Hotspots/Map View
- Fill the title and the Alias. Something like:

[color=#bb0000]Title:[/color] My Maps
[color=#bb0000]Alias:[/color] mymaps

We had the whole hotspots component working in our site, but nobody can see it because there is no link to the map.

The Second Part:
Go to the article where you wanna include your map, select the line where you wanna show the map, and insert the following code:

[code type=css]<iframe src="http://YOUR_WEBSITE_ADDRESS/mymaps/?tmpl=component#!CATEGORY_ID" scrolling="no" width="100%" height="500px" frameborder="0"></iframe>[/code]

and replace:
[color=#bb0000]YOUR_WEBSITE_ADDRESS[/color] with your actual website address
[color=#bb0000]CATEGORY_ID[/color] with the id of the category you wanna show on that map

[color=#0000bb]Tips: [/color]
1) Make the height 100 pixels bigger than the height of the map of hotspot component (Components/Hotspots/Layout/Height of the map div)
2) Note that after [color=#bb0000]YOUR_WEBSITE_ADDRESS[/color] you have to add the Alias you used when you created the hidden map.
3) To know the category ID number, go to [code type=css]http://YOUR_WEBSITE_ADDRESS/mymaps[/code] and click on the category markers on top of the map, check the address bar, and the number will be at the end of the line. ([color=#000088]NOTE:[/color] YOU WILL SEE THIS PAGE ONLY TYPING THE ABOVE LINK BECAUSE IT'S NOT ATTACHED TO ANY VISIBLE MENU FROM YOUR WEBSITE)

You can see the final result here: http://www.vbct.ca/restaurants
Responses (0)

There are no replies made for this post yet.
However, you are not allowed to reply to this post.
Powered by EasyDiscuss for Joomla!