[SMF 1.1.x] Integrating the forum into your site using SMF\'s layer system

Farmacija · July 25, 2007, 05:41:06 PM

no, i just want to show you that something is wrong in code which you post here ...

spottedhog · July 25, 2007, 06:06:47 PM

...sigh

There was nothing wrong with the code I posted. What you placed in there was not a proper way to output content. With a php file, you must output using either:

echo 'content here';

or

print_r();

...sigh

spottedhog · July 25, 2007, 06:55:29 PM

Here is something that may help those who are having "require SSI.php" problems. (which I just had....

)

Use this:

Code Select

require_once ($_SERVER['DOCUMENT_ROOT'].'/SSI.php');

At least it is working well for me.

DobleB · August 29, 2007, 12:12:40 AM

I have a problem, the links in my forum gets a a color that shouldn't... I want to know if somebody can help me to figure it out... my header looks like this:

Code Select


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>.:MUSINETWORK SCHOOL OF MUSIC:. | &iexcl;BIENVENIDO!</title>
<style type="text/css">
<!--
body {
	margin-top: 0px;
	background-color: #000000;
	background-image: url(fondo.jpg);
	background-repeat: repeat-y;
	background-position:center;
}
.style1 {	color: #FFCC00;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
}
.style3 {	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #FF6600;
}
.style4 {	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #333333;
}
a:link {
	color: #FFCC00;
	text-decoration: none;
}
a:visited {
	text-decoration: none;
	color: #FFCC00;
}
a:hover {
	text-decoration: underline;
	color: #FF9900;
}
a:active {
	text-decoration: none;
}
.tex {
	font-size: 12px;
	color: #FFFFFF;
	font-family: Arial, Helvetica, sans-serif;
}
.style5 {color: #FF9900}
.Estilo1 {
	color: #FF6600;
	font-weight: bold;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 20px;
}
-->
</style></head>

<body>
<table width="900" height="500" border="0" align="center" cellpadding="0" cellspacing="0">
	<tr valign="top">
		<td width="900">
			<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="900" height="145">
              <param name="movie" value="../../../MENU.swf" />
              <param name="quality" value="high" />
              <embed src="../../../MENU.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="900" height="145"></embed>
            </object>
          	<table width="900" border="0" cellpadding="0" cellspacing="0">
	        	<tr>
    	    	    <td width="900" height="30">
                    	<img src="../../../FLOGIN.jpg" width="900" height="30" border="0" usemap="#Map" />
                      <map name="Map" id="Map">
                        <area shape="rect" coords="2,8,205,25" href="../CREDITOS.html" target="_self" />
                        <area shape="rect" coords="752,8,799,23" href="http://www.musinetwork.com/foros/index.php?action=login" target="_self" />
                        <area shape="rect" coords="810,9,877,22" href="http://www.musinetwork.com/foros/index.php?PHPSESSID=3527419bba89d8b2a68c6bbca13474d8&amp;action=register" target="_self" />
                        </map>
					</td>
			  </tr>
          </table>
			<table class="tex" width="900" height="265" border="0" cellpadding="0" cellspacing="0">
			<!--DWLayoutTable-->
            	<tr align="center" valign="top">
           		  	<td height="19" colspan="2">
   	  <div class="style4" align="justify" style="background-color:#FFFFFF; padding:5px">

and the footer looks like this:

Code Select


						</div>
					</td>
			  	</tr>
		  </table>
	  </td>
	</tr>
</table>
</body>
</html>

can somebody please tell me why the links get that awuful color and what should I do tho correct that??? sorry if I'm pushy, but I'm new using the smf, and I tried every solution I could... Thank you very much for your help...

Wal-Mart Security · August 29, 2007, 12:25:45 AM

You can change the color of the links in the CSS file(style.css). What you're looking for is a:link a:active a:hover a:visited or any other a: types of things. Usually I just delete that part of the CSS file in the custom theme, that way there are no conflicts with the CSS file I use for the rest of the site.

DobleB · August 29, 2007, 12:53:29 AM

well, in fact I want the new theme to keep the original appearance of the default theme, and all the text in the new theme is exactly the same except for the links... I even removed the a:'s from the header and even then the links still changing... What can I do?

IchBin™ · August 29, 2007, 01:39:50 AM

If you look in the index.template.php file of the default theme you'll notice how the style.css file is linked in the top. Just link it the same way and it will use the styles from the css file.

sponty · September 02, 2007, 01:42:32 PM

Hey there,

I'm running an SMF Forum (v 1.1.3) and I thought I followed the steps correctly, but there's a problem.

When I try to go to the forum, all that displays is "Unable to load the 'site_above' template." I'm unsure as to why I'm getting this 'error', so if anyone could let me know how I might fix this, please let me know.

hxxp:www.totalplaystudios.com/forum [nonactive]

Header:

Code Select

<div class="main">

	<div class="main_left">
		
<a href="http://www.totalplaystudios.com/" target="_top">
		<div class="header">
		</div>
</a>

		<div class="link_menu" align="left">
			<a href="http://www.totalplaystudios.com/radio" accesskey="1" target="_top">Radio</a>
			<a href="http://www.totalplaystudios.com/tv" accesskey="2" target="_top">TV</a>
			<a href="http://www.totalplaystudios.com/modcast" accesskey="3" target="_top">Modcast</a>
			<a href="http://www.totalplaystudios.com/audio" accesskey="4" target="_top">Audio</a>
			<a href="http://www.totalplaystudios.com/forum" accesskey="5" target="_top">Forum</a>
			<a href="http://www.totalplaystudios.com/staff" accesskey="6" target="_top">Staff</a>
		</div>

		<div class="content" align="left">

Footer:

Code Select

</div>

	</div>

	<div class="main_right">
		
		<div class="link_episodes">

			<div class="lbl">content</div>
 
<div class="clearer"><span></span></div>

		</div>

	</div>

	<div class="footer">

		<div class="left">
All content and images &copy; <a href="http://www.totalplaystudios.com">Total Play Studios</a> 2007.
</div>

	</div>

</div>

Thanks very much.

Wal-Mart Security · September 02, 2007, 02:02:31 PM

What is in the template_site_above and template_site_below functions? If you could please attach your index.template.php I could take a look at that and see what's going on. Another thing that could cause it is if you didn't do the phpmyadmin query, or if you did it to the wrong theme ID.

kaeus · September 05, 2007, 04:17:47 PM

Ok, I want to make sure what I am trying to do is possible before I figure out what is going wrong with my site. Basically, I want the forum inside the part that has EW at hxxp:www.ksgrafix.com/EternalWisdom/index.html [nonactive]. Is this even possible. My last attempt went bad (hxxp:www.ksgrafix.com/EternalWisdom/smf/index.php [nonactive]) Then again, it looks like i need some extra info in the top (which I added into the top of index.template.php). Any help would be appreciated. Basically, I'm trying to do something like the way another site a friend of mine did (with vbulletin however) at http://www.revolutiong.com. The style manager in that allows for editing completely of how it looks with header/footer in the editor, but its similar to what this guide says (except its all through admin control instead of code)

jimjam · September 05, 2007, 05:14:19 PM

Ok guys I have followed this tutorial using the layers etc and when I view my site (which has a sidebar on the left) some sections of the forum overflow way beyond the actual site container.

Any ideas the site should fit into around 1000px wide.

Any help appreciated.
James

Wal-Mart Security · September 06, 2007, 08:04:58 PM

Quote from: jimjam on September 05, 2007, 05:14:19 PM
Ok guys I have followed this tutorial using the layers etc and when I view my site (which has a sidebar on the left) some sections of the forum overflow way beyond the actual site container.

Any ideas the site should fit into around 1000px wide.

Any help appreciated.
James

Can you please post a link to your site?

Quote from: kaeus on September 05, 2007, 04:17:47 PM
Ok, I want to make sure what I am trying to do is possible before I figure out what is going wrong with my site. Basically, I want the forum inside the part that has EW at http://www.ksgrafix.com/EternalWisdom/index.html. Is this even possible. My last attempt went bad (http://www.ksgrafix.com/EternalWisdom/smf/index.php) Then again, it looks like i need some extra info in the top (which I added into the top of index.template.php). Any help would be appreciated. Basically, I'm trying to do something like the way another site a friend of mine did (with vbulletin however) at http://www.revolutiong.com. The style manager in that allows for editing completely of how it looks with header/footer in the editor, but its similar to what this guide says (except its all through admin control instead of code)

It looks like the header/footer was not included correctly in the forum. Can you please post your header.php, footer.php, and index.template.php?

jimjam · September 06, 2007, 10:20:28 PM

If you login with the username test and a pasword of testing and take a look at this link you will see the profile box shoot off over the actual boundries in the page template.

http://www.maltonandoldmaltoncc.com/forum/index.php?action=profile;u=2;sa=forumProfile [nofollow]

Thanks
James

Wal-Mart Security · September 07, 2007, 09:55:45 PM

mmm

I've experienced this on my forums before as well, you can edit this in profile.template.php

jimjam · September 08, 2007, 03:25:23 AM

Ok will give it a go. Thanks it helps when someone points you to the correct file to alter.

Thanks
James

jimjam · September 08, 2007, 03:45:29 PM

Ok have had a look into this and it seems to be related to the size of the fields etc such as the upload own picture box with the button next to it. I have made achange and things are improving.

Thanks for pointing me in the right direction.

James

Wal-Mart Security · September 08, 2007, 07:44:24 PM

You're welcome

kaeus are you still alive?

kaeus · September 10, 2007, 12:06:38 AM

Sorry, I've been having a lot of college work lately, but here are the files.

Header.php:

Code Select


<div align="center">
<table id="Table_01" width="1024" height="325" border="0" cellpadding="0" cellspacing="0">
<tr>
		<td>
			<img src="../images/index_01.gif" width="37" height="140" alt=""></td>
		<td colspan="12">
			<img src="../images/index_02.gif" width="963" height="140" alt=""></td>
		<td>
			<img src="../images/index_03.gif" width="24" height="140" alt=""></td>
	</tr>
	<tr>
		<td>
			<img src="../images/index_04.gif" width="37" height="9" alt=""></td>
		<td colspan="12">
			<img src="../images/index_05.gif" width="963" height="9" alt=""></td>
		<td>
			<img src="../images/index_06.gif" width="24" height="9" alt=""></td>
	</tr>
	<tr>
		<td>
			<img src="../images/index_07.gif" width="37" height="32" alt=""></td>
		<td>
			<img src="../images/index_08.gif" width="318" height="32" alt=""></td>
		<td>
			<img src="../images/index_09.gif" width="8" height="32" alt=""></td>
		<td colspan="2">
			<a href="#"
				onmouseover="change../images('index_10', '../images/index_10-over.gif'); return true;"
				onmouseout="change../images('index_10', '../images/index_10.gif'); return true;"
				onmousedown="change../images('index_10', '../images/index_10-over.gif'); return true;"
				onmouseup="change../images('index_10', '../images/index_10-over.gif'); return true;">
				<img name="index_10" src="../images/index_10.gif" width="125" height="32" border="0" alt=""></a></td>
		<td>
			<a href="#"
				onmouseover="change../images('index_11', '../images/index_11-over.gif'); return true;"
				onmouseout="change../images('index_11', '../images/index_11.gif'); return true;"
				onmousedown="change../images('index_11', '../images/index_11-over.gif'); return true;"
				onmouseup="change../images('index_11', '../images/index_11-over.gif'); return true;">
				<img name="index_11" src="../images/index_11.gif" width="126" height="32" border="0" alt=""></a></td>
		<td>
			<a href="#"
				onmouseover="change../images('index_12', '../images/index_12-over.gif'); return true;"
				onmouseout="change../images('index_12', '../images/index_12.gif'); return true;"
				onmousedown="change../images('index_12', '../images/index_12-over.gif'); return true;"
				onmouseup="change../images('index_12', '../images/index_12-over.gif'); return true;">
				<img name="index_12" src="../images/index_12.gif" width="127" height="32" border="0" alt=""></a></td>
		<td>
			<a href="#"
				onmouseover="change../images('index_13', '../images/index_13-over.gif'); return true;"
				onmouseout="change../images('index_13', '../images/index_13.gif'); return true;"
				onmousedown="change../images('index_13', '../images/index_13-over.gif'); return true;"
				onmouseup="change../images('index_13', '../images/index_13-over.gif'); return true;">
				<img name="index_13" src="../images/index_13.gif" width="127" height="32" border="0" alt=""></a></td>
		<td colspan="3">
			<a href="#"
				onmouseover="change../images('index_14', '../images/index_14-over.gif'); return true;"
				onmouseout="change../images('index_14', '../images/index_14.gif'); return true;"
				onmousedown="change../images('index_14', '../images/index_14-over.gif'); return true;"
				onmouseup="change../images('index_14', '../images/index_14-over.gif'); return true;">
				<img name="index_14" src="../images/index_14.gif" width="127" height="32" border="0" alt=""></a></td>
		<td colspan="2">
			<img src="../images/index_15.gif" width="5" height="32" alt=""></td>
		<td>
			<img src="../images/index_16.gif" width="24" height="32" alt=""></td>
	</tr>
	<tr>
		<td rowspan="3" background="../images/index_17.gif">&nbsp;</td>
		<td rowspan="3" class="leftimg">The fear of the Lord teaches a man wisdom, and humility comes before honor. <br>
	    Prov 15:33</td>
<td colspan="2">
			<img src="../images/index_19.gif" width="11" height="39" alt=""></td>
		<td colspan="6">
			<img src="../images/index_20.gif" width="626" height="39" alt=""></td>
		<td colspan="3">
			<img src="../images/index_21.gif" width="8" height="39" alt=""></td>
		<td>
			<img src="../images/index_22.gif" width="24" height="39" alt=""></td>
	</tr>
	<tr>
		<td colspan="2" background="../images/index_23.gif">&nbsp;</td>
		<td colspan="6" valign="top" bgcolor="#000000" class="contentholder"><p>

Footer.php

Code Select

</p>
	    <p>&nbsp;</p></td>
<td colspan="3" background="../images/index_25.gif">&nbsp;</td>
		<td background="../images/index_26.gif">&nbsp;</td>
	</tr>
	<tr>
		<td colspan="2">
			<img src="../images/index_27.gif" width="11" height="61" alt=""></td>
		<td colspan="6">
			<img src="../images/index_28.gif" width="626" height="61" alt=""></td>
		<td colspan="3">
			<img src="../images/index_29.gif" width="8" height="61" alt=""></td>
		<td>
			<img src="../images/index_30.gif" width="24" height="61" alt=""></td>
	</tr>
	<tr>
		<td>
			<img src="../images/index_31.gif" width="37" height="24" alt=""></td>
		<td>
			<img src="../images/index_32.gif" width="318" height="24" alt=""></td>
		<td colspan="2">
			<img src="../images/index_33.gif" width="11" height="24" alt=""></td>
		<td colspan="5">
			<img src="../images/index_34.gif" width="625" height="24" alt=""></td>
		<td colspan="3">
			<img src="../images/index_35.gif" width="7" height="24" alt=""></td>
		<td colspan="2">
			<img src="../images/index_36.gif" width="26" height="24" alt=""></td>
	</tr>
	<tr>
		<td>
			<img src="../images/spacer.gif" width="37" height="1" alt=""></td>
		<td>
			<img src="../images/spacer.gif" width="318" height="1" alt=""></td>
		<td>
			<img src="../images/spacer.gif" width="8" height="1" alt=""></td>
		<td>
			<img src="../images/spacer.gif" width="3" height="1" alt=""></td>
		<td>
			<img src="../images/spacer.gif" width="122" height="1" alt=""></td>
		<td>
			<img src="../images/spacer.gif" width="126" height="1" alt=""></td>
		<td>
			<img src="../images/spacer.gif" width="127" height="1" alt=""></td>
		<td>
			<img src="../images/spacer.gif" width="127" height="1" alt=""></td>
		<td>
			<img src="../images/spacer.gif" width="123" height="1" alt=""></td>
		<td>
			<img src="../images/spacer.gif" width="1" height="1" alt=""></td>
		<td>
			<img src="../images/spacer.gif" width="3" height="1" alt=""></td>
		<td>
			<img src="../images/spacer.gif" width="3" height="1" alt=""></td>
		<td>
			<img src="../images/spacer.gif" width="2" height="1" alt=""></td>
		<td>
			<img src="../images/spacer.gif" width="24" height="1" alt=""></td>
	</tr>
</table>
</div>

Index.template.php:

Code Select


<?php
// Version: 1.1; index

/*	This template is, perhaps, the most important template in the theme. It
	contains the main template layer that displays the header and footer of
	the forum, namely with main_above and main_below. It also contains the
	menu sub template, which appropriately displays the menu; the init sub
	template, which is there to set the theme up; (init can be missing.) and
	the linktree sub template, which sorts out the link tree.

	The init sub template should load any data and set any hardcoded options.

	The main_above sub template is what is shown above the main content, and
	should contain anything that should be shown up there.

	The main_below sub template, conversely, is shown after the main content.
	It should probably contain the copyright statement and some other things.

	The linktree sub template should display the link tree, using the data
	in the $context['linktree'] variable.

	The menu sub template should display all the relevant buttons the user
	wants and or needs.

	For more information on the templating system, please see the site at:
	http://www.simplemachines.org/
*/

// Initialize the template... mainly little settings.
function template_init()
{
	global $context, $settings, $options, $txt;

	/* Use images from default theme when using templates from the default theme?
		if this is 'always', images from the default theme will be used.
		if this is 'defaults', images from the default theme will only be used with default templates.
		if this is 'never' or isn't set at all, images from the default theme will not be used. */
	$settings['use_default_images'] = 'never';

	/* What document type definition is being used? (for font size and other issues.)
		'xhtml' for an XHTML 1.0 document type definition.
		'html' for an HTML 4.01 document type definition. */
	$settings['doctype'] = 'xhtml';

	/* The version this template/theme is for.
		This should probably be the version of SMF it was created for. */
	$settings['theme_version'] = '1.1';

	/* Set a setting that tells the theme that it can render the tabs. */
	$settings['use_tabs'] = true;

	/* Use plain buttons - as oppossed to text buttons? */
	$settings['use_buttons'] = true;

	/* Show sticky and lock status seperate from topic icons? */
	$settings['seperate_sticky_lock'] = true;
}

// The main sub template above the content.
function template_main_above()
{
	global $context, $settings, $options, $scripturl, $txt, $modSettings;

	// Show right to left and the character set for ease of translating.
	echo '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html><head>
	<script language="JavaScript" type="text/javascript" src="', $settings['default_theme_url'], '/script.js"></script>
	<script language="JavaScript" type="text/javascript"><!--
		var smf_theme_url = "', $settings['theme_url'], '";
		var smf_images_url = "', $settings['images_url'], '";
	// --></script>
	<title>', $context['page_title'], '</title>
	<link rel="stylesheet" type="text/css" href="', $settings['theme_url'], '/style.css?rc1" />
	<!-- ImageReady Preload Script (ew.psd) -->
<script type="text/javascript">
<!--

function newImage(arg) {
	if (document.images) {
		rslt = new Image();
		rslt.src = arg;
		return rslt;
	}
}

function changeImages() {
	if (document.images && (preloadFlag == true)) {
		for (var i=0; i<changeImages.arguments.length; i+=2) {
			document[changeImages.arguments[i]].src = changeImages.arguments[i+1];
		}
	}
}

var preloadFlag = false;
function preloadImages() {
	if (document.images) {
		index_10_over = newImage("../images/index_10-over.gif");
		index_11_over = newImage("../images/index_11-over.gif");
		index_12_over = newImage("../images/index_12-over.gif");
		index_13_over = newImage("../images/index_13-over.gif");
		index_14_over = newImage("../images/index_14-over.gif");
		preloadFlag = true;
	}
}

// -->
</script>
<!-- End Preload Script -->
<style type="text/css">
<!--
.leftimg {
	background-image: url(../images/index_18.gif);
	background-repeat: no-repeat;
	background-position: top;
	font-family: "Monotype Corsiva", "Courier New";
	font-size: 20px;
	color: #FFFFFF;
	padding-right: 10px;
	padding-left: 10px;
	background-color: #000000;
}
.contentholder {
	padding-right: 5px;
	padding-left: 5px;
}
.newscontent {
	background-image: url(../images/watermark.gif);
	background-repeat: no-repeat;
	background-position: center center;
}
.newstitle {
	background-image: url(../images/gradient.gif);
	background-repeat: repeat-x;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #FFFFFF;
}
body {
	background-color: #91916C;
}
-->
</style>
	';

	if ($context['browser']['needs_size_fix'])
		echo '
	<link rel="stylesheet" type="text/css" href="', $settings['default_theme_url'], '/fonts-compat.css" />
	', $context['html_headers'], '
	
</head>
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onLoad="preloadImages();">';

include('header.php');

	echo '
	<div class="tborder" ', $context['browser']['needs_size_fix'] && !$context['browser']['is_ie6'] ? ' style="width: 100%;"' : '', '>
		<table width="100%" cellpadding="0" cellspacing="0" border="0">
			<tr>
				<td class="catbg" height="32">';

	if (empty($settings['header_logo_url']))
		echo '
					<span style="font-family: Verdana, sans-serif; font-size: 140%; ">', $context['forum_name'], '</span>';
	else
		echo '
					<img src="', $settings['header_logo_url'], '" style="margin: 4px;" alt="', $context['forum_name'], '" />';

	echo '
				</td>
				<td align="right" class="catbg">
					<img src="', $settings['images_url'], '/smflogo.gif" style="margin: 2px;" alt="" />
				</td>
			</tr>
		</table>';


	// display user name
	echo '
		<table width="100%" cellpadding="0" cellspacing="0" border="0" >
			<tr>';

	if($context['user']['is_logged'])
		echo '
				<td class="titlebg2" height="32">
					<span style="font-size: 130%;"> ', $txt['hello_member_ndt'], ' <b>', $context['user']['name'] , '</b></span>
				</td>';

	// display the time
	echo '
				<td class="titlebg2" height="32" align="right">
					<span class="smalltext">' , $context['current_time'], '</span>';

	// this is the upshrink button for the user info section
	echo '';

	if (!empty($context['user']['avatar']))
		echo '
							<td class="windowbg" valign="middle">', $context['user']['avatar']['image'], '</td>';

	echo '
							<td colspan="2" width="100%" valign="top" class="windowbg2"><span class="middletext">';

	// If the user is logged in, display stuff like their name, new messages, etc.
	if ($context['user']['is_logged'])
	{
		echo '
								<a href="', $scripturl, '?action=unread">', $txt['unread_since_visit'], '</a> <br />
								<a href="', $scripturl, '?action=unreadreplies">', $txt['show_unread_replies'], '</a><br />';

	}
	// Otherwise they're a guest - send them a lovely greeting...
	else
		echo $txt['welcome_guest'];

	// Now, onto our second set of info, are they logged in again?
	if ($context['user']['is_logged'])
	{
		// Is the forum in maintenance mode?
		if ($context['in_maintenance'] && $context['user']['is_admin'])
			echo '
								<b>', $txt[616], '</b><br />';

		// Are there any members waiting for approval?
		if (!empty($context['unapproved_members']))
			echo '
								', $context['unapproved_members'] == 1 ? $txt['approve_thereis'] : $txt['approve_thereare'], ' <a href="', $scripturl, '?action=viewmembers;sa=browse;type=approve">', $context['unapproved_members'] == 1 ? $txt['approve_member'] : $context['unapproved_members'] . ' ' . $txt['approve_members'], '</a> ', $txt['approve_members_waiting'], '<br />';

		// Show the total time logged in?
		if (!empty($context['user']['total_time_logged_in']))
		{
			echo '
								', $txt['totalTimeLogged1'];

			// If days is just zero, don't bother to show it.
			if ($context['user']['total_time_logged_in']['days'] > 0)
				echo $context['user']['total_time_logged_in']['days'] . $txt['totalTimeLogged2'];

			// Same with hours - only show it if it's above zero.
			if ($context['user']['total_time_logged_in']['hours'] > 0)
				echo $context['user']['total_time_logged_in']['hours'] . $txt['totalTimeLogged3'];

			// But, let's always show minutes - Time wasted here: 0 minutes ;).
			echo $context['user']['total_time_logged_in']['minutes'], $txt['totalTimeLogged4'], '<br />';
		}
		echo '				</span>';
	}
	// Otherwise they're a guest - this time ask them to either register or login - lazy bums...
	else
	{
		echo '				</span>
								<script language="JavaScript" type="text/javascript" src="', $settings['default_theme_url'], '/sha1.js"></script>

								<form action="', $scripturl, '?action=login2" method="post" accept-charset="', $context['character_set'], '" class="middletext" style="margin: 3px 1ex 1px 0;"', empty($context['disable_login_hashing']) ? ' onsubmit="hashLoginPassword(this, \'' . $context['session_id'] . '\');"' : '', '>
									<input type="text" name="user" size="10" /> <input type="password" name="passwrd" size="10" />
									<select name="cookielength">
										<option value="60">', $txt['smf53'], '</option>
										<option value="1440">', $txt['smf47'], '</option>
										<option value="10080">', $txt['smf48'], '</option>
										<option value="43200">', $txt['smf49'], '</option>
										<option value="-1" selected="selected">', $txt['smf50'], '</option>
									</select>
									<input type="submit" value="', $txt[34], '" /><br />
									<span class="middletext">', $txt['smf52'], '</span>
									<input type="hidden" name="hash_passwrd" value="" />
								</form>';
	}

	echo '
							</td>
						</tr>
					</table>
				</td>
			</tr>
		</table>';

	echo '
		<table id="upshrinkHeader2"', empty($options['collapse_header']) ? '' : ' style="display: none;"', ' width="100%" cellpadding="4" cellspacing="0" border="0">
			<tr>';

	// Show a random news item? (or you could pick one from news_lines...)
	if (!empty($settings['enable_news']))
		echo '
				<td width="90%" class="titlebg2">
					<span class="smalltext"><b>', $txt[102], '</b>: ', $context['random_news_line'], '</span>
				</td>';
	echo '
				<td class="titlebg2" align="right" nowrap="nowrap" valign="top">
					<form action="', $scripturl, '?action=search2" method="post" accept-charset="', $context['character_set'], '" style="margin: 0;">
						<a href="', $scripturl, '?action=search;advanced"><img src="'.$settings['images_url'].'/filter.gif" align="middle" style="margin: 0 1ex;" alt="" /></a>
						<input type="text" name="search" value="" style="width: 190px;" />&nbsp;
						<input type="submit" name="submit" value="', $txt[182], '" style="width: 11ex;" />
						<input type="hidden" name="advanced" value="0" />';

	// Search within current topic?
	if (!empty($context['current_topic']))
		echo '
						<input type="hidden" name="topic" value="', $context['current_topic'], '" />';

		// If we're on a certain board, limit it to this board ;).
	elseif (!empty($context['current_board']))
		echo '
						<input type="hidden" name="brd[', $context['current_board'], ']" value="', $context['current_board'], '" />';

	echo '
					</form>
				</td>
			</tr>
		</table>
	</div>';


	// Show the menu here, according to the menu sub template.
	template_menu();


	// The main content should go here.
	echo '
	<div id="bodyarea" style="padding: 1ex 0px 2ex 0px;">';
}

function template_main_below()
{
	global $context, $settings, $options, $scripturl, $txt;

	echo '
	</div>';

	// Show the "Powered by" and "Valid" logos, as well as the copyright. Remember, the copyright must be somewhere!
	echo '

	<div id="footerarea" style="text-align: center; padding-bottom: 1ex;', $context['browser']['needs_size_fix'] && !$context['browser']['is_ie6'] ? ' width: 100%;' : '', '">
		<script language="JavaScript" type="text/javascript"><!-- // --><![CDATA[
			function smfFooterHighlight(element, value)
			{
				element.src = smf_images_url + "/" + (value ? "h_" : "") + element.id + ".gif";
			}
		// ]]></script>
		<table cellspacing="0" cellpadding="3" border="0" align="center" width="100%">
			<tr>
				<td width="28%" valign="middle" align="', !$context['right_to_left'] ? 'right' : 'left', '">
					<a href="http://www.mysql.com/" target="_blank"><img id="powered-mysql" src="', $settings['images_url'], '/powered-mysql.gif" alt="', $txt['powered_by_mysql'], '" width="54" height="20" style="margin: 5px 16px;" onmouseover="smfFooterHighlight(this, true);" onmouseout="smfFooterHighlight(this, false);" /></a>
					<a href="http://www.php.net/" target="_blank"><img id="powered-php" src="', $settings['images_url'], '/powered-php.gif" alt="', $txt['powered_by_php'], '" width="54" height="20" style="margin: 5px 16px;" onmouseover="smfFooterHighlight(this, true);" onmouseout="smfFooterHighlight(this, false);" /></a>
				</td>
				<td valign="middle" align="center" style="white-space: nowrap;">
					', theme_copyright(), '
				</td>
				<td width="28%" valign="middle" align="', !$context['right_to_left'] ? 'left' : 'right', '">
					<a href="http://validator.w3.org/check/referer" target="_blank"><img id="valid-xhtml10" src="', $settings['images_url'], '/valid-xhtml10.gif" alt="', $txt['valid_xhtml'], '" width="54" height="20" style="margin: 5px 16px;" onmouseover="smfFooterHighlight(this, true);" onmouseout="smfFooterHighlight(this, false);" /></a>
					<a href="http://jigsaw.w3.org/css-validator/check/referer" target="_blank"><img id="valid-css" src="', $settings['images_url'], '/valid-css.gif" alt="', $txt['valid_css'], '" width="54" height="20" style="margin: 5px 16px;" onmouseover="smfFooterHighlight(this, true);" onmouseout="smfFooterHighlight(this, false);" /></a>
				</td>
			</tr>
		</table>';

		// Show the load time?
	if ($context['show_load_time'])
		echo '
		<span class="smalltext">', $txt['smf301'], $context['load_time'], $txt['smf302'], $context['load_queries'], $txt['smf302b'], '</span>';

	// This is an interesting bug in Internet Explorer AND Safari. Rather annoying, it makes overflows just not tall enough.
	if (($context['browser']['is_ie'] && !$context['browser']['is_ie4']) || $context['browser']['is_mac_ie'] || $context['browser']['is_safari'] || $context['browser']['is_firefox'])
	{
		// The purpose of this code is to fix the height of overflow: auto div blocks, because IE can't figure it out for itself.
		echo '
		<script language="JavaScript" type="text/javascript"><!-- // --><![CDATA[';

		// Unfortunately, Safari does not have a "getComputedStyle" implementation yet, so we have to just do it to code...
		if ($context['browser']['is_safari'])
			echo '
			window.addEventListener("load", smf_codeFix, false);

			function smf_codeFix()
			{
				var codeFix = document.getElementsByTagName ? document.getElementsByTagName("div") : document.all.tags("div");

				for (var i = 0; i < codeFix.length; i++)
				{
					if ((codeFix[i].className == "code" || codeFix[i].className == "post" || codeFix[i].className == "signature") && codeFix[i].offsetHeight < 20)
						codeFix[i].style.height = (codeFix[i].offsetHeight + 20) + "px";
				}
			}';
		elseif ($context['browser']['is_firefox'])
			echo '
			window.addEventListener("load", smf_codeFix, false);
			function smf_codeFix()
			{
				var codeFix = document.getElementsByTagName ? document.getElementsByTagName("div") : document.all.tags("div");

				for (var i = 0; i < codeFix.length; i++)
				{
					if (codeFix[i].className == "code" && (codeFix[i].scrollWidth > codeFix[i].clientWidth || codeFix[i].clientWidth == 0))
						codeFix[i].style.overflow = "scroll";
				}
			}';			
		else
			echo '
			var window_oldOnload = window.onload;
			window.onload = smf_codeFix;

			function smf_codeFix()
			{
				var codeFix = document.getElementsByTagName ? document.getElementsByTagName("div") : document.all.tags("div");

				for (var i = codeFix.length - 1; i > 0; i--)
				{
					if (codeFix[i].currentStyle.overflow == "auto" && (codeFix[i].currentStyle.height == "" || codeFix[i].currentStyle.height == "auto") && (codeFix[i].scrollWidth > codeFix[i].clientWidth || codeFix[i].clientWidth == 0) && (codeFix[i].offsetHeight != 0 || codeFix[i].className == "code"))
						codeFix[i].style.height = (codeFix[i].offsetHeight + 36) + "px";
				}

				if (window_oldOnload)
				{
					window_oldOnload();
					window_oldOnload = null;
				}
			}';

		echo '
		// ]]></script>';
	}

	echo '
	</div>';

	// The following will be used to let the user know that some AJAX process is running
	include('footer.php');
	echo '
	<div id="ajax_in_progress" style="display: none;', $context['browser']['is_ie'] && !$context['browser']['is_ie7'] ? 'position: absolute;' : '', '">', $txt['ajax_in_progress'], '</div>
</body></html>';
}

// Show a linktree. This is that thing that shows "My Community | General Category | General Discussion"..
function theme_linktree()
{
	global $context, $settings, $options;

	echo '<div class="nav" style="font-size: smaller; margin-bottom: 2ex; margin-top: 2ex;">';

	// Each tree item has a URL and name. Some may have extra_before and extra_after.
	foreach ($context['linktree'] as $link_num => $tree)
	{
		// Show something before the link?
		if (isset($tree['extra_before']))
			echo $tree['extra_before'];

		// Show the link, including a URL if it should have one.
		echo '<b>', $settings['linktree_link'] && isset($tree['url']) ? '<a href="' . $tree['url'] . '" class="nav">' . $tree['name'] . '</a>' : $tree['name'], '</b>';

		// Show something after the link...?
		if (isset($tree['extra_after']))
			echo $tree['extra_after'];

		// Don't show a separator for the last one.
		if ($link_num != count($context['linktree']) - 1)
			echo '&nbsp;>&nbsp;';
	}

	echo '</div>';
}

// Show the menu up top. Something like [home] [help] [profile] [logout]...
function template_menu()
{
	global $context, $settings, $options, $scripturl, $txt;

	// Work out where we currently are.
	$current_action = 'home';
	if (in_array($context['current_action'], array('admin', 'ban', 'boardrecount', 'cleanperms', 'detailedversion', 'dumpdb', 'featuresettings', 'featuresettings2', 'findmember', 'maintain', 'manageattachments', 'manageboards', 'managecalendar', 'managesearch', 'membergroups', 'modlog', 'news', 'optimizetables', 'packageget', 'packages', 'permissions', 'pgdownload', 'postsettings', 'regcenter', 'repairboards', 'reports', 'serversettings', 'serversettings2', 'smileys', 'viewErrorLog', 'viewmembers')))
		$current_action = 'admin';
	if (in_array($context['current_action'], array('search', 'admin', 'calendar', 'profile', 'mlist', 'register', 'login', 'help', 'pm')))
		$current_action = $context['current_action'];
	if ($context['current_action'] == 'search2')
		$current_action = 'search';
	if ($context['current_action'] == 'theme')
		$current_action = isset($_REQUEST['sa']) && $_REQUEST['sa'] == 'pick' ? 'profile' : 'admin';

	// Are we using right-to-left orientation?
	if ($context['right_to_left'])
	{
		$first = 'last';
		$last = 'first';
	}
	else
	{
		$first = 'first';
		$last = 'last';
	}

	// Show the start of the tab section.
	echo '
			<table cellpadding="0" cellspacing="0" border="0" style="margin-left: 10px;">
				<tr>
					<td class="maintab_' , $first , '">&nbsp;</td>';

	// Show the [home] button.
	echo ($current_action=='home' || $context['browser']['is_ie4']) ? '<td class="maintab_active_' . $first . '">&nbsp;</td>' : '' , '
				<td valign="top" class="maintab_' , $current_action == 'home' ? 'active_back' : 'back' , '">
					<a href="', $scripturl, '">' , $txt[103] , '</a>
				</td>' , $current_action == 'home' ? '<td class="maintab_active_' . $last . '">&nbsp;</td>' : '';

	// Show the [help] button.
	echo ($current_action == 'help' || $context['browser']['is_ie4']) ? '<td class="maintab_active_' . $first . '">&nbsp;</td>' : '' , '
				<td valign="top" class="maintab_' , $current_action == 'help' ? 'active_back' : 'back' , '">
					<a href="', $scripturl, '?action=help">' , $txt[119] , '</a>
				</td>' , $current_action == 'help' ? '<td class="maintab_active_' . $last . '">&nbsp;</td>' : '';

	// How about the [search] button?
	if ($context['allow_search'])
		echo ($current_action == 'search' || $context['browser']['is_ie4']) ? '<td class="maintab_active_' . $first . '">&nbsp;</td>' : '' , '
				<td valign="top" class="maintab_' , $current_action == 'search' ? 'active_back' : 'back' , '">
					<a href="', $scripturl, '?action=search">' , $txt[182] , '</a>
				</td>' , $current_action == 'search' ? '<td class="maintab_active_' . $last . '">&nbsp;</td>' : '';

	// Is the user allowed to administrate at all? ([admin])
	if ($context['allow_admin'])
		echo ($current_action == 'admin' || $context['browser']['is_ie4']) ? '<td class="maintab_active_' . $first . '">&nbsp;</td>' : '' , '
				<td valign="top" class="maintab_' , $current_action == 'admin' ? 'active_back' : 'back' , '">
					<a href="', $scripturl, '?action=admin">' , $txt[2] , '</a>
				</td>' , $current_action == 'admin' ? '<td class="maintab_active_' . $last . '">&nbsp;</td>' : '';


	// Edit Profile... [profile]
	if ($context['allow_edit_profile'])
		echo ($current_action == 'profile' || $context['browser']['is_ie4']) ? '<td class="maintab_active_' . $first . '">&nbsp;</td>' : '' , '
				<td valign="top" class="maintab_' , $current_action == 'profile' ? 'active_back' : 'back' , '">
					<a href="', $scripturl, '?action=profile">' , $txt[79] , '</a>
				</td>' , $current_action == 'profile' ? '<td class="maintab_active_' . $last . '">&nbsp;</td>' : '';

	// Go to PM center... [pm]
	if ($context['user']['is_logged'] && $context['allow_pm'])
		echo ($current_action == 'pm' || $context['browser']['is_ie4']) ? '<td class="maintab_active_' . $first . '">&nbsp;</td>' : '' , '
				<td valign="top" class="maintab_' , $current_action == 'pm' ? 'active_back' : 'back' , '">
					<a href="', $scripturl, '?action=pm">' , $txt['pm_short'] , ' ', $context['user']['unread_messages'] > 0 ? '[<strong>'. $context['user']['unread_messages'] . '</strong>]' : '' , '</a>
				</td>' , $current_action == 'pm' ? '<td class="maintab_active_' . $last . '">&nbsp;</td>' : '';

	// The [calendar]!
	if ($context['allow_calendar'])
		echo ($current_action == 'calendar' || $context['browser']['is_ie4']) ? '<td class="maintab_active_' . $first . '">&nbsp;</td>' : '' , '
				<td valign="top" class="maintab_' , $current_action == 'calendar' ? 'active_back' : 'back' , '">
					<a href="', $scripturl, '?action=calendar">' , $txt['calendar24'] , '</a>
				</td>' , $current_action == 'calendar' ? '<td class="maintab_active_' . $last . '">&nbsp;</td>' : '';

	// the [member] list button
	if ($context['allow_memberlist'])
		echo ($current_action == 'mlist' || $context['browser']['is_ie4']) ? '<td class="maintab_active_' . $first . '">&nbsp;</td>' : '' , '
				<td valign="top" class="maintab_' , $current_action == 'mlist' ? 'active_back' : 'back' , '">
					<a href="', $scripturl, '?action=mlist">' , $txt[331] , '</a>
				</td>' , $current_action == 'mlist' ? '<td class="maintab_active_' . $last . '">&nbsp;</td>' : '';


	// If the user is a guest, show [login] button.
	if ($context['user']['is_guest'])
		echo ($current_action == 'login' || $context['browser']['is_ie4']) ? '<td class="maintab_active_' . $first . '">&nbsp;</td>' : '' , '
				<td valign="top" class="maintab_' , $current_action == 'login' ? 'active_back' : 'back' , '">
					<a href="', $scripturl, '?action=login">' , $txt[34] , '</a>
				</td>' , $current_action == 'login' ? '<td class="maintab_active_' . $last . '">&nbsp;</td>' : '';


	// If the user is a guest, also show [register] button.
	if ($context['user']['is_guest'])
		echo ($current_action == 'register' || $context['browser']['is_ie4']) ? '<td class="maintab_active_' . $first . '">&nbsp;</td>' : '' , '
				<td valign="top" class="maintab_' , $current_action == 'register' ? 'active_back' : 'back' , '">
					<a href="', $scripturl, '?action=register">' , $txt[97] , '</a>
				</td>' , $current_action == 'register' ? '<td class="maintab_active_' . $last . '">&nbsp;</td>' : '';


	// Otherwise, they might want to [logout]...
	if ($context['user']['is_logged'])
		echo ($current_action == 'logout' || $context['browser']['is_ie4']) ? '<td class="maintab_active_' . $first . '">&nbsp;</td>' : '' , '
				<td valign="top" class="maintab_' , $current_action == 'logout' ? 'active_back' : 'back' , '">
					<a href="', $scripturl, '?action=logout;sesc=', $context['session_id'], '">' , $txt[108] , '</a>
				</td>' , $current_action == 'logout' ? '<td class="maintab_active_' . $last . '">&nbsp;</td>' : '';

	// The end of tab section.
	echo '
				<td class="maintab_' , $last , '">&nbsp;</td>
			</tr>
		</table>';

}

// Generate a strip of buttons.
function template_button_strip($button_strip, $direction = 'top', $force_reset = false, $custom_td = '')
{
	global $settings, $buttons, $context, $txt, $scripturl;

	// Create the buttons...
	foreach ($button_strip as $key => $value)
	{
		if (isset($value['test']) && empty($context[$value['test']]))
		{
			unset($button_strip[$key]);
			continue;
		}
		elseif (!isset($buttons[$key]) || $force_reset)
			$buttons[$key] = '<a href="' . $value['url'] . '" ' .( isset($value['custom']) ? $value['custom'] : '') . '>' . $txt[$value['text']] . '</a>';

		$button_strip[$key] = $buttons[$key];
	}

	if (empty($button_strip))
		return '<td>&nbsp;</td>';

	echo '
		<td class="', $direction == 'top' ? 'main' : 'mirror', 'tab_' , $context['right_to_left'] ? 'last' : 'first' , '">&nbsp;</td>
		<td class="', $direction == 'top' ? 'main' : 'mirror', 'tab_back">', implode(' &nbsp;|&nbsp; ', $button_strip) , '</td>
		<td class="', $direction == 'top' ? 'main' : 'mirror', 'tab_' , $context['right_to_left'] ? 'first' : 'last' , '">&nbsp;</td>';
}

?>

Wal-Mart Security · September 10, 2007, 03:00:47 AM

I took a glance at your index.template file, and you have the include in the wrong place. It needs to be a separate function in the file, if you follow the tutorial the functions will look like this:

Code Select


function template_site_above()
{
include("header.php");
}

function template_site_below()
{
include("footer.php");
}

Copy paste this in to your index.template.php file, and remove the other includes. I also noticed that you included some <style> tags in to the index.template.php file--this is unnecessary, as is the way the headers are made. In your header.php, there was not a doctype or anything like that.

Header.php is made by copying from the very first line(usually the <!DOCTYPE tag) all the way to the beginning of your actual content and pasting that in to the header.php file. Footer.php is made from the end of the content to the end of the site's template.

Header = Beginning of doc => Beginning of content
Footer = End of content => End of doc

Since you are using a stylesheet and/or images, in the header and footer files you'll want to add a few ../ to make all the images or any other links work.

Dragooon · September 10, 2007, 06:23:04 AM

Nice one Daniel

.
Helped me understand how SMF's template system works and how does this site works

News:

[SMF 1.1.x] Integrating the forum into your site using SMF\'s layer system