Re: CSS Dropdown menu for your header- With Categories!
Quote:
Originally Posted by
MeltDown
Hello! I've just added this menu to my Zen version 1.3.6 and overall everything seems to be fine. There is one minor issue that I'd like to resolve: If you visit
this page and mouse-over
Categories or
Information in the menu, you'll see that the menu goes behind the CSS image Gallery. Any suggestions on how to correct that?
And while I'm at it, could someone also tell me how to remove the grey line at the upper-most part of the page?
Thanks!!
I dealt with the issue by re-arranging the page content, although this certainly doesn't resolve the fact that this issue was occuring. If anyone has comments on why it was occuring I would love to hear them.
Also I would still like to remove that grey line at the upper-most part of the page that seems to be born out of the introduction of this mod.
Thanks!
Re: CSS Dropdown menu for your header- With Categories!
I just noticed another issue: When you click to view the large image, the menu stays on top of the image rather than dimming and going behind. (Example: Click to enlarge)
In in stylesheet_lightbox.css, change the z-index of #overlay to 9000 as reccomended here but to no avail.
This cart is a Zen 1.3.6 and I am using the Zen Lightbox mod.
Thanks for whatever assistance anyone can give!
Re: CSS Dropdown menu for your header- With Categories!
OMG what an AWESOME Mod!! :clap:
I don't think I've ever had used one that was SO easy to implement! Practically did everything by itself while I just sat here & watched.
My only "issue" (cuz not really a problem) is that it affected the appearance of a couple other things...
#1 - I've now got this white space above my header/logo img. I'm thinking that it's obviously somewhere in the css for this mod, but I don't want to go messing around with the code until I know exactly what to change. Weird thing is...it only appears as white space. If you hover over left side of white space, you actually see links for Home and Log In. ??
#2 - My shop now is "touching" the top/bottom of the browser window, whereas before, I had it set up to have a little spacing above/below the shop. Pardon my lack of exact terminology, lol.
Can someone maybe take a look at my site here and tell me which part(s) I need to tinker with?:
http://www.thesoappeddler.com
Thanks in advance!
P.S. I'm using 1.3.8a, heavily mod'd
Re: CSS Dropdown menu for your header- With Categories!
Quote:
Originally Posted by
MeltDown
I just noticed another issue: When you click to view the large image, the menu stays on top of the image rather than dimming and going behind. (
Example: Click to enlarge)
In in stylesheet_lightbox.css, change the z-index of #overlay to 9000 as reccomended
here but to no avail.
This cart is a Zen 1.3.6 and I am using the Zen Lightbox mod.
Thanks for whatever assistance anyone can give!
I believe I've worked this out: In stylesheet_lightbox.css I increased the z-index on the lightbox to 1000:
Quote:
#lightbox {
left:0;
line-height:0;
position:absolute;
text-align:center;
top:40px;
width:100%;
z-index:1000;
}
Re: CSS Dropdown menu for your header- With Categories!
Quote:
Originally Posted by
MeltDown
I just noticed another issue: When you click to view the large image, the menu stays on top of the image rather than dimming and going behind. (
Example: Click to enlarge)
In in stylesheet_lightbox.css, change the z-index of #overlay to 9000 as reccomended
here but to no avail.
This cart is a Zen 1.3.6 and I am using the Zen Lightbox mod.
Thanks for whatever assistance anyone can give!
Try changing both of the z-index in these two in the stylesheet_lightbox.css.
Quote:
#lightbox {
left:0;
line-height:0;
position:absolute;
text-align:center;
top:40px;
width:100%;
z-index:10000;
}
Quote:
#overlay {
-moz-opacity:0.6px;
background-color:#000;
filter:alpha(opacity=60);
height:500px;
left:0;
opacity:0.6px;
position:absolute;
top:0;
width:100%;
z-index:9000;
}
Re: CSS Dropdown menu for your header- With Categories!
I am still working on categories in my header. I dropped one trying to get all to fit.
Still does not look very good and categories are running together like Homeschool and kids.
Still Need:
1. Categories to line up across -spacing
2. When hover over Christian Living - covers words up
Any suggestions? Kim
www.burnerbooks.com
Re: CSS Dropdown menu for your header- With Categories!
Installed on my 1.3.8a and working like a charm, just got to edit the stylesheet tomorrow to change the colours!
Thankyou for such a great add-on!
Re: CSS Dropdown menu for your header- With Categories!
Quote:
Originally Posted by
kburner
I am still working on categories in my header. I dropped one trying to get all to fit.
Still does not look very good and categories are running together like Homeschool and kids.
Still Need:
1. Categories to line up across -spacing
2. When hover over Christian Living - covers words up
Any suggestions? Kim
www.burnerbooks.com
Not sure how to do it...but would like to divide each category up and apply image, spacing...maybe get it to work that way.
I am not good at css. How do I make each category stand alone?
For example, category KJV Bibles would have line of own.
Kim
Re: CSS Dropdown menu for your header- With Categories!
Quote:
Originally Posted by
kburner
I am still working on categories in my header. I dropped one trying to get all to fit.
Still does not look very good and categories are running together like Homeschool and kids.
Still Need:
1. Categories to line up across -spacing
2. When hover over Christian Living - covers words up
Any suggestions? Kim
www.burnerbooks.com
Hi I'm looking to put my top catagories across the top like on your site. Can you explain how you did this?
Thanks if you can.
Re: CSS Dropdown menu for your header- With Categories!
Quote:
Originally Posted by
timdwyer42
Hi I'm looking to put my top catagories across the top like on your site. Can you explain how you did this?
Thanks if you can.
Someone else within this thread helped me. I went through my files and if I am not mistaken this is where you modify. includes/classes/categories_ul_generator.php. I am not sure where so I included whole file. You may want to use winmerge to see differences.
PHP Code:
class zen_categories_ul_generator {
var $root_category_id = 0,
$max_level = 6,
$data = array(),
$root_start_string = '',
$root_end_string = '',
$parent_start_string = '',
$parent_end_string = '',
$parent_group_start_string = '<ul%s>',
$parent_group_end_string = '</ul>',
$child_start_string = '<li%s>',
$child_end_string = '</li>',
$spacer_string = '
',
$spacer_multiplier = 1;
var $document_types_list = ' (3) ';// acceptable format example: ' (3, 4, 9, 22, 18) '
function zen_categories_ul_generator($load_from_database = true)
{
global $languages_id, $db;
$this->data = array();
$categories_query = "select c.categories_id, cd.categories_name, c.parent_id
from " . TABLE_CATEGORIES . " c, " . TABLE_CATEGORIES_DESCRIPTION . " cd
where c.categories_id = cd.categories_id
and c.categories_status=1 " .
" and cd.language_id = '" . (int)$_SESSION['languages_id'] . "' " .
" order by c.parent_id, c.sort_order, cd.categories_name";
$categories = $db->Execute($categories_query);
while (!$categories->EOF) {
$this->data[$categories->fields['parent_id']][$categories->fields['categories_id']] = array('name' => $categories->fields['categories_name'], 'count' => 0);
$categories->MoveNext();
}
}
function buildBranch($parent_id, $level = 1, $submenu=false) {
if ($parent_id != '0') {
$result = sprintf($this->parent_group_start_string, ($submenu==true) ? ' class="level'. ($level) . '"' : '' );
}
if (($this->data[$parent_id])) {
foreach($this->data[$parent_id] as $category_id => $category) {
$category_link = $category_id;
if (($this->data[$category_id])) {
$result .= sprintf($this->child_start_string, ($submenu==true) ? ' class="submenu"' : '');
} else {
if (($this->data[$category_id]) && ($submenu==false)) {
$result .= sprintf($this->parent_group_start_string, ($submenu==true) ? ' class="level'. ($level+1) . '"' : '');
$result .= sprintf($this->child_start_string, ($submenu==true) ? ' class="submenu"' : '');
} else {
$result .= sprintf($this->child_start_string, '');
}
}
if ($level == 0) {
$result .= $this->root_start_string;
}
$result .= str_repeat($this->spacer_string, $this->spacer_multiplier * $level) . '<a href="' . zen_href_link(FILENAME_DEFAULT, 'cPath=' . $category_link) . '">';
$result .= $category['name'];
$result .= '</a>';
if ($level == 0) {
$result .= $this->root_end_string;
}
if (($this->data[$category_id])) {
$result .= $this->parent_end_string;
}
if (($this->data[$category_id]) && (($this->max_level == '0') || ($this->max_level > $level+1))) {
$result .= $this->buildBranch($category_id, $level+1, $submenu);
}
$result .= $this->child_end_string;
}
}
if ($level > 0) {
$result .= $this->parent_group_end_string;
}
return $result;
}
function buildTree($submenu=false)
{
return $this->buildBranch($this->root_category_id, '', $submenu);
}
}
?>
Hope this helps. I have 12-13 categories and I am still trying to get spacing to work. I am hoping someone provides response with "how to" with separating each category and modify each in css file. I am not good at generating new css for each category.
Kim