Abbington Mega Template [Support Thread]

[Jerry999]

Hi, Anne,

I also have same problem. When I load my homepage, the new products can not show, and I must click New button to expand new products.

Can you view our website, http:www.buywholesaleprices.com and help us to find the problem.

Thanks!

Hi Anne,
I've got a problem: i've installed your template following the guide, and everything is ok except one thing.
In my homepage the box with the new,freatured and special product is not open when i load the page, i have to click in on of that section to expand and see my product in there.
Do i miss something?the SQL patch didn't give me errors.
Thank you for help!

[picaflor-azul]

Hi Anne great template just a minor problem if you click on the help link on the shopping cart page the text Visitors Cart / Members Cart
Visitors Cart is the same colour as the bar at the top of the pop up how do you change the font colour for this.

You can add this to the bottom of your stylesheet.css file:

#infoShoppingCart{background:none;}

Thanks,

Anne

[picaflor-azul]

I forgot to report back - I was having trouble with my computer.
Got if fixed but now I need to know how to TURN OFF the manufacturer listing??

I am happy that you got it figured out. You can follow the instructions in the readme.html file for how to hide any of the menu items.

Thanks,

Anne

[picaflor-azul]

Hi, Anne,

I also have same problem. When I load my homepage, the new products can not show, and I must click New button to expand new products.

Can you view our website, http:www.buywholesaleprices.com and help us to find the problem.

Thanks!

I am only seeing new products in the tabs. Have you edited the code to only show new products? Have you added featured products and specials?

Thanks,

Anne

[Zadris]

Your instructions:


Hide any of the Drop Downs

You can hide any of the drop down menus by going to includes/templates/abbington_mega/css/stylesheet_mega_menu.css

Add a display:none; to the class for the drop down you want to hide. So, for example, if you wanted to hide contact us you would add this to the bottom of the file:

.contactus-li{display:none;}

The classes for the drop down menus are as follows:

.quicklinks-li
.categories-li
.manufacturers-li
.aboutus-li
.information-li
.contactus-li
.customerservice-li

But cannot locate it in the stylesheet_mega_menu:

Here's the file:

#mega-wrapper {width: 980px;margin:0 auto;display:block;position: relative;z-index:9999;}
#mega-wrapper .mega-menu {list-style:none;width:940px;margin:30px auto 0px auto;height:43px;padding:0px 20px 0px 20px;-moz-border-radius: 5px;-webkit-border-radius: 5px;border-radius: 5px;}
.mega-menu li {float:left;text-align:center;position:relative;margin-right:20px;margin-top:6px;border:none;}
.mega-menu li.fullwidth {position: static !important;}
.mega-menu li:hover {background:#eee;border:1px solid #444;border-bottom:none;margin-right:19px;background: -moz-linear-gradient(top, #f4f4f4, #eee);background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#f4f4f4), to(#eee));background: -o-linear-gradient(top, #f4f4f4, #eee);-moz-border-radius: 5px 5px 0px 0px; -webkit-border-radius: 5px 5px 0px 0px;-khtml-border-radius: 5px 5px 0px 0px;border-radius: 5px 5px 0px 0px;}
.mega-menu li.nodrop:hover {background:#eee;border:1px solid #444;padding: 4px 10px 4px 9px;background: -moz-linear-gradient(top, #f4f4f4, #eee);background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#f4f4f4), to(#eee));background: -o-linear-gradient(top, #f4f4f4, #eee);-moz-border-radius: 5px;-webkit-border-radius: 5px;-khtml-border-radius: 5px;border-radius: 5px;}
.mega-menu li.nodrop:hover a {padding: 0px;}
.mega-menu li a {color: #eeeeed;outline:0;padding: 5px 10px 3px 10px;text-decoration:none;display:block;text-shadow: 1px 1px 1px #000001;}
.mega-menu li:hover a {color:#161616;text-shadow: none;position:relative;z-index:11;border-bottom:1px solid #eee;padding: 4px 9px 4px 9px;}
.mega-menu li:hover div a {display:inline;}
.mega-menu li .drop {padding-right:27px;}
.mega-menu li:hover .drop {padding-right:27px;}

/* bof right aligned menu item */
.mega-menu .right {float:right;right:0;margin-right:0px;}
.mega-menu li.right:hover {margin-right:-1px;}

/* bof drop down styles */
.mega-menu .dropdown_1column, .mega-menu .dropdown_2columns, .mega-menu .dropdown_3columns, .mega-menu .dropdown_4columns, .mega-menu .dropdown_5columns, .mega-menu .dropdown_customer_service,
.mega-menu .dropdown_aboutus, .mega-menu .dropdown_info, .mega-menu .dropdown_fullwidth {margin:4px auto;left:-999em;position:absolute;background:#fff;border:1px solid #444;padding:10px;text-align:left;-moz-border-radius: 0px 5px 5px 5px;-webkit-border-radius: 0px 5px 5px 5px;-khtml-border-radius: 0px 5px 5px 5px;border-radius: 0px 5px 5px 5px;background: -moz-linear-gradient(top, #ebecf0, #fff);background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#ebecf0), to(#fff));background: -o-linear-gradient(top, #ebecf0, #fff);}

.mega-menu .dropdown_1column {width: 145px;}
.mega-menu .dropdown_2columns {width: 300px;}
.mega-menu .dropdown_customer_service {width: 605px;}
.mega-menu .dropdown_aboutus {width: 585px;}
.mega-menu .dropdown_info {width: 470px;}

/* bof drop down on mouse hover left aligned */
.mega-menu li:hover .dropdown_1column, .mega-menu li:hover .dropdown_2columns, .mega-menu li:hover .dropdown_customer_service, .mega-menu li:hover .dropdown_aboutus, .mega-menu li:hover .dropdown_info {left:-1px;top:25px;}

/* bof drop down on mouse hover right aligned */
.mega-menu li .align_right {-moz-border-radius: 5px 0px 5px 5px;-webkit-border-radius: 5px 0px 5px 5px;border-radius: 5px 0px 5px 5px;}
.mega-menu li:hover .align_right {left:auto;right:-1px;top:25px;}

/* bof column sizes */
.mega-menu .col_1, .mega-menu .col_2 {display:inline;float: left;position: relative;margin-left: 10px;}
.mega-menu .col_1 {width:145px;}
.mega-menu .col_2 {width:300px;}
.mega-menu .col_cs {width:605px;}
.mega-menu .col_aboutus {width:585px;}
.mega-menu .col_3 {width:455px;}
.mega-menu .col_4 {width:610px;}
.mega-menu .col_5 {width:765px;}
.mega-menu .col_6 {width:920px;}

/* Use the firstcolumn class for the items that stick to the left edge of the dropdown */
.mega-menu .firstcolumn {margin-left: 0; /* Clearing margin & left */clear: left;}

/*bof content*/
.mega-menu p, .mega-menu ul, .mega-menu li, .mega-menu h2, .mega-menu h3 {font-size:14px;font-family:Arial, Helvetica, sans-serif;line-height:21px;text-align:left;}
.mega-menu p {font-size:12px;line-height:18px;margin:0; margin-bottom:10px;text-shadow: 1px 1px 1px #fffffd;color:#444443;}
.mega-menu h2, .mega-menu h3 {text-shadow: 1px 1px 1px #fff;border-bottom:1px solid #888;margin-top:7px;color:#9a1213;}
.mega-menu h2 {font-weight:400;font-size:21px;margin-bottom:18px;padding-bottom:11px;}
.mega-menu h3 {font-weight:600;font-size:14px;margin-bottom:14px;padding-bottom:7px;}
.mega-menu li:hover div a {text-decoration:none;text-shadow:none;border:none;padding:0;}

/* bof images */
.mega-menu .imgshadow_light {background:#fff;padding:4px;border:1px solid #777;margin-top:5px;margin-left:20px;-moz-box-shadow:0px 0px 5px #666;-webkit-box-shadow:0px 0px 5px #666;box-shadow:0px 0px 5px #666;}

/* bof standard lists styles */
.mega-menu li ul {list-style:none;padding:0;margin:0 0 12px 0;}
.mega-menu li ul li {font-size:12px;line-height:24px;position:relative;text-shadow: 1px 1px 1px #fff;padding:0;margin:0;float:left;text-align:left;width:145px;}
.mega-menu li ul li a {padding:0;}
.mega-menu li ul li:hover {background:none;border:none;padding:0;margin:0;}

/* bof 2 levels drop down */
.mega-menu .levels, .mega-menu .levels ul {/* all lists */padding: 0;margin: 0;list-style: none;}
.mega-menu li:hover .levels a {display:block;}
.mega-menu .levels a {display: block;width: 10em;}
.mega-menu .levels a.parent, .mega-menu .levels a.parent:hover {}
.mega-menu .levels li {float: left;width:150px;}
.mega-menu .levels li ul {/* second-level lists */position: absolute;border:1px solid #666;background:#fff;top:-23px;margin:15px 0px 0px 4px;padding:6px;-moz-border-radius: 5px;-webkit-border-radius: 5px;-khtml-border-radius: 5px;border-radius: 5px;background: -moz-linear-gradient(top, #ebecf0, #fff);background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#ebecf0), to(#fff));background: -o-linear-gradient(top, #ebecf0, #fff);left: -999em;}
.mega-menu .levels li ul ul {top:-23px;}
.mega-menu .levels li:hover ul ul, .mega-menu .levels li:hover ul ul ul {left: -999em;}
.mega-menu .levels li:hover ul, .mega-menu .levels li li:hover ul, .mega-menu .levels li li li:hover ul {left: 142px;}

/*bof contact form*/
#contact_form label, legend {font-size: 12px;font-family:Arial, Helvetica, sans-serif;}
#contact_form legend {margin-bottom:10px;}
#contact_form {display: block;margin-bottom:10px;}
#contact_form label {display: inline-block;float: left;height: 36px;line-height: 36px;width:80px;font-size:12px;}
#contact_form input, #contact_form textarea, #contact_form select {width:190px;padding: 5px;border:1px solid #0a0a0a;-moz-border-radius: 3px;-webkit-border-radius: 3px;-khtml-border-radius: 3px;border-radius: 3px;font-size:12px;}
#contact_form textarea {resize:none;}
#contact_form input:focus, textarea:focus, select:focus {border:1px solid #333;background-color:#fff;}
#contact_form input:hover, textarea:hover, select:hover {}
#contact_form .required {color:#c00;}
#contact_form .form_buttons {margin:4px 0 0 80px;}
#contact_form .special {display:none;}
#contact_form .error, #contact_form .sent {font-size:11px;padding:2px 5px 2px 5px;text-shadow:none;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius: 3px;}
#contact_form .error {background:#fbe5e2;border:1px solid #f2a197;color:#992213;}
#contact_form .sent {background:#e1f8c;border:1px solid #c6d880;color:#37620d;}
#contact_form input.button {width: 80px;margin-right:10px;cursor: pointer;background-color:#444;border:1px solid #0a0a0a;color:#fff;padding: 4px 7px 4px 7px;float:right;}
#contact_form input.button:hover {color:#eee;background-color:#222;border:1px solid #000;}

/*bof menu colors*/
.menu_red {background: #9a1212;background: -moz-linear-gradient(top, #9a1212, #640f0f);background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#9a1212), to(#640f0f));background: -o-linear-gradient(top, #9a1212, #640f0f);}
#mega-wrapper .menu_red {border: 1px solid #015b86;border-top: 1px solid #029feb;}
#wrapper_menu_full .menu_red {border-bottom: 1px solid #015b86;}
.menu_red li:hover div a {color:#444443;}
.menu_red li:hover div a:hover {color:#9a1213;text-decoration:underline;}
.menu_red li ul li a:hover {color:#9a1213;text-decoration:underline;}

/*bof customer service*/
.mega-payments{float:left;}
.mega-confidence{float:right;width:60%;}
.mega-about{float:left;width:70%;}
.mega-right{float:right;position: relative;margin-left: 10px;width:145px;}

Can you tell me which line I need to edit for Shop By Brand?

Thanks!

[DivaVocals]

You just need to ADD these classes to the stylesheet if they are not already there..

BTW, you don't always need to post the full test of any file (PHP or CSS), but if you do need to post code, you should enclose them using the forum code tags. (note how I edited your post using the code tags) Makes the code easier to read..

Your instructions:


Hide any of the Drop Downs

You can hide any of the drop down menus by going to includes/templates/abbington_mega/css/stylesheet_mega_menu.css

Add a display:none; to the class for the drop down you want to hide. So, for example, if you wanted to hide contact us you would add this to the bottom of the file:

.contactus-li{display:none;}

The classes for the drop down menus are as follows:

.quicklinks-li
.categories-li
.manufacturers-li
.aboutus-li
.information-li
.contactus-li
.customerservice-li

But cannot locate it in the stylesheet_mega_menu:

Here's the file:

#mega-wrapper {width: 980px;margin:0 auto;display:block;position: relative;z-index:9999;}
#mega-wrapper .mega-menu {list-style:none;width:940px;margin:30px auto 0px auto;height:43px;padding:0px 20px 0px 20px;-moz-border-radius: 5px;-webkit-border-radius: 5px;border-radius: 5px;}
.mega-menu li {float:left;text-align:center;position:relative;margin-right:20px;margin-top:6px;border:none;}
.mega-menu li.fullwidth {position: static !important;}
.mega-menu li:hover {background:#eee;border:1px solid #444;border-bottom:none;margin-right:19px;background: -moz-linear-gradient(top, #f4f4f4, #eee);background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#f4f4f4), to(#eee));background: -o-linear-gradient(top, #f4f4f4, #eee);-moz-border-radius: 5px 5px 0px 0px; -webkit-border-radius: 5px 5px 0px 0px;-khtml-border-radius: 5px 5px 0px 0px;border-radius: 5px 5px 0px 0px;}
.mega-menu li.nodrop:hover {background:#eee;border:1px solid #444;padding: 4px 10px 4px 9px;background: -moz-linear-gradient(top, #f4f4f4, #eee);background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#f4f4f4), to(#eee));background: -o-linear-gradient(top, #f4f4f4, #eee);-moz-border-radius: 5px;-webkit-border-radius: 5px;-khtml-border-radius: 5px;border-radius: 5px;}
.mega-menu li.nodrop:hover a {padding: 0px;}
.mega-menu li a {color: #eeeeed;outline:0;padding: 5px 10px 3px 10px;text-decoration:none;display:block;text-shadow: 1px 1px 1px #000001;}
.mega-menu li:hover a {color:#161616;text-shadow: none;position:relative;z-index:11;border-bottom:1px solid #eee;padding: 4px 9px 4px 9px;}
.mega-menu li:hover div a {display:inline;}
.mega-menu li .drop {padding-right:27px;}
.mega-menu li:hover .drop {padding-right:27px;}

/* bof right aligned menu item */
.mega-menu .right {float:right;right:0;margin-right:0px;}
.mega-menu li.right:hover {margin-right:-1px;}

/* bof drop down styles */
.mega-menu .dropdown_1column, .mega-menu .dropdown_2columns, .mega-menu .dropdown_3columns, .mega-menu .dropdown_4columns, .mega-menu .dropdown_5columns, .mega-menu .dropdown_customer_service,
.mega-menu .dropdown_aboutus, .mega-menu .dropdown_info, .mega-menu .dropdown_fullwidth {margin:4px auto;left:-999em;position:absolute;background:#fff;border:1px solid #444;padding:10px;text-align:left;-moz-border-radius: 0px 5px 5px 5px;-webkit-border-radius: 0px 5px 5px 5px;-khtml-border-radius: 0px 5px 5px 5px;border-radius: 0px 5px 5px 5px;background: -moz-linear-gradient(top, #ebecf0, #fff);background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#ebecf0), to(#fff));background: -o-linear-gradient(top, #ebecf0, #fff);}

.mega-menu .dropdown_1column {width: 145px;}
.mega-menu .dropdown_2columns {width: 300px;}
.mega-menu .dropdown_customer_service {width: 605px;}
.mega-menu .dropdown_aboutus {width: 585px;}
.mega-menu .dropdown_info {width: 470px;}

/* bof drop down on mouse hover left aligned */
.mega-menu li:hover .dropdown_1column, .mega-menu li:hover .dropdown_2columns, .mega-menu li:hover .dropdown_customer_service, .mega-menu li:hover .dropdown_aboutus, .mega-menu li:hover .dropdown_info {left:-1px;top:25px;}

/* bof drop down on mouse hover right aligned */
.mega-menu li .align_right {-moz-border-radius: 5px 0px 5px 5px;-webkit-border-radius: 5px 0px 5px 5px;border-radius: 5px 0px 5px 5px;}
.mega-menu li:hover .align_right {left:auto;right:-1px;top:25px;}

/* bof column sizes */
.mega-menu .col_1, .mega-menu .col_2 {display:inline;float: left;position: relative;margin-left: 10px;}
.mega-menu .col_1 {width:145px;}
.mega-menu .col_2 {width:300px;}
.mega-menu .col_cs {width:605px;}
.mega-menu .col_aboutus {width:585px;}
.mega-menu .col_3 {width:455px;}
.mega-menu .col_4 {width:610px;}
.mega-menu .col_5 {width:765px;}
.mega-menu .col_6 {width:920px;}

/* Use the firstcolumn class for the items that stick to the left edge of the dropdown */
.mega-menu .firstcolumn {margin-left: 0; /* Clearing margin & left */clear: left;}

/*bof content*/
.mega-menu p, .mega-menu ul, .mega-menu li, .mega-menu h2, .mega-menu h3 {font-size:14px;font-family:Arial, Helvetica, sans-serif;line-height:21px;text-align:left;}
.mega-menu p {font-size:12px;line-height:18px;margin:0;    margin-bottom:10px;text-shadow: 1px 1px 1px #fffffd;color:#444443;}
.mega-menu h2, .mega-menu h3 {text-shadow: 1px 1px 1px #fff;border-bottom:1px solid #888;margin-top:7px;color:#9a1213;}
.mega-menu h2 {font-weight:400;font-size:21px;margin-bottom:18px;padding-bottom:11px;}
.mega-menu h3 {font-weight:600;font-size:14px;margin-bottom:14px;padding-bottom:7px;}
.mega-menu li:hover div a {text-decoration:none;text-shadow:none;border:none;padding:0;}

/* bof images */
.mega-menu .imgshadow_light {background:#fff;padding:4px;border:1px solid #777;margin-top:5px;margin-left:20px;-moz-box-shadow:0px 0px 5px #666;-webkit-box-shadow:0px 0px 5px #666;box-shadow:0px 0px 5px #666;}

/* bof standard lists styles */
.mega-menu li ul {list-style:none;padding:0;margin:0 0 12px 0;}
.mega-menu li ul li {font-size:12px;line-height:24px;position:relative;text-shadow: 1px 1px 1px #fff;padding:0;margin:0;float:left;text-align:left;width:145px;}
.mega-menu li ul li a {padding:0;}
.mega-menu li ul li:hover {background:none;border:none;padding:0;margin:0;}

/* bof 2 levels drop down */
.mega-menu .levels, .mega-menu .levels ul {/* all lists */padding: 0;margin: 0;list-style: none;}
.mega-menu li:hover .levels a {display:block;}
.mega-menu .levels a {display: block;width: 10em;}
.mega-menu .levels a.parent, .mega-menu .levels a.parent:hover {}
.mega-menu .levels li {float: left;width:150px;}
.mega-menu .levels li ul {/* second-level lists */position: absolute;border:1px solid #666;background:#fff;top:-23px;margin:15px 0px 0px 4px;padding:6px;-moz-border-radius: 5px;-webkit-border-radius: 5px;-khtml-border-radius: 5px;border-radius: 5px;background: -moz-linear-gradient(top, #ebecf0, #fff);background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#ebecf0), to(#fff));background: -o-linear-gradient(top, #ebecf0, #fff);left: -999em;}
.mega-menu .levels li ul ul {top:-23px;}
.mega-menu .levels li:hover ul ul, .mega-menu .levels li:hover ul ul ul {left: -999em;}
.mega-menu .levels li:hover ul, .mega-menu .levels li li:hover ul, .mega-menu .levels li li li:hover ul {left: 142px;}

/*bof contact form*/
#contact_form label, legend {font-size: 12px;font-family:Arial, Helvetica, sans-serif;}
#contact_form legend {margin-bottom:10px;}
#contact_form {display: block;margin-bottom:10px;}
#contact_form label {display: inline-block;float: left;height: 36px;line-height: 36px;width:80px;font-size:12px;}
#contact_form input, #contact_form textarea, #contact_form select {width:190px;padding: 5px;border:1px solid #0a0a0a;-moz-border-radius: 3px;-webkit-border-radius: 3px;-khtml-border-radius: 3px;border-radius: 3px;font-size:12px;}   
#contact_form textarea {resize:none;}   
#contact_form input:focus, textarea:focus, select:focus {border:1px solid #333;background-color:#fff;}
#contact_form input:hover, textarea:hover, select:hover {}
#contact_form .required {color:#c00;}
#contact_form .form_buttons {margin:4px 0 0 80px;}
#contact_form .special {display:none;}
#contact_form .error, #contact_form .sent {font-size:11px;padding:2px 5px 2px 5px;text-shadow:none;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius: 3px;}
#contact_form .error {background:#fbe5e2;border:1px solid #f2a197;color:#992213;}
#contact_form .sent {background:#e1f8c;border:1px solid #c6d880;color:#37620d;}
#contact_form input.button {width: 80px;margin-right:10px;cursor: pointer;background-color:#444;border:1px solid #0a0a0a;color:#fff;padding: 4px 7px 4px 7px;float:right;}
#contact_form input.button:hover {color:#eee;background-color:#222;border:1px solid #000;}

/*bof menu colors*/
.menu_red {background: #9a1212;background: -moz-linear-gradient(top, #9a1212, #640f0f);background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#9a1212), to(#640f0f));background: -o-linear-gradient(top, #9a1212, #640f0f);}
#mega-wrapper .menu_red {border: 1px solid #015b86;border-top: 1px solid #029feb;}
#wrapper_menu_full .menu_red {border-bottom: 1px solid #015b86;}
.menu_red li:hover div a {color:#444443;}
.menu_red li:hover div a:hover {color:#9a1213;text-decoration:underline;}
.menu_red li ul li a:hover {color:#9a1213;text-decoration:underline;}

/*bof customer service*/
.mega-payments{float:left;}
.mega-confidence{float:right;width:60%;}
.mega-about{float:left;width:70%;}
.mega-right{float:right;position: relative;margin-left: 10px;width:145px;}

Can you tell me which line I need to edit for Shop By Brand?

Thanks!

[Zadris]

Thanks DivaVocals!

I did just that BUT .customerservice-li is still showing up.

I even tried .customer_service-li and that does not work.

Any suggestions?

[RixStix]

add this to the bottom of the file:

.contactus-li{display:none;}

Did you put it into the format suggested

.customerservice-li{display:none;}

[Zadris]

Absolutely! I even did a search on this thread and it seems others have the same problem with the

.customerservice-li{display:none;}

Maybe someone will post an answer. I am keeping my fingers crossed.

Thank you for your response.

add this to the bottom of the file:

.contactus-li{display:none;}

Did you put it into the format suggested

.customerservice-li{display:none;}

[picaflor-azul]

Absolutely! I even did a search on this thread and it seems others have the same problem with the

.customerservice-li{display:none;}

Maybe someone will post an answer. I am keeping my fingers crossed.

Thank you for your response.

If you post a link to your site I can take a look.

Thanks,

Anne