Basic Image Navigation (WP)
# April 8, 2009 at 11:17 pm
I’ve built a custom theme for WordPress and am having some trouble with the navigation…
I know that there is a line of php that you can enter to replace all your navigation, when say – that its in an ordered list for example.
Question is, if I have image-based navigation that needs to be referenced more along the regular html way, via <a href="pagelink here">, is there a way to do so for multiple links that would work with WordPress, if I created an About page and a contact page in WordPress that I wanted to be able to control through my WordPress Dashboard?
Thanks in advance…
Maris# April 8, 2009 at 11:25 pm
Chris: if you are reading this, I have noticed in your files that I downloaded from your PERSONAL HOMEPAGE THEME that you had a similar situation, and you put the links in as <a href="/"> for HOME, and <a href="/about/"> for the ABOUT page…. been trying to figure out how you made that work….?# April 9, 2009 at 1:24 pm
Sorry…i’ll try to clarify some more…
For a WordPress blog, after creating a custom design, the navigation usually consists of a list, that is replaced by a line of php:
(Replace <ul id=nav> with <?php wp_list_pages(‘sort_column=menu_order&depth=1&title_li=’);?>)
My question is, my navigation is a little more complicated and didn’t use a simple list. I used images so that I can get it to appear exactly how I want it to, and seeing as its made up of purely images, I can not replace the list of pages with the usual php line above, and need to use an alternate or more traditional route of <a href="whatever page"> for each of my separate nav items.
What would each of my hrefs link to, so that I could have it linking to an ABOUT page and CONTACT page, and be able to edit it from the WordPress Dashboard?# April 9, 2009 at 5:24 pm
Let me ask my question a different way…
How do you do rollovers using images for navigation in WordPress?
(I’ve used a "css trick" to do an image rollover, and if I replace my list items with <?php wp_list_pages(‘sort_column=menu_order&depth=1&title_li=’);?> the rollovers no longer work.# April 10, 2009 at 2:30 pm
Wow! That’s an interesting approach. :)
I’m not sure that you have quite grasped the point of CSS. The idea is to separate presentation from content. Filling your header with empty <li> tags to just to put background images where you want them is not generally considered to be the best method.
Chris did a couple of good video series that may help http://css-tricks.com/video-screencasts/12-converting-a-photoshop-mockup-part-two-episode-one/ and http://css-tricks.com/video-screencasts/25-designing-for-wordpress-part-one/. Otherwise, perhaps downloading a couple of free WP themes and deconstructing them, with the help of firebug, might get you back on track.# April 11, 2009 at 11:30 pm
So, the thread continues…
I’ve watched the videos and more or less used the exact same styles and code for my site, its definitely much cleaner now:
Beyond actually cutting up this code for WordPress, in regards to the image navigation, I still don’t understand how I can make these links I have in my navigation work with WordPress…! Please help.
You must be logged in to reply to this topic.