Solved

Zen cart header and head tag

Posted on 2010-08-25
9
955 Views
Last Modified: 2013-11-18
HI, On this site:
http:// the dessert lovers dot com

I'm using a new installation of zen cart. The client wants the top row of dessert pictures to scroll endlessly. I'm not sure I agree with her, but I need to show it to her.

I can find the javascript to do this, but I need to know where to to access the code for the header, both head tag and then I would need to replace logo.gif with the javascript. I may need more help than this because I am not proficient in php and I don't want to break anything. Thanks!
0
Comment
Question by:mel200
  • 5
  • 4
9 Comments
 
LVL 6

Expert Comment

by:Silhouette
ID: 33529317
Hi,

The code you are looking for is inside tpl_header.php which for the template you are using should be in the following directory:
includes\templates\apple_zen\common\tpl_header.php

The exact code you are looking for is wrapped by <div id="logo">
0
 

Author Comment

by:mel200
ID: 33531645
OK, thanks! Will work with that later today and close this if I don't need any more help.
0
 

Author Comment

by:mel200
ID: 33533268
Ok, I didn't think it would be that easy. I put this in between the head tags, so this:<script type="text/javascript">

/***********************************************
* Conveyor belt slideshow script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/


//Specify the slider's width (in pixels)
var sliderwidth="300px"
//Specify the slider's height
var sliderheight="150px"
//Specify the slider's slide speed (larger is faster 1-10)
var slidespeed=3
//configure background color:
slidebgcolor="#EAEAEA"

//Specify the slider's images
var leftrightslide=new Array()
var finalslide=''
leftrightslide[0]='<a href="#"><img src="/images/cupcake1.jpg" border=1></a>'
leftrightslide[1]='<a href="#"><img src="/images/cupcake2.jpg" border=1></a>'
leftrightslide[2]='<a href="#"><img src="/images/cupcake3.jpg" border=1></a>'
leftrightslide[3]='<a href="#"><img src="/images/cupcake4.jpg" border=1></a>'
leftrightslide[4]='<a href="#"><img src="/images/cupcake5.jpg" border=1></a>'

//Specify gap between each image (use HTML):
var imagegap=" "

//Specify pixels gap between each slideshow rotation (use integer):
var slideshowgap=5


////NO NEED TO EDIT BELOW THIS LINE////////////

var copyspeed=slidespeed
leftrightslide='<nobr>'+leftrightslide.join(imagegap)+'</nobr>'
var iedom=document.all||document.getElementById
if (iedom)
document.write('<span id="temp" style="visibility:hidden;position:absolute;top:-100px;left:-9000px">'+leftrightslide+'</span>')
var actualwidth=''
var cross_slide, ns_slide

function fillup(){
if (iedom){
cross_slide=document.getElementById? document.getElementById("test2") : document.all.test2
cross_slide2=document.getElementById? document.getElementById("test3") : document.all.test3
cross_slide.innerHTML=cross_slide2.innerHTML=leftrightslide
actualwidth=document.all? cross_slide.offsetWidth : document.getElementById("temp").offsetWidth
cross_slide2.style.left=actualwidth+slideshowgap+"px"
}
else if (document.layers){
ns_slide=document.ns_slidemenu.document.ns_slidemenu2
ns_slide2=document.ns_slidemenu.document.ns_slidemenu3
ns_slide.document.write(leftrightslide)
ns_slide.document.close()
actualwidth=ns_slide.document.width
ns_slide2.left=actualwidth+slideshowgap
ns_slide2.document.write(leftrightslide)
ns_slide2.document.close()
}
lefttime=setInterval("slideleft()",30)
}
window.onload=fillup

function slideleft(){
if (iedom){
if (parseInt(cross_slide.style.left)>(actualwidth*(-1)+8))
cross_slide.style.left=parseInt(cross_slide.style.left)-copyspeed+"px"
else
cross_slide.style.left=parseInt(cross_slide2.style.left)+actualwidth+slideshowgap+"px"

if (parseInt(cross_slide2.style.left)>(actualwidth*(-1)+8))
cross_slide2.style.left=parseInt(cross_slide2.style.left)-copyspeed+"px"
else
cross_slide2.style.left=parseInt(cross_slide.style.left)+actualwidth+slideshowgap+"px"

}
else if (document.layers){
if (ns_slide.left>(actualwidth*(-1)+8))
ns_slide.left-=copyspeed
else
ns_slide.left=ns_slide2.left+actualwidth+slideshowgap

if (ns_slide2.left>(actualwidth*(-1)+8))
ns_slide2.left-=copyspeed
else
ns_slide2.left=ns_slide.left+actualwidth+slideshowgap
}
}


if (iedom||document.layers){
with (document){
document.write('<table border="0" cellspacing="0" cellpadding="0"><td>')
if (iedom){
write('<div style="position:relative;width:'+sliderwidth+';height:'+sliderheight+';overflow:hidden">')
write('<div style="position:absolute;width:'+sliderwidth+';height:'+sliderheight+';background-color:'+slidebgcolor+'" onMouseover="copyspeed=0" onMouseout="copyspeed=slidespeed">')
write('<div id="test2" style="position:absolute;left:0px;top:0px"></div>')
write('<div id="test3" style="position:absolute;left:-1000px;top:0px"></div>')
write('</div></div>')
}
else if (document.layers){
write('<ilayer width='+sliderwidth+' height='+sliderheight+' name="ns_slidemenu" bgColor='+slidebgcolor+'>')
write('<layer name="ns_slidemenu2" left=0 top=0 onMouseover="copyspeed=0" onMouseout="copyspeed=slidespeed"></layer>')
write('<layer name="ns_slidemenu3" left=0 top=0 onMouseover="copyspeed=0" onMouseout="copyspeed=slidespeed"></layer>')
write('</ilayer>')
}
document.write('</td></table>')
}
}
</script>

Replaced:
<?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, HEADER_LOGO_WIDTH, HEADER_LOGO_HEIGHT) . '</a>'; ?></div>
            <?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>
              <?php
              }
?>
              <?php
              if (SHOW_BANNERS_GROUP_SET2 != '' && $banner = zen_banner_exists('dynamic', SHOW_BANNERS_GROUP_SET2)) {
                if ($banner->RecordCount() > 0) {
?>
              <br class="clearBoth" /><div id="bannerTwo" class="banners"><?php echo zen_display_banner('static', $banner);?></div>
              <?php
                }
              }
?>

And the page became blank. Could you provide a little more direction? Thanks- I need to study php.
0
3 Use Cases for Connected Systems

Our Dev teams are like yours. They’re continually cranking out code for new features/bugs fixes, testing, deploying, testing some more, responding to production monitoring events and more. It’s complex. So, we thought you’d like to see what’s working for us.

 
LVL 6

Expert Comment

by:Silhouette
ID: 33534462
The reason why it displayed is because there was a mismatch in the }
I checked again and you actually need to replace the all the code in the first attached code block which is everything wrapped by <div id="logoWrapper">
I have attached a correct copy of the header file which should work

<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, HEADER_LOGO_WIDTH, HEADER_LOGO_HEIGHT) . '</a>'; ?></div>
            <?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>
              <?php
              }
?>
              <?php
              if (SHOW_BANNERS_GROUP_SET2 != '' && $banner = zen_banner_exists('dynamic', SHOW_BANNERS_GROUP_SET2)) {
                if ($banner->RecordCount() > 0) {
?>
              <br class="clearBoth" /><div id="bannerTwo" class="banners"><?php echo zen_display_banner('static', $banner);?></div>
              <?php
                }
              }
?>
            </div>
            <?php } // no HEADER_SALES_TEXT or SHOW_BANNERS_GROUP_SET2 ?>

Open in new window

tpl-header.php
0
 

Author Comment

by:mel200
ID: 33534609
Hi- The tpl-header you supplied doesn't seem to be any different than the old one. I tried copying all the code you supplied there and replacing it with the java, but it also provides a blank page. Maybe I'm misunderstanding?
0
 
LVL 6

Expert Comment

by:Silhouette
ID: 33534803
The tpl-header file I uploaded already contains the javascript that you listed above, you should only have to replace your  tpl-header  file with that one to get it to work.
0
 

Author Comment

by:mel200
ID: 33535060
Oh, I'm sorry! I didn't notice that it was tpl-header instead of tpl_header. It's working! Can you also tell me how to make it either go the full width, or to just be centered above the navigation? Thanks so much!
0
 
LVL 6

Accepted Solution

by:
Silhouette earned 500 total points
ID: 33535505
To get it to center with the navigation you need to change the css for #logoWrapperOuter back to width:70em;

The problem with full width is that the javascript only excepts pixels and em values not percentages you can try setting this

var sliderwidth="2000px"

if someone for some reason makes their browser bigger than 2000px it will look strange.
0
 

Author Closing Comment

by:mel200
ID: 33535699
Excellent answers, thanks!!
0

Featured Post

Master Your Team's Linux and Cloud Stack!

The average business loses $13.5M per year to ineffective training (per 1,000 employees). Keep ahead of the competition and combine in-person quality with online cost and flexibility by training with Linux Academy.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Learn by example how to specify CSS selectors for Selenium WebDriver test automation software.
Because your company can’t afford for you to make SEO mistakes, you’ll want to ensure you’re taking the right steps each and every time you post a new piece of content. This list of optimization do’s and don’ts can help you become an SEO wizard.
This video teaches users how to migrate an existing Wordpress website to a new domain.
The viewer will learn how to count occurrences of each item in an array.

775 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question