The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

Navigation on banner

View previous topic View next topic Go down

Navigation on banner

Post by Quinn on Sat Sep 15, 2012 3:55 am

I want to have my navigation on my banner like this. Help please! And I know I could just cut the header and put it as navigation, but I'm terrible at cutting. Is there any other way to do it?

Quinn
Forumember

Posts : 34
Reputation : 1
Language : Slovene

Back to top Go down

Re: Navigation on banner

Post by runawayhorses on Sat Sep 15, 2012 4:59 am

Yes, make an "Image Map".

In HTML and XHTML, an image map is a list of coordinates relating to a specific image, created in order to hyperlink areas of the image to various destinations (as opposed to a normal image link, in which the entire area of the image links to a single destination). For example, a map of the world may have each country hyperlinked to further information about that country. The intention of an image map is to provide an easy way of linking various parts of an image without dividing the image into separate image files.

Here is an example of an image map coding at the bottom of this posted message. You need an image editor to locate where you want the links (coordinates) to be on the image and replace the coordinates that are in this code with your link coordinates. You add the image URL and the Link URL's to this code, everything goes in this code example. You need to fill in or replace everything in this code, and if you need to add more links, then simply add more lines of coding in the example at the very bottom of this post.

You can use an image editor like "IrfanView" to display your image coordinates. Every image editor has its own way of displaying image coordinates. Just google how to make an image map with with your editor. In a nutshell you load the image in the editor, click on the top of the image where you want the link to be and it will display the coordinates of that place on the image, it will be two numbers like this example, 255, 327. Then you click at the bottom the image where you want the link to be and it will display two more set of coordinates. Then your entire coordinates for that place on the image might look something like this: 255,327,168,55. You would place those coordinates in the code.

IrfanView is free its what I use to make image maps:
http://www.irfanview.com/

You add the URL to the image map in this coding, the links to where you want the destinations to go, and the coordinates and titles.

Full image map code:
Code:
<img src="URL OF IMAGE MAP GOES HERE" width="696" height="30" border="0" alt="" usemap="#NAME OF IMAGE MAP GOES HERE" />

<map name="NAME OF IMAGE MAP GOES HERE">
    <area shape="rect" coords="10,4,107,23" href="LINK TO DESTINATION GOES HERE" title="" alt="" />
    <area shape="rect" coords="116,5,238,23" href="LINK TO DESTINATION GOES HERE" title="" alt="" />
    <area shape="rect" coords="248,5,350,22" href="LINK TO DESTINATION GOES HERE" title="" alt="" />
    <area shape="rect" coords="360,4,456,22" href="LINK TO DESTINATION GOES HERE" title="" alt="" />
    <area shape="rect" coords="466,4,568,21" href="LINK TO DESTINATION GOES HERE" title="" alt="" />
    <area shape="rect" coords="580,4,651,21" href="LINK TO DESTINATION GOES HERE" title="" alt="" />
        <area shape="default" nohref="nohref" title="" alt=""/>

</map>


Extra link example code:
Code:
<area shape="rect" coords="248,5,350,22" href="LINK TO DESTINATION GOES HERE" title="" alt="" />

runawayhorses
Hyperactive

Male Posts : 2537
Reputation : 162
Language : English
Location : United States

http://runawayhorses.alldiscussion.net/

Back to top Go down

Re: Navigation on banner

Post by Quinn on Mon Sep 17, 2012 3:06 am

can I just ask where exactly to put this code? Smile

Quinn
Forumember

Posts : 34
Reputation : 1
Language : Slovene

Back to top Go down

Re: Navigation on banner

Post by runawayhorses on Mon Sep 17, 2012 5:47 am

You would have to be able to edit your template. Where it goes I have no idea. I have never edited a forumotion template before. I have only created my own custom templates from scratch for HTML website pages. I've made many websites from the ground up, but never edited a forumotion template because I never had a version that allowed template editing.

runawayhorses
Hyperactive

Male Posts : 2537
Reputation : 162
Language : English
Location : United States

http://runawayhorses.alldiscussion.net/

Back to top Go down

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum