Dover Fine Responsive Template

[Potterpoole]

I am having trouble with display of ezpages table of contents. The prev and next buttons aren't working properly. the table of contents only lists one page but there are two and the prev continue and next buttons overlap the table of contents box.


http://s a n d s t o n e h i l l s p o t t e r y.com/products_shpw/index.php?main_page=page&id=1&chapter=1

[AndyJordaan]

Hi Anne,

I have a 1.5.3 Zencart and have customised the Dover fine a reasonable amount, as in, I have switched off the slideshow (need to put text onto the homepage) and fiddled with the css to get what I need.

I noticed that my bounce rate was a bit high and finally tracked it down to my product images showing above the Flyout menu during navigation, this is not the case with the sub and sub-sub categories who all behave fine.

I have image handler 4 installed

I am reasonably sure that I have to adjust the " z-index " to marry with image handler but I am not having much success here . . .

Do you have any of your magic advice to throw my way ?

Andy

[picaflor-azul]

Hi Anne,

I have a 1.5.3 Zencart and have customised the Dover fine a reasonable amount, as in, I have switched off the slideshow (need to put text onto the homepage) and fiddled with the css to get what I need.

I noticed that my bounce rate was a bit high and finally tracked it down to my product images showing above the Flyout menu during navigation, this is not the case with the sub and sub-sub categories who all behave fine.

I have image handler 4 installed

I am reasonably sure that I have to adjust the " z-index " to marry with image handler but I am not having much success here . . .

Do you have any of your magic advice to throw my way ?

Andy

If you post a link to the page with the problem I can take a look.

Thanks,

Anne

[simon1066]

There are several files involved in the change to make this work. The first is in the supersized.3.2.7.min.js script which is more than I can show here. Best to PM me with an email address and I can send you the updated script.

The second file that needs changed is the /includes/templates/your_template_name/common/tpl_main_page.php

find where the supersized script is being loaded (about line 100) and change the code that follows to match the following:

<script type="text/javascript" src="includes/templates/dover_fine/jscript/jquery.easing.min.js"></script>
		<script type="text/javascript" src="includes/templates/dover_fine/jscript/supersized.3.2.7.min.js"></script>
		<script type="text/javascript" src="includes/templates/dover_fine/jscript/supersized.shutter.min.js"></script>
		
		<script type="text/javascript">
			jQuery(function($){
			$.supersized({
	
					// Functionality
					slide_interval          :   7000,		// Length between transitions
					transition              :   1, 		// 0-None, 1-Fade, 2-Slide Top, 3-Slide Right, 4-Slide Bottom, 5-Slide Left, 6-Carousel Right, 7-Carousel Left
					transition_speed		:	1000,		// Speed of transition
					vertical_center: 0,
					new_window: 0,
			      autoplay:1,
					// Components							
					slide_links: 'blank',	// Individual links for each slide (Options: false, 'num', 'name', 'blank')
					slides 	:  	[// Slideshow Images
										
<?php
                $banner = $db->Execute("SELECT banners_id, banners_title, banners_image, banners_html_text, banners_open_new_windows, banners_url FROM " . TABLE_BANNERS . " WHERE status = 1 AND banners_group = 'homepageslide' order by rand()");
                
                if ($banner->RecordCount() > 0) {

 while (!$banner->EOF) {
	$newwindow = ($banner->fields['banners_open_new_windows']) ? "', nwin : '1" : '';
	$bannerurl = ($banner->fields['banners_url']) ? "', url : '" . zen_href_link(FILENAME_REDIRECT, 'action=banner&goto=' . $banner->fields['banners_id']) : '';
echo "{image : '" . HTTP_SERVER . DIR_WS_CATALOG . 'images/' . $banner->fields['banners_image'] . $bannerurl . $newwindow . "'},";

zen_update_banner_display_count($banner->fields['banners_id']);
                                $banner->MoveNext();

}

It's important to add the parameter 'new_window: 0,' to the script options. This is what tells the script to not open a new window. You will notice in the code above in the loop that sets up the slides a new parameter that is being passed to the script called 'nwin'. This is being set by looking at the setting of the banner for open in a new window. This parameter then overrides the script setting to either open in a new window, or open in the same window based on the setting in the banner.

Hope that makes sense. If not, let me know.

Thank you for this, who knew a seemingly small thing could be so tricky. I'll PM you.

[AndyJordaan]

Hi Anne,
Thanks for the offer,it was most appreciated however I think that the problem was not related to dover _fine.

That said its was fixed using the hints drawn from this thread. .

I added the z-index here . . . ( about line 215 on the stylesheet css )
#categories .sideBoxContent ul li ul li {display:none;min-width:150px;position:relative;z-index:100;}

Again thanks for all your help

Andy

[simon1066]

I'm having difficulty in isolating the cause of this home page layout issue on the demo site for this template.

Using the link http://www.zenlyzen.com/dover/index...._mode=isTablet between about 820px to 910px in portrait aspect on a desktop pc, the top of the home page layout is a bit screwy, best shown in this screenshot



I get this in Safari, FF, IE and Chrome. Additionally, from the screenshot you can see the distorted logo, only in Safari, that I also need help with.

[simon1066]

from the screenshot you can see the distorted logo, only in Safari, that I also need help with.

I've narrowed this down to possibly the stylesheet occurences of

#logo img{width:60%;height:60%;}

Although I don't know why Safari doesn't like it.

[simon1066]

Changing it to

#logo img{width:60%;height:auto;}

Seems to work

[picaflor-azul]

I'm having difficulty in isolating the cause of this home page layout issue on the demo site for this template.

Using the link http://www.zenlyzen.com/dover/index...._mode=isTablet between about 820px to 910px in portrait aspect on a desktop pc, the top of the home page layout is a bit screwy, best shown in this screenshot



I get this in Safari, FF, IE and Chrome. Additionally, from the screenshot you can see the distorted logo, only in Safari, that I also need help with.

This is not a bug or a problem in the template. When you use the isTablet url on a desktop you are seeing what will be shown to tablet users. Use this url in an emulator like that at mobiletest.me using a tablet to see how the template will render on portrait and landscape tablets. You can not use the isTablet url on a desktop and then just make your browser larger and smaller. If you do this you will see a lot of "in between" screen resolutions that do not apply to any device.

Thanks,

Anne

[simon1066]

Now I think a bit more on it, of course you're right. I find it so easy to get caught out by layout issues when designing on a desktop and juggling the mobile, tablet and default stylesheets. I'll try to bear this in mind.