Joomla Templates Club 406,261 posts

[Hans Zuidinga Friend Hans ZuidingaJoin date: September 2014Posts: 44Downloads:34Uploads:1 Thanks: 29 Thanked: 2 times in 1 posts]

#186884

Hi,

I am looking for a way to create a footer navigation.

For now I understand there is a plugin to use.

Who wants to point me in a direction?

I have the sitemap.
Only I didn’t succeed in finding a tutorial or so to create a footer sitemap navigation.

Thanks in advance.

Hans

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#490434

1. Generate the site map with any Joomla site map generate eg. Xmap

2. See the link and result of the generated map using the “http” link and not the xml or the other ones (of the map generated)

3. Using google chrome, you can use “tools” and “view source code” navigation options to see the source code for the site map

4. From step 3, copy the source code into any html editor for instance Dreamweaver or Microsoft Expression Web 3 and edit the source code either in design, code or both(split) mode. The author uses the latter editor.
NOTE: When copying the source code you must copy from the “div” tag with the “contentpaneopen” class to the corresponding closing “div” tag since the code above that section is not all that necessary.

5. Now open a new HTML document with your editor (Microsoft Expression Web 3 or Dreamweaver) and paste the source code into the “body” tags in the “code” format of the editor.

6. Now you may view it in the “Design” mode to see how it looks like.

7. The content pane of the footer is 100%, so remember to proportionate your footer groupings/categories to equal 100%.

8. You can accomplish step 7 by recognising that each menu/item category is a “div” on its own. So to get equal percentage for each of them, divide 100 by the total number of main footer menu categories you have. The result represents the percentage each “div” should have.

9. Click on a footer category in the “Design” mode, and click on the drop down arrow from the div button which is located alongside other buttons at the top of the footer menu categories.

10. Click on “Edit tag…” and put in your corresponding percentage value in the piece of code that appears.

11. Do all your necessary formatting

12. When you are done, copy and paste your resulting code into the HTML “footer” column of your Joomla website. Or most conveniently, just above the “div” tag for the footer column. Hence just above the footer.
NOTE: When copying your resulting code, you must copy from the “div” tag with the “contentpaneopen” class to the corresponding closing “div” tag just as you did in the beginning.

13. Apply / edit any CSS in your template to suit.

14. Save

15. Preview your site and you are ready to go.

2 users say Thank You to Ninja Lead for this useful post

1. Hans Zuidinga
2. merce

[Hans Zuidinga Friend Hans ZuidingaJoin date: September 2014Posts: 44Downloads:34Uploads:1 Thanks: 29 Thanked: 2 times in 1 posts]

#490494

You are a Ninja Leader!

You are so cool. Thanks.

[Author]

Posts