Printable View
I am using a custom template but I don't think that matters. On the /includes/templates/mytemplate/common/tpl_header.php I am trying to add the FB social media coding.
Here it is
<iframe src="blah blah blah code"></iframe>
Can someone help me. The problem is that it is not centered above the logo. I thought using <center></center> would help but it did not. It still places the iframe to the left.
Please see attached.
Give a link as we can hot suggest from a pic
Like
zen-cart dot com
http://www.zenflavor.com/demo9/
<?php
/**
* Common Template - tpl_header.php
*
* this file can be copied to /templates/your_template_dir/pagename<br />
* example: to override the privacy page<br />
* make a directory /templates/my_template/privacy<br />
* copy /templates/templates_defaults/common/tpl_footer.php to /templates/my_template/privacy/tpl_header.php<br />
* to override the global settings and turn off the footer un-comment the following line:<br />
* <br />
* $flag_disable_header = true;<br />
*
* @package templateSystem
* @copyright Copyright 2003-2006 Zen Cart Development Team
* @copyright Portions Copyright 2003 osCommerce
* @license http://www.zen-cart.com/license/2_0.txt GNU Public License V2.0
* @version $Id: tpl_header.php 3392 2006-04-08 15:17:37Z birdbrain $
*/
?>
<?php
// Display all header alerts via messageStack:
if ($messageStack->size('header') > 0) {
echo $messageStack->output('header');
}
if (isset($_GET['error_message']) && zen_not_null($_GET['error_message'])) {
echo htmlspecialchars(urldecode($_GET['error_message']));
}
if (isset($_GET['info_message']) && zen_not_null($_GET['info_message'])) {
echo htmlspecialchars($_GET['info_message']);
} else {
}
?>
<center><iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2F&width=960&colorscheme= light&connections=500&stream=false&header=false&height=160" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:1280px; height:160px;" allowTransparency="true"></iframe></center>
<!--bof-header logo and navigation display-->
<?php
if (!isset($flag_disable_header) || !$flag_disable_header) {
?>
<div id="headerWrapper">
<div id="logotop">
<!--bof-navigation display-->
<div id="navMainWrapper">
<div id="navMain">
<ul class="forward">
<li><?php echo '<a href="' . HTTP_SERVER . DIR_WS_CATALOG . '">'; ?><?php echo HEADER_TITLE_CATALOG; ?></a></li>
<?php if ($_SESSION['customer_id']) { ?>
<li><a href="<?php echo zen_href_link(FILENAME_LOGOFF, '', 'SSL'); ?>"><?php echo HEADER_TITLE_LOGOFF; ?></a></li>
<li><a href="<?php echo zen_href_link(FILENAME_ACCOUNT, '', 'SSL'); ?>"><?php echo HEADER_TITLE_MY_ACCOUNT; ?></a></li>
<?php
} else {
if (STORE_STATUS == '0') {
?>
<li><a href="<?php echo zen_href_link(FILENAME_LOGIN, '', 'SSL'); ?>"><?php echo HEADER_TITLE_LOGIN; ?></a></li>
<?php } } ?>
<?php if ($_SESSION['cart']->count_contents() != 0) { ?>
<li><a href="<?php echo zen_href_link(FILENAME_SHOPPING_CART, '', 'NONSSL'); ?>"><?php echo HEADER_TITLE_CART_CONTENTS; ?></a></li>
<li><a href="<?php echo zen_href_link(FILENAME_CHECKOUT_SHIPPING, '', 'SSL'); ?>"><?php echo HEADER_TITLE_CHECKOUT; ?></a></li>
<?php }?>
</ul>
</div>
<!-- <br class="clearBoth" /> -->
</div>
<!--eof-navigation display-->
<!-- cart icon -->
<div id="cart_top"><a href="<?php echo HTTP_SERVER . DIR_WS_CATALOG ?>index.php?main_page=shopping_cart"><?php echo BOX_HEADING_SHOPPING_CART; ?></a><br /><?php echo PRODUCTS_ORDER_QTY_TEXT_IN_CART; ?><?php echo $_SESSION['cart']->count_contents();?> - <?php echo $currencies->format($_SESSION['cart']->show_total());?></div>
<!-- cart icon -->
<a href="<?php echo HTTP_SERVER . DIR_WS_CATALOG ?>"><?php echo zen_image(DIR_WS_TEMPLATE.'images/logo.png'); ?></a>
</div> <!-- logotop -->
<div id="topmenubar">
<div id="topmenubarinner">
<table border="0" width="100%" cellpadding="0" style="border-collapse: collapse" id="tbltopmenu">
<tr>
<td width="34px"><a href="<?php echo HTTP_SERVER . DIR_WS_CATALOG ?>"><?php echo zen_image(DIR_WS_TEMPLATE.'images/cor-left.gif'); ?></a></td>
<td style="vertical-align:middle">
<!--bof-header ezpage links-->
<?php if (EZPAGES_STATUS_HEADER == '1' or (EZPAGES_STATUS_HEADER == '2' and (strstr(EXCLUDE_ADMIN_IP_FOR_MAINTENANCE, $_SERVER['REMOTE_ADDR'])))) { ?>
<?php require($template->get_template_dir('tpl_ezpages_bar_header.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_ezpages_bar_header.php'); ?>
<?php } ?>
<!--eof-header ezpage links-->
</td>
</tr>
</table></div><!-- topmenubarinner --></div><!-- topmenubar -->
<div id="navCurrenciesWrapper">
<div id="navCurrenciesWrapperInner">
<div class="nav_language">
<?php echo BOX_HEADING_LANGUAGES ?>
<?php if (!isset($lng) || (isset($lng) && !is_object($lng))) {
$lng = new language;
}
reset($lng->catalog_languages);
while (list($key, $value) = each($lng->catalog_languages)) {
echo '<a href="' . zen_href_link($_GET['main_page'], zen_get_all_get_params(array('language', 'currency')) . 'language=' . $key, $request_type) . '">' . zen_image(DIR_WS_LANGUAGES.$value['directory'].'/images/'.$value['image'], $value['name'], '', '', ' style="vertical-align:middle;"') . '</a> ';
}
?>
</div> <!-- nav_language -->
<div class="nav_currencies">
<?php echo zen_draw_form('currencies', zen_href_link(basename(ereg_replace('.php','', $PHP_SELF)), '', $request_type, false), 'get')?>
<?php
if (isset($currencies) && is_object($currencies)) {
reset($currencies->currencies);
$currencies_array = array();
while (list($key, $value) = each($currencies->currencies)) {
$currencies_array[] = array('id' => $key, 'text' => $value['title']);
}
$hidden_get_variables = '';
reset($_GET);
while (list($key, $value) = each($_GET)) {
if ( ($key != 'currency') && ($key != zen_session_name()) && ($key != 'x') && ($key != 'y') ) {
$hidden_get_variables .= zen_draw_hidden_field($key, $value);
}
}
}
?><?php echo zen_draw_pull_down_menu('currency', $currencies_array, $_SESSION['currency'], ' onchange="this.form.submit();"') . $hidden_get_variables . zen_hide_session_id()?></form>
</div> <!-- nav_currencies -->
<div class="clearBoth"></div>
<div class="header-search">
<?php
$content = "";
$content .= zen_draw_form('quick_find_header', zen_href_link(FILENAME_ADVANCED_SEARCH_RESULT, '', 'NONSSL', false), 'get');
$content .= zen_draw_hidden_field('main_page',FILENAME_ADVANCED_SEARCH_RESULT);
$content .= zen_draw_hidden_field('search_in_description', '1') . zen_hide_session_id();
$content .= '<div class="searchinput">'. zen_draw_input_field('keyword', '', 'size="6" maxlength="30" style="width: 160px" value="' . HEADER_SEARCH_DEFAULT_TEXT . '" onfocus="if (this.value == \'' . HEADER_SEARCH_DEFAULT_TEXT . '\') this.value = \'\';" onblur="if (this.value == \'\') this.value = \'' . HEADER_SEARCH_DEFAULT_TEXT . '\';"') . '</div><input class="button-search-header" type="image" src="' . $template->get_template_dir('', DIR_WS_TEMPLATE, $current_page_base,'images') . '/sbutton.gif' . '" value="Serch" />' /*. zen_image_submit (BUTTON_IMAGE_SEARCH,HEADER_SEARCH_BUTTON)*/;
$content .= "</form>";
echo($content);
?>
</div><!-- header-search -->
</div> <!-- navCurrenciesWrapperInner -->
</div> <!-- navCurrenciesWrapper -->
<div id="headerContent">
<!-- <div id="nameWrapper"><?php //echo '<a href="' . HTTP_SERVER . DIR_WS_CATALOG . '">' . STORE_NAME . '</a>' ?></div> -->
<?php
if (HEADER_SALES_TEXT != '') {
?>
<!-- <div id="taglineWrapper"><?php// echo HEADER_SALES_TEXT ;?></div> -->
<?php
}
?>
</div><!-- headerContent -->
<!--bof-optional categories tabs navigation display-->
<?php require($template->get_template_dir('tpl_modules_categories_tabs.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_modules_categories_tabs.php');
?>
<!--eof-optional categories tabs navigation display-->
<?php if ($this_is_home_page) { ?>
<!-- ******************************* -->
<!-- Slideshow effects control start -->
<script language="javascript" type="text/javascript"><!--
$(document).ready(function() {
$("#slideshow").css("overflow", "hidden");
$("ul#slides").cycle({
fx: 'fade', //transition effects: shuffle, zoom, turnDown, curtainX
timeout: 4000, //miliseconds between slide image change
pause: 1,
prev: '#prev',
next: '#next'
});
$("#slideshow").hover(function() {
$("ul#nav").fadeIn();
},
function() {
$("ul#nav").fadeOut();
});
});
//--></script>
<!-- Slideshow effects control end -->
<!-- ***************************** -->
<!-- ************************************ -->
<!-- slideshow display images block start -->
<div id="slideshow" style="width: 960px; height: 250px;">
<ul id="nav">
<li id="prev"><a href="#">Previous</a></li>
<li id="next"><a href="#">Next</a></li>
</ul>
<ul id="slides">
<li><a href=""><img width="960" height="250" src="includes/templates/premium9a/images/.png" alt="" /></a></li>
<li><a href="http://www.zenflavor.com/demo9/"><img width="960" height="250" src="includes/templates/premium9a/images/slide2.jpg" alt="" /></a></li>
</ul>
</div>
<!-- slideshow display images block end -->
<!-- ********************************** -->
<div id="headerpic">
<?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>
<?php } ?>
<?php if (!$this_is_home_page) { ?>
<div id="headerpic">
<?php
if (SHOW_BANNERS_GROUP_SET3 != '' && $banner = zen_banner_exists('dynamic', SHOW_BANNERS_GROUP_SET3)) {
if ($banner->RecordCount() > 0) {
?>
<div id="bannerThree" class="banners"><?php echo zen_display_banner('static', $banner); ?></div>
<?php
}
}
?>
</div>
<?php } ?>
<!--bof-branding display-->
<!-- <br class="clearBoth" /> -->
<!--eof-branding display-->
<!--eof-header logo and navigation display-->
</div> <!-- headerWrapper -->
<?php } ?>
Your code is now in the "body" area... not in the template's "header" area.
You should create a DIV block and add the code inside the DIV. Then use CSS to set the width/height of the DIV... width should be the same as the width of your custom template design, and set the left and right margin to auto (this will center the DIV)
By the way, isn't it better to add the Facebook Like Box in a sidebox? Use any of the built-in banner sideboxes. This is easier to manage in the admin.
Can you show me how? I assume create a DIV in the header file for placement. And then the settings in stylesheet.css. But that is as far as I can get with it as I do not know much.Quote:
Originally Posted by yonghs
Also I do not use the side box because that is all it is. A link nothing more. The one I use up on top shows the peoples faces and a like button. Much more interesting since if you're logged in FB itll show people that are your friends already or close to you.
Any one please? I had this working in osCommerce but the files modded are diff so it's giving me a headache, ugh.
Uh, no, if you put one in the banner sidebox, it's the WHOLE Facebook Like/Fan box, with the like button, faces, news stream, header etc. Because you paste the whole Facebook iframe code (HTML code) for the banner, not image.Quote:
Originally Posted by willie bee
A banner sidebox can be HTML or image... so you put in HTML instead of image.
You paste EXACTLY the same iframe code into the banner sidebbox that you are now having on the tpl_header.php file.
If you still want to put it in the header. Instead of using the "center" tag, use this in your file and put in any location that suits you:
<div id="facebookbox">YOUR FACEBOOK CODE</div>
Then in the stylesheet.css file, add this:
#facebookbox {
width: 960px;
height: UP-TO-YOU;
margin-left: auto;
margin-right: auto;
}
yonghs, I do apologize for not thanking you sooner. I just saw this reply tonight and it worked! Thank you SO MUCH!