how to replace the page title in the navigation with an imag
dear all,
I guess it is a very basic question but I cant find it in the forum or web, probably I´m unable to describe what I want to do correctly :oops:
I need to create a navigation menu made of images instead of text. Basically the text is in the image…
I have 4 menu points (images)
and per point I have 2 images: 1 for the passive-link and 1 for the roll over and span
can someone please help me, or suggest me what I should look for?
Thank you in advance!
Re: how to replace the page title in the navigation with an
Hi, have you tried to do something like this ?
1. change menu template, add unique id to[*], it will look like <li id="page-url"> (or maybe id is there by default, I don't remember)
2. In CSS create unique id and classes for li and a, use your images as background
3. font-size:0 to <a> and <span> (span for the active link), and display: block for a or li, depends on your css
Re: how to replace the page title in the navigation with an
Hi, I will try this in a sec.
but will it change all menu items in the website?
Because I also have normal menu navigation items in the same page
Re: how to replace the page title in the navigation with an
I think you can control everything with CSS
just specify id for some links which you would like to change.
Re: how to replace the page title in the navigation with an
I use either of two methods:
- Change the template to insert an image of which the filename must be the alias (or id). For active I use alias-active.jpg[/*:m:2ww2et7l]
- Use the extension with which you can choose images per page and display as a navigation: www.contao.org/extension-list/view/page ... ation.html It can do active or hover alternative if you'd use the trick where you shift the image within its container that has overflow: hidden;. The image must contain the inactive and active above or next to another.[/*:m:2ww2et7l]
Re: how to replace the page title in the navigation with an
Yes, should work.
I suggested CSS solution because you can use sprites in CSS for menu
Re: how to replace the page title in the navigation with an
Quote:
Originally Posted by Dmitry
Yes, should work.
I suggested CSS solution because you can use sprites in CSS for menu
Less flexible as well. It all depends on your needs...
Re: how to replace the page title in the navigation with an
CSS sprites are the best way to do it. You can enlarge the page title and then use the image as background. The best way is to assign a class to a page. You can easily multiple edit all your pages's title and CSS class in one go.
Since the class is added to the BODY as well as to the list items in the Navigation, you can then do anything with CSS.