Is there a way to do this where I add an image to the left of the text links?
Is there a way to do this where I add an image to the left of the text links?
Yes, you would style the links as list items, inline, with the stars as markers. I can't take the time right now to work out all the styling, but if you post a link to see your site, I'll look at it later.
From the wording of your other post asking the same question, it is apparent that you want not "an image" (one, repeated) but a unique image for each category. Thus the above method is not what you want. A slight tweak to the original code in post 5 will take care of you:PHP Code:
//image replacement
if (file_exists(DIR_WS_TEMPLATE . 'buttons/' . $_SESSION['language'] . '/cat_tab' . $categories_tab->fields['categories_id'] . '.gif') {
$categories_tab_display = '<img src="' . DIR_WS_TEMPLATE_IMAGES . 'pixel_trans.gif" alt="' . $categories_tab->fields['categories_name'] . '" />' . $categories_tab->fields['categories_name']; //image plus text
$new_style = 'category-' . $categories_tab->fields['categories_id']; //class for individual cat hover
}else{
$categories_tab_display = $categories_tab->fields['categories_name'];
$new_style = 'category-top'; //class for non-hover cat
}
// currently selected category
if ((int)$cPath == $categories_tab->fields['categories_id']) {
$categories_tab_current = '<span class="category-subs-selected">' . $categories_tab_display . '</span>';
} else {
$categories_tab_current = $categories_tab_display;
}
Hmmmm, I'm getting the same issue where everything disappears except for the header. Here's the code I pasted into categories_tabs.php
I added the 2nd parentheses as it looked like it was omitted as you had mentioned in one of the previous posts. You'll notice that I also switched .gif to .png as that is the format of my buttons. I assumed that was okay.Code://image replacement if (file_exists(DIR_WS_TEMPLATE . 'buttons/' . $_SESSION['language'] . '/cat_tab' . $categories_tab->fields['categories_id'] . '.png')) { $categories_tab_display = '<img src="' . DIR_WS_TEMPLATE_IMAGES . 'pixel_trans.gif" alt="' . $categories_tab->fields['categories_name'] . '" />' . $categories_tab->fields['categories_name']; //image plus text $new_style = 'category-' . $categories_tab->fields['categories_id']; //class for individual cat hover }else{ $categories_tab_display = $categories_tab->fields['categories_name']; $new_style = 'category-top'; //class for non-hover cat } // currently selected category if ((int)$cPath == $categories_tab->fields['categories_id']) { $categories_tab_current = '<span class="category-subs-selected">' . $categories_tab_display . '</span>'; } else { $categories_tab_current = $categories_tab_display; }
And here is what I put into the css:
I don't have hover images yet so I just referenced the same buttons. I think I've done it right, but everything except for the header is gone. I'm stumped. Any ideas?Code:category-1 {background: url(../buttons/english/cat_tab1.png) no-repeat;} category-1:hover {background: url(../buttons/english/cat_tab1.png) no-repeat;} category-2 {background: url(../buttons/english/cat_tab2.png) no-repeat;} category-2:hover {background: url(../buttons/english/cat_tab2.png) no-repeat;} category-3 {background: url(../buttons/english/cat_tab3.png) no-repeat;} category-3:hover {background: url(../buttons/english/cat_tab3.png) no-repeat;}
P.S. - I should note that I didn't have /includes/modules/your_template/categories_tabs.php, as it's not in my template, so I just edited the one in template_default, but I still put the buttons within my template
Last edited by stevelucky; 24 Jul 2010 at 10:36 AM.
Any time a /your_template/ file is mentioned, you should copy it from the /template_default/ version to a /your_template/ folder if you don't already have it. This would not be the reason for your problem, though.
It appears I missed the . before the classnames in my example in post 3:
category-1 {background: url(../buttons/english/cat_tab1.png) no-repeat;}
should be
.category-1 {background: url(../buttons/english/cat_tab1.png) no-repeat;}
If you don't want hover effects, you don't need a :hover rule at all.
Actually, in that case you would want to use the original version of the code (with ) adjustment and tweaked for image plus text):
Finally, I see several error notices "undefined x" on your homepage, completely unrelated to categories-tabs, one in white on white in the header and two at the bottom. You may have some corrupted files.PHP Code:
//image replacement
if (file_exists(DIR_WS_TEMPLATE . 'buttons/' . $_SESSION['language'] . '/cat_tab' . $categories_tab->fields['categories_id'] . '.png')) {
$categories_tab_display = '<img src="' . DIR_WS_TEMPLATE . 'buttons/' . $_SESSION['language'] . '/cat_tab' . $categories_tab->fields['categories_id'] . '.png" alt="' . $categories_tab->fields['categories_name'] . '" />' . $categories_tab->fields['categories_name'];
}else{
$categories_tab_display = $categories_tab->fields['categories_name'];
}
// currently selected category
if ((int)$cPath == $categories_tab->fields['categories_id']) {
$new_style = 'category-top';
$categories_tab_current = '<span class="category-subs-selected">' . $categories_tab_display . '</span>';
} else {
$new_style = 'category-top';
$categories_tab_current = $categories_tab_display;
}
Last edited by gjh42; 24 Jul 2010 at 04:37 PM.
Those notices were some issues that I was having installing Magic SEO URL's, but has been resolved.
So here's my entire PHP for catergories_tabs.php (which has now been moved to my includes/modules/my_template folder).
And here's my revised CSS:PHP Code:
<?php
/**
* categories_tabs.php module
*
* @package templateSystem
* @copyright Copyright 2003-2006 Zen Cart Development Team
* @copyright Portions Copyright 2003 osCommerce
* @license http://www.zen-cart.com/license/2_0.txt GNU Public License V2.0
* @version $Id: categories_tabs.php 3018 2006-02-12 21:04:04Z wilt $
*/
if (!defined('IS_ADMIN_FLAG')) {
die('Illegal Access');
}
$order_by = " order by c.sort_order, cd.categories_name ";
$categories_tab_query = "select c.categories_id, cd.categories_name from " .
TABLE_CATEGORIES . " c, " . TABLE_CATEGORIES_DESCRIPTION . " cd
where c.categories_id=cd.categories_id and c.parent_id= '0' and cd.language_id='" . (int)$_SESSION['languages_id'] . "' and c.categories_status='1'" .
$order_by;
$categories_tab = $db->Execute($categories_tab_query);
$links_list = array();
while (!$categories_tab->EOF) {
//image replacement
if (file_exists(DIR_WS_TEMPLATE . 'buttons/' . $_SESSION['language'] . '/cat_tab' . $categories_tab->fields['categories_id'] . '.png')) {
$categories_tab_display = '<img src="' . DIR_WS_TEMPLATE . 'buttons/' . $_SESSION['language'] . '/cat_tab' . $categories_tab->fields['categories_id'] . '.png" alt="' . $categories_tab->fields['categories_name'] . '" />' . $categories_tab->fields['categories_name'];
}else{
$categories_tab_display = $categories_tab->fields['categories_name'];
}
// currently selected category
if ((int)$cPath == $categories_tab->fields['categories_id']) {
$new_style = 'category-top';
$categories_tab_current = '<span class="category-subs-selected">' . $categories_tab_display . '</span>';
} else {
$new_style = 'category-top';
$categories_tab_current = $categories_tab_display;
}
?>
I still get nothing below the header when I have it like this.Code:.category-1 {background: url(../buttons/english/cat_tab1.png) no-repeat;} .category-2 {background: url(../buttons/english/cat_tab2.png) no-repeat;} .category-3 {background: url(../buttons/english/cat_tab3.png) no-repeat;}
I didn't mention explicitly that the code I posted the last couple of times does not include the "// create link to top level category" section, as that was unchanged from the original in all mod versions given. You cannot delete that from the file without causing a major problem.
You, sir, are a beautiful human being. That did it! Thank you so much for taking your time to help me out.
Bookmarks