Page 1 of 2 12 LastLast
Results 1 to 10 of 20
  1. #1
    Join Date
    May 2006
    Posts
    14
    Plugin Contributions
    0

    Default Icons for links in Ezpages bar header

    Does anyone know how I might be able to add images in place of standard text links for a site that uses EZpages for navigation?

    Here is a link to the site; http://www.yabbos.com

    I've looked in tpl_ezpages_bar_header php and ezpages_bar_header.php files and am stumped. Not surprising considering my lack of php skills. I'm guessing I need to define images for each link but don't know how to go about it.

    Has anyone done something similar?

    Thanks,
    Todd

  2. #2
    Join Date
    Jan 2004
    Posts
    66,443
    Plugin Contributions
    279

    Default Re: Icons for links in Ezpages bar header

    They are built based on the name of the EZ-Page title, via includes/modules/YOURTEMPLATE/ezpages_bar_header.php

    To convert them to images, you'll have to:
    - change the database to allow you to store the image name
    - change the module to retrieve the image name
    - change the module to use the image name when creating the link
    - deal with stylesheet matters to ensure the images display consistently as desired

    ... and this is assuming everything's only in one language.
    .

    Zen Cart - putting the dream of business ownership within reach of anyone!
    Donate to: DrByte directly or to the Zen Cart team as a whole

    Remember: Any code suggestions you see here are merely suggestions. You assume full responsibility for your use of any such suggestions, including any impact ANY alterations you make to your site may have on your PCI compliance.
    Furthermore, any advice you see here about PCI matters is merely an opinion, and should not be relied upon as "official". Official PCI information should be obtained from the PCI Security Council directly or from one of their authorized Assessors.

  3. #3
    Join Date
    May 2006
    Posts
    14
    Plugin Contributions
    0

    Default Re: Icons for links in Ezpages bar header

    English only. ;)

    So it is workable then? The changes you list, are they extensive or just a few lines of added code?

    If the changes are too daunting I will probably just style the header bar with the stylesheet, but would much prefer the images.

    I'm guessing rollovers is asking a bit too much, eh? lol

    Thanks,
    Todd

  4. #4
    Join Date
    Apr 2006
    Location
    London, UK
    Posts
    10,569
    Plugin Contributions
    25

    Default Re: Icons for links in Ezpages bar header

    There are a variety of ways of doing this depending upon exactly what you want to achieve. However, here's a relatively simple approach that sidesteps the need for database changes.

    Create a tpl_ezpages_bar_header.php in your template and replace the for loop with the following
    <?php for ($i=1, $n=sizeof($var_linksList); $i<=$n; $i++) {
    $tab_img = strtr(strtolower($var_linksList[$i]['name']),' ','_') . '_tab.' . TAB_FILE_EXT; ?><a href="<?php echo $var_linksList[$i]['link']; ?>"><?php echo zen_image($template->get_template_dir($tab_img, DIR_WS_TEMPLATE, $current_page_base,'images'). '/' . $tab_img, $var_linksList[$i]['name']); ?></a>
    <?php } // end FOR loop ?>
    The first line builds an image file name from the text that would have appeared on your tab. So the first one in your menu would be the_stuff_tab.gif if you have defined TAB_FILE_EXT to be 'gif'.

    TAB_FILE_EXT is a new constant for which you would need to add a definition in your header.php file. Though I guess you could hard-code it here to avoid that step if you wished.

    The second line replaces the EZ_Pages link text with an image with the name that was built in the first line, and uses the original link name as the Alt image.

    You would then need to create your images and put them in your template/images file. If your images are all the same size, then it would be good to add the width and height as parameters 3 and 4 of the zen_image function.

    Finally, some styling of the images/links may be necessary to persuade them to line up neatly across your page.

    Rollovers? That could be could be achieved by including an onmouseover command as the 5th parameter of the zen_image function, with the rollover image name built up in the same way as was done for the initial tab image.
    Kuroi Web Design and Development | Twitter

    (Questions answered in the forum only - so that any forum member can benefit - not by personal message)

  5. #5
    Join Date
    Feb 2006
    Location
    UK
    Posts
    306
    Plugin Contributions
    1

    Default Re: Icons for links in Ezpages bar header

    Quote Originally Posted by strokerstees
    Does anyone know how I might be able to add images in place of standard text links for a site that uses EZpages for navigation?

    Has anyone done something similar?

    Thanks,
    Todd
    Like this ? http://www.stylish-bathroom-cabinets.co.uk/

  6. #6
    Join Date
    Apr 2006
    Location
    London, UK
    Posts
    10,569
    Plugin Contributions
    25

    Default Re: Icons for links in Ezpages bar header

    Hi Paul

    I actually thought about your site when I first saw this question, but ... errr ... you used category tabs not EZ-Pages. Nevertheless, the underlying technique is very similar and you're right that Todd might find value in visiting the thread where this approach was refined.
    Kuroi Web Design and Development | Twitter

    (Questions answered in the forum only - so that any forum member can benefit - not by personal message)

  7. #7
    Join Date
    Feb 2006
    Location
    UK
    Posts
    306
    Plugin Contributions
    1

    Default Re: Icons for links in Ezpages bar header

    Hi Kuroi,
    yep thought it was close, still don't know enough about ZC terminology, but I figured you and I thrashing it out on that other thread would be worth a read by Stokerstees

  8. #8
    Join Date
    May 2006
    Posts
    14
    Plugin Contributions
    0

    Default Re: Icons for links in Ezpages bar header

    Booyah!! We have success! Even a noob like me was able to figure it out after a while. (I had to hardcode the define into the tpl_ezpages_header thingy as I apparently put it in the wrong header file or that just didn't work.)

    http://www.yabbos.com to check it out.

    Now to add rollovers. I'll search the forum for adding onmouseover commands and just exactly how to difine the sizes as they are all the same size.

    Thanks for the help once again Kuroi!

    Todd

  9. #9
    Join Date
    May 2006
    Posts
    14
    Plugin Contributions
    0

    Default Re: Icons for links in Ezpages bar header

    Hmmmm. Not finding the info I am looking for after two hours of searching. I may have found it, but simply didn't understand it?

    I looked at Easy Rollovers but that only seems to work with zen buttons, which these are not.

    Any suggestions?

    Thanks,
    Todd

  10. #10
    Join Date
    Apr 2006
    Location
    London, UK
    Posts
    10,569
    Plugin Contributions
    25

    Default Re: Icons for links in Ezpages bar header

    I'd recommend that you first get your head round javascript rollovers, to which there's a helpful introduction here.

    Then work out what inline javascript would need to appear in the HTML that Zen Cart produces.

    Finally insert that inline javascriot into the 5th parameter of the zen_image function call.
    Kuroi Web Design and Development | Twitter

    (Questions answered in the forum only - so that any forum member can benefit - not by personal message)

 

 
Page 1 of 2 12 LastLast

Similar Threads

  1. navMain area and EZPages Header Bar
    By autoace in forum Templates, Stylesheets, Page Layout
    Replies: 0
    Last Post: 16 Sep 2009, 05:05 PM
  2. EZpages Header Links Position
    By Craig Robbo in forum Templates, Stylesheets, Page Layout
    Replies: 0
    Last Post: 7 May 2009, 08:18 AM
  3. Add search box to EZpages header bar
    By sandstoner in forum Templates, Stylesheets, Page Layout
    Replies: 7
    Last Post: 18 Sep 2008, 03:02 AM
  4. Moving EZPages Header Links down
    By BekahRuth in forum Basic Configuration
    Replies: 2
    Last Post: 3 Aug 2008, 03:10 AM
  5. EZpages header bar
    By scottb in forum General Questions
    Replies: 1
    Last Post: 14 Nov 2006, 10:23 PM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
disjunctive-egg