Sheffield Blue Template Support Thread

Hello everyone! I am happy to announde the release of this new template package.



See the live demo here:

Sheffield Blue Free Zen Cart Template Demo

Template Features:

• Super flexible design perfect for all types of ecommerce stores--the possibilites are endless!

• Fixed width 2 or 3 column display

• Matching button set included

• Matching icons

• Custom header with header search box, shopping cart total number of items, and dollar amount.

• Fully customizable header drop down mega menu with quick links, shop, brands, info (includes admin configurable ez pages), and contact us form.

• Home Page slideshow included

• Tabbed home page centerbox content for New Products, Featured Products, and Specials

• Add This social bookmarking added to all product pages (includes Facebook like button, Twitter Tweet Button, Pinterest and 300+ Sharing Services)

• Custom footer featuring a footer menu with contact information (telephone and link to contact us page), information, customer support, and useful links (ez pages), integrated, and optional, customizable links to payment options.

• Cross Browser tested using Firefox, IE9, IE8, IE7, Google Chrome, Opera, and Safari.

• W3C Valid XHTML and CSS

• Comes with the following modules installed: Column Layout Grid, About Us Page, Footer Menu , Column Divider Pro, Designer Monthly Boxes, Pure CSS Mega Menu, Social Networking Sidebar, Slides JS

• No changes to core files

• Detailed html readme file with written tutorials and screen shots and links to videos of the installation and customization steps

• Fully compatible with versions 1.3.8, 1.3.9, 1.5, 1.5.1. Would probably work with lower versions although it has not been tested.

Please post any questions or bugs here.

Thanks,

Anne

I thought I was finished with template searching, working with Brighton Pets and trying to tweak the colors. Then I saw this Sheffield Blue template.

Of course I'm going to download and test it out. Somehow it just looks so impressive, and virtually useable (for me, color-wise) out-of-the-box.

This template looks like a leap forward, raising the bar. Good job!

Steve

Hi Anne!

My wife likes Sheffield Blue even more than the Brighton Pets I've been working on, so may go with it on main site.

Right now I have it on a secondary/test site and see a bug:

On the top level category, the page shows the category page name:

http://www.promdressesforless.us/ready-to-ship-c-1.html

But on the subcategories, the subcategory name disappears:

http://www.promdressesforless.us/ready-to-ship-2-c-1_2.html

Your Sheffield Blue demo also has the same issue.

(I have Yorkshire Clean loaded on this site and I just noticed that it also has the same issue. I also have Hampshire Cammie and it does not have this issue.)

Other than that, installation has been very smooth and after setting column widths (180/185) it looks very nice!

I did note that on older/lower resolutions that the side social box cannot be seen, but personally would not consider that an issue right now.

Great job on this one. All Business I think is the classic first generation template and Abbington Mega a second generation of templates. Perhaps this one is the begining of a third generation?

SPH:

Hi Anne!

My wife likes Sheffield Blue even more than the Brighton Pets I've been working on, so may go with it on main site.

Right now I have it on a secondary/test site and see a bug:

On the top level category, the page shows the category page name:

http://www.promdressesforless.us/ready-to-ship-c-1.html

But on the subcategories, the subcategory name disappears:

http://www.promdressesforless.us/ready-to-ship-2-c-1_2.html

Your Sheffield Blue demo also has the same issue.

(I have Yorkshire Clean loaded on this site and I just noticed that it also has the same issue. I also have Hampshire Cammie and it does not have this issue.)

Other than that, installation has been very smooth and after setting column widths (180/185) it looks very nice!

I did note that on older/lower resolutions that the side social box cannot be seen, but personally would not consider that an issue right now.

Great job on this one. All Business I think is the classic first generation template and Abbington Mega a second generation of templates. Perhaps this one is the begining of a third generation?

Great catch! You can change the line in the stylesheet.css file from :

#productListHeading {margin-bottom:15px;color:#fff;font-weight:normal;padding-bottom:10px;}

to:

#productListHeading {margin-bottom:15px;color:#444;font-weight:normal;padding-bottom:10px;}

I'll include this fix in a future template package update ;-)

I have also released a new and improved updated version of the Social Networking Sidebar module as a stand alone module that you can drop in to use with any other template.

Thanks,

Anne

Hi Anne trying this out for a friend ( he looked my site I have your Abbington template and loved the style ) anyway the add to cart box width increases on the product pages in relation to the the description length i.e. the more characters in the title the wider the box is, any way to make the add to cart box width fixed. I'm using xampp to test it so can't post an example.
cheers Peter

discoverytdi:

Hi Anne trying this out for a friend ( he looked my site I have your Abbington template and loved the style ) anyway the add to cart box width increases on the product pages in relation to the the description length i.e. the more characters in the title the wider the box is, any way to make the add to cart box width fixed. I'm using xampp to test it so can't post an example.
cheers Peter

If you want a fixed width on the add to cart box you can add your width to this in the stylesheet.css file:

#cart{border:1px solid #e1e1e9;padding:20px;background:#f5f5f7;-moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px;}

Thanks,

Anne

I am trying to add a shadow around the main wrapper. I can get it around the header and content, but am having trouble getting it attached to the footer. Is there a special ID associated with the footer div that I would need to work with? Specifically, I am talking about the white box below the bottom nav bar.

Thanks. Awesome template!

RFree190:

I am trying to add a shadow around the main wrapper. I can get it around the header and content, but am having trouble getting it attached to the footer. Is there a special ID associated with the footer div that I would need to work with? Specifically, I am talking about the white box below the bottom nav bar.

Thanks. Awesome template!

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

Thanks,

Anne

Great template - Thanks!!

I'm just going through initial setup and it seems that the main content area is off-center a bit. This is causing left-hand text to ride over the main content. You can take a look at beadedlily.com/store/

Any ideas what I've done?

Thanks again

MeltDown:

Great template - Thanks!!

I'm just going through initial setup and it seems that the main content area is off-center a bit. This is causing left-hand text to ride over the main content. You can take a look at beadedlily.com/store/

Any ideas what I've done?

Thanks again

It looks like you have not followed the admin settings in the readme.html file.

Thanks,

Anne

You're absolutely right - I missed a setting in my rush to glory ;)

Thanks

MeltDown:

You're absolutely right - I missed a setting in my rush to glory ;)

Thanks

Great! I am happy that you figured it out.

Thanks,

Anne

Hi Anne

I was getting an error on my cart in the head section saying

count_contents();?> item(s) - format($_SESSION['cart']->show_total());?> |
Checkout

I tracked the bug to the includes\templates\sheffield_blue\common\tpl_header.php

at line 95 it has the following

[php]
<li><a href="<?php echo zen_href_link(FILENAME_SHOPPING_CART, '', 'NONSSL'); ?>"><img src="<?php echo $template->get_template_dir('',DIR_WS_TEMPLATE, $current_page_base,'images').'/'.HEADER_ICON_CART ?>" alt="cart icon" class="cart-icon" /><? echo $_SESSION['cart']->count_contents();?> item(s) - <? echo $currencies->format($_SESSION['cart']->show_total());?></a> | </li>
[/php]
which uses short tags on the cart and currencies echo statements changing them to full tags like below fixes the issue for me.
[php]
<li><a href="<?php echo zen_href_link(FILENAME_SHOPPING_CART, '', 'NONSSL'); ?>"><img src="<?php echo $template->get_template_dir('',DIR_WS_TEMPLATE, $current_page_base,'images').'/'.HEADER_ICON_CART ?>" alt="cart icon" class="cart-icon" /><?php echo $_SESSION['cart']->count_contents();?> item(s) - <?php echo $currencies->format($_SESSION['cart']->show_total());?></a> | </li>
[/php]

nigelt74:

Hi Anne

I was getting an error on my cart in the head section saying



I tracked the bug to the includes\templates\sheffield_blue\common\tpl_header.php

at line 95 it has the following

[php]
<li><a href="<?php echo zen_href_link(FILENAME_SHOPPING_CART, '', 'NONSSL'); ?>"><img src="<?php echo $template->get_template_dir('',DIR_WS_TEMPLATE, $current_page_base,'images').'/'.HEADER_ICON_CART ?>" alt="cart icon" class="cart-icon" /><? echo $_SESSION['cart']->count_contents();?> item(s) - <? echo $currencies->format($_SESSION['cart']->show_total());?></a> | </li>
[/php]
which uses short tags on the cart and currencies echo statements changing them to full tags like below fixes the issue for me.
[php]
<li><a href="<?php echo zen_href_link(FILENAME_SHOPPING_CART, '', 'NONSSL'); ?>"><img src="<?php echo $template->get_template_dir('',DIR_WS_TEMPLATE, $current_page_base,'images').'/'.HEADER_ICON_CART ?>" alt="cart icon" class="cart-icon" /><?php echo $_SESSION['cart']->count_contents();?> item(s) - <?php echo $currencies->format($_SESSION['cart']->show_total());?></a> | </li>
[/php]

Darn! I thought that I had fixed that bug. I'll add it to the list for a future update.

Thanks,

Anne

Hello again

if you go to
includes/languages/english/sheffield_blue/header.php
and set

define('HEADER_SALES_TEXT', 'A Free Template by www.picaflor-azul.com.');

to

define('HEADER_SALES_TEXT', '');

The layout breaks

The coding issue is here
includes\templates\sheffield_blue\common\tpl_header.php

[php]
<div id="taglineWrapper">
<?php
if (HEADER_SALES_TEXT != '') {
?>
<div id="tagline"><?php echo HEADER_SALES_TEXT;?></div></div>
<?php
}
?>
[/php]

The second </div> in that statement is the one that should close the taglineWrapper div, but if you have no tagline the ending </div> won't be actioned and your layout breaks

so you need to change it to
[php]
<?php
if (HEADER_SALES_TEXT != '') {
?> <div id="taglineWrapper">

<div id="tagline"><?php echo HEADER_SALES_TEXT;?></div></div>
<?php
}
?>
[/php]

But that still doesn't fix the layout issue because this
[php]
<!--bof-branding display-->
<div id="logoWrapper">
<div id="logo"><?php echo '<a href="' . HTTP_SERVER . DIR_WS_CATALOG . '">' . zen_image($template->get_template_dir(HEADER_LOGO_IMAGE, DIR_WS_TEMPLATE, $current_page_base,'images'). '/' . HEADER_LOGO_IMAGE, HEADER_ALT_TEXT) . '</a>'; ?>
<?php if (HEADER_SALES_TEXT != '' || (SHOW_BANNERS_GROUP_SET2 != '' && $banner = zen_banner_exists('dynamic', SHOW_BANNERS_GROUP_SET2))) { ?>
<div id="taglineWrapper">
<?php
if (HEADER_SALES_TEXT != '') {
?>
<div id="tagline"><?php echo HEADER_SALES_TEXT;?></div></div>
<?php
}
?>
<?php
if (SHOW_BANNERS_GROUP_SET2 != '' && $banner = zen_banner_exists('dynamic', SHOW_BANNERS_GROUP_SET2)) {
if ($banner->RecordCount() > 0) {
?>
<div id="bannerTwo" class="banners"><?php echo zen_display_banner('static', $banner);?></div>
<?php
}
}
?>
</div> <!-- This div here -->

<?php } // no HEADER_SALES_TEXT or SHOW_BANNERS_GROUP_SET2 ?>

<div id="header-right">

[/php]
The closing </div> for the logo div is within this statement scope

[php]
<?php if (HEADER_SALES_TEXT != '' || (SHOW_BANNERS_GROUP_SET2 != '' && $banner = zen_banner_exists('dynamic', SHOW_BANNERS_GROUP_SET2))) { ?>
[/php]

moving it out like below fixes the problem for me

[php]
<!--bof-branding display-->
<div id="logoWrapper">
<div id="logo"><?php echo '<a href="' . HTTP_SERVER . DIR_WS_CATALOG . '">' . zen_image($template->get_template_dir(HEADER_LOGO_IMAGE, DIR_WS_TEMPLATE, $current_page_base,'images'). '/' . HEADER_LOGO_IMAGE, HEADER_ALT_TEXT) . '</a>'; ?>
<?php if (HEADER_SALES_TEXT != '' || (SHOW_BANNERS_GROUP_SET2 != '' && $banner = zen_banner_exists('dynamic', SHOW_BANNERS_GROUP_SET2))) { ?>

<?php
if (HEADER_SALES_TEXT != '') {
?> <div id="taglineWrapper">
<div id="tagline"><?php echo HEADER_SALES_TEXT;?></div></div>
<?php
}
?>
<?php
if (SHOW_BANNERS_GROUP_SET2 != '' && $banner = zen_banner_exists('dynamic', SHOW_BANNERS_GROUP_SET2)) {
if ($banner->RecordCount() > 0) {
?>
<div id="bannerTwo" class="banners"><?php echo zen_display_banner('static', $banner);?></div>
<?php
}
}
?>


<?php } // no HEADER_SALES_TEXT or SHOW_BANNERS_GROUP_SET2 ?>
</div> <!-- Moves to here here -->
<div id="header-right">
<!--bof-navigation display-->

[/php]

nigelt74:

Hello again

if you go to
includes/languages/english/sheffield_blue/header.php
and set

define('HEADER_SALES_TEXT', 'A Free Template by www.picaflor-azul.com.');

to

define('HEADER_SALES_TEXT', '');

The layout breaks

The coding issue is here
includes\templates\sheffield_blue\common\tpl_header.php

[php]
<div id="taglineWrapper">
<?php
if (HEADER_SALES_TEXT != '') {
?>
<div id="tagline"><?php echo HEADER_SALES_TEXT;?></div></div>
<?php
}
?>
[/php]

The second </div> in that statement is the one that should close the taglineWrapper div, but if you have no tagline the ending </div> won't be actioned and your layout breaks

so you need to change it to
[php]
<?php
if (HEADER_SALES_TEXT != '') {
?> <div id="taglineWrapper">

<div id="tagline"><?php echo HEADER_SALES_TEXT;?></div></div>
<?php
}
?>
[/php]

But that still doesn't fix the layout issue because this
[php]
<!--bof-branding display-->
<div id="logoWrapper">
<div id="logo"><?php echo '<a href="' . HTTP_SERVER . DIR_WS_CATALOG . '">' . zen_image($template->get_template_dir(HEADER_LOGO_IMAGE, DIR_WS_TEMPLATE, $current_page_base,'images'). '/' . HEADER_LOGO_IMAGE, HEADER_ALT_TEXT) . '</a>'; ?>
<?php if (HEADER_SALES_TEXT != '' || (SHOW_BANNERS_GROUP_SET2 != '' && $banner = zen_banner_exists('dynamic', SHOW_BANNERS_GROUP_SET2))) { ?>
<div id="taglineWrapper">
<?php
if (HEADER_SALES_TEXT != '') {
?>
<div id="tagline"><?php echo HEADER_SALES_TEXT;?></div></div>
<?php
}
?>
<?php
if (SHOW_BANNERS_GROUP_SET2 != '' && $banner = zen_banner_exists('dynamic', SHOW_BANNERS_GROUP_SET2)) {
if ($banner->RecordCount() > 0) {
?>
<div id="bannerTwo" class="banners"><?php echo zen_display_banner('static', $banner);?></div>
<?php
}
}
?>
</div> <!-- This div here -->

<?php } // no HEADER_SALES_TEXT or SHOW_BANNERS_GROUP_SET2 ?>

<div id="header-right">

[/php]
The closing </div> for the logo div is within this statement scope

[php]
<?php if (HEADER_SALES_TEXT != '' || (SHOW_BANNERS_GROUP_SET2 != '' && $banner = zen_banner_exists('dynamic', SHOW_BANNERS_GROUP_SET2))) { ?>
[/php]

moving it out like below fixes the problem for me

[php]
<!--bof-branding display-->
<div id="logoWrapper">
<div id="logo"><?php echo '<a href="' . HTTP_SERVER . DIR_WS_CATALOG . '">' . zen_image($template->get_template_dir(HEADER_LOGO_IMAGE, DIR_WS_TEMPLATE, $current_page_base,'images'). '/' . HEADER_LOGO_IMAGE, HEADER_ALT_TEXT) . '</a>'; ?>
<?php if (HEADER_SALES_TEXT != '' || (SHOW_BANNERS_GROUP_SET2 != '' && $banner = zen_banner_exists('dynamic', SHOW_BANNERS_GROUP_SET2))) { ?>

<?php
if (HEADER_SALES_TEXT != '') {
?> <div id="taglineWrapper">
<div id="tagline"><?php echo HEADER_SALES_TEXT;?></div></div>
<?php
}
?>
<?php
if (SHOW_BANNERS_GROUP_SET2 != '' && $banner = zen_banner_exists('dynamic', SHOW_BANNERS_GROUP_SET2)) {
if ($banner->RecordCount() > 0) {
?>
<div id="bannerTwo" class="banners"><?php echo zen_display_banner('static', $banner);?></div>
<?php
}
}
?>


<?php } // no HEADER_SALES_TEXT or SHOW_BANNERS_GROUP_SET2 ?>
</div> <!-- Moves to here here -->
<div id="header-right">
<!--bof-navigation display-->

[/php]

If you don't want to use the tagline, the best and simplest way is to just add a display:none; in the stylesheet to #tagline.

The template is coded to be used with all of the elements shown in the demo. If you look closely at the code you will see that all div's and /divs do match up. If you want to disable/turn off various elements in the template, the best way to do it is to use css. It prevents having to do a lot of re-coding.

Thanks,

Anne

hi everyone

how can i remove the social bar on this template
thanks

hoang:

hi everyone

how can i remove the social bar on this template
thanks

Add this to the bottom of your stylesheet.css file:

.sidebar{display:none;}

Thanks,

Anne

Hi Anne!
Using another of your wonderful templates!
Quick question:
In the Read-me for this template, regarding the Social Sidebar you state:
"In your favorite plain text editor open includes/templates/YOUR_TEMPLATE/css/stylesheet_social_header.css"

At the bottom of the file add display:none; to the class for each icon you don't want to display. So, for example if you don't want to display the facebook icon you would add:

.facebook{display:none;}

Then you display the class as:

.facebook-sh 

I want to remove YouTube and the rest below that.
So I tried:

.youtube{display:none;}

and

.youtube-sh{display:none;}

and neither worked.

You refer above to the "stylesheet_social_header.css", but this template uses "stylesheet_social_sidebar.css"
So I assumes the "sh" was incorrectly referring to style header, so I replaced the "sh" with "ss" for social sidebar like this:

.youtube-ss{display:none;}

That didn't work either :(

Can you tell me the correct coding to use to remove unneeded social icons?

Thanks a million!
Kathleen

Bewitching:

So I assumes the "sh" was incorrectly referring to style header,

I meant to say "Social Header"

OOPS :)