Need help from an HTLM coding master (or just someone who knows what they're doing)

**Dyne** · 12-03-2008, 04:36 PM

Ok...

So I have no clue about HTML code. Well, I know very little basic information from a class I took on it in High school. I have a site up and running (if anyone remembers my domain thread :p ) and I am using phpBB for my forum (can't afford vBulletin for the time being). I am using this style for the forum:

*EDIT*

Seems like the style data isn't working. Bah. But you get the general idea...

Notice at the top right there is a link for FAQ and SEARCH. There are more links when logged in. What I want to do is add a link for HOME and GALLERY, using the same button types (which I guess will happen automatically if I don't change anything in the template folder) and for the links to obvious link to their respective areas. I know I need to edit this in the overall_header.html, but I have absolutely no idea where to do this. Here is the HTLM code:

HTML Code:

<!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" dir="{S_CONTENT_DIRECTION}" lang="{S_USER_LANG}" xml:lang="{S_USER_LANG}">
<head>
<title>{SITENAME} &bull; <!-- IF S_IN_MCP -->{L_MCP} &bull; <!-- ELSEIF S_IN_UCP -->{L_UCP} &bull; <!-- ENDIF -->{PAGE_TITLE}</title>
<meta http-equiv="content-type" content="text/html; charset={S_CONTENT_ENCODING}" />
<meta http-equiv="content-language" content="{S_USER_LANG}" />
<meta http-equiv="content-style-type" content="text/css" />
<meta http-equiv="imagetoolbar" content="no" />
<meta name="resource-type" content="document" />
<meta name="distribution" content="global" />
<meta name="copyright" content="2000, 2002, 2005, 2007 phpBB Group" />
<meta name="keywords" content="" />
<meta name="description" content="" />
{META}
<link rel="stylesheet" href="{T_STYLESHEET_LINK}" type="text/css" />
<!--[if IE]><link rel="stylesheet" href="{T_THEME_PATH}/ie.css" type="text/css" /><![endif]-->
<!--[if lte IE 6]>
<script defer type="text/javascript" src="{T_TEMPLATE_PATH}/pngfix.js"></script>
<link rel="stylesheet" href="{T_THEME_PATH}/ie6.css" type="text/css" />
<![endif]-->
<script type="text/javascript">
// <![CDATA[
<!-- IF S_USER_PM_POPUP -->
	if ({S_NEW_PM})
	{
		popup('{UA_POPUP_PM}', 400, 225, '_phpbbprivmsg');
	}
<!-- ENDIF -->

function popup(url, width, height, name)
{
	if (!name)
	{
		name = '_popup';
	}

	window.open(url.replace(/&amp;/g, '&'), name, 'height=' + height + ',resizable=yes,scrollbars=yes,width=' + width);
	return false;
}

function jumpto()
{
	var page = prompt('{LA_JUMP_PAGE}:', '{ON_PAGE}');
	var perpage = '{PER_PAGE}';
	var base_url = '{A_BASE_URL}';

	if (page !== null && !isNaN(page) && page > 0)
	{
		document.location.href = base_url.replace(/&amp;/g, '&') + '&start=' + ((page - 1) * perpage);
	}
}

/**
* Find a member
*/
function find_username(url)
{
	popup(url, 760, 570, '_usersearch');
	return false;
}

/**
* Mark/unmark checklist
* id = ID of parent container, name = name prefix, state = state [true/false]
*/
function marklist(id, name, state)
{
	var parent = document.getElementById(id);
	if (!parent)
	{
		eval('parent = document.' + id);
	}

	if (!parent)
	{
		return;
	}

	var rb = parent.getElementsByTagName('input');
	
	for (var r = 0; r < rb.length; r++)
	{
		if (rb[r].name.substr(0, name.length) == name)
		{
			rb[r].checked = state;
		}
	}
}

<!-- IF ._file -->

	/**
	* Play quicktime file by determining it's width/height
	* from the displayed rectangle area
	*
	* Only defined if there is a file block present.
	*/
	function play_qt_file(obj)
	{
		var rectangle = obj.GetRectangle();

		if (rectangle)
		{
			rectangle = rectangle.split(',')
			var x1 = parseInt(rectangle[0]);
			var x2 = parseInt(rectangle[2]);
			var y1 = parseInt(rectangle[1]);
			var y2 = parseInt(rectangle[3]);

			var width = (x1 < 0) ? (x1 * -1) + x2 : x2 - x1;
			var height = (y1 < 0) ? (y1 * -1) + y2 : y2 - y1;
		}
		else
		{
			var width = 200;
			var height = 0;
		}

		obj.width = width;
		obj.height = height + 16;

		obj.SetControllerVisible(true);

		obj.Play();
	}
<!-- ENDIF -->

// ]]>
</script>
</head>
<body class="{S_CONTENT_DIRECTION}">
<a name="top"></a>

<div id="container">
<div id="wrapper">

<div id="header">
<a href="{U_INDEX}">{SITE_LOGO_IMG}</a>
<div id="top_menu">
	<!-- IF S_DISPLAY_SEARCH --><a id="search" href="{U_SEARCH}">{L_SEARCH}</a><!-- ENDIF -->
	<!-- IF not S_IS_BOT --><!-- IF S_DISPLAY_MEMBERLIST --><a id="members" href="{U_MEMBERLIST}">{L_MEMBERLIST}</a><!-- ENDIF -->
	<!-- IF S_USER_LOGGED_IN --><a id="ucp" href="{U_PROFILE}">{L_PROFILE}</a><!-- ENDIF --><!-- ENDIF -->
	<a id="faq" href="{U_FAQ}">{L_FAQ}</a>
</div>
</div>

<div id="content1">
<div id="content2">
<div id="content3">

	<br style="clear: both;" />

	<p class="genmed"><!-- IF not S_IS_BOT --><a href="{U_LOGIN_LOGOUT}"><b>{L_LOGIN_LOGOUT}</b></a><!-- ENDIF -->
	<!-- IF not S_IS_BOT -->
	<!-- IF S_USER_LOGGED_IN -->
	<!-- IF S_DISPLAY_PM --> | <a href="{U_PRIVATEMSGS}"><b>{PRIVATE_MESSAGE_INFO}<!-- IF PRIVATE_MESSAGE_INFO_UNREAD -->, {PRIVATE_MESSAGE_INFO_UNREAD}<!-- ENDIF --></b></a><!-- ENDIF -->
	<!-- ELSEIF S_REGISTER_ENABLED --> | <a href="{U_REGISTER}"><b>{L_REGISTER}</b></a>
	<!-- ENDIF -->
	<!-- ENDIF -->
	<!-- IF U_RESTORE_PERMISSIONS --><br /><a href="{U_RESTORE_PERMISSIONS}">{L_RESTORE_PERMISSIONS}</a><!-- ENDIF -->
	<!-- IF S_BOARD_DISABLED and S_USER_LOGGED_IN --><br /><span style="color: red;">{L_BOARD_DISABLED}</span><!-- ENDIF --></p>
	
	<br style="clear: both;" />

	<!-- INCLUDE breadcrumbs.html -->
	
	<br />
	
	<table width="100%" cellspacing="0">
	<tr>
		<td class="gensmall"><!-- IF S_USER_LOGGED_IN -->{LAST_VISIT_DATE}<!-- ENDIF --></td>
		<td class="gensmall" align="{S_CONTENT_FLOW_END}">{CURRENT_TIME}<br /></td>
	</tr>
	</table>

	<!-- IF S_DISPLAY_SEARCH -->
	<p class="searchbar">
		<span style="float: {S_CONTENT_FLOW_BEGIN};"><a href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a> | <a href="{U_SEARCH_ACTIVE_TOPICS}">{L_SEARCH_ACTIVE_TOPICS}</a></span>
		<!-- IF S_USER_LOGGED_IN -->
		<span style="float: {S_CONTENT_FLOW_END};"><a href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a> | <a href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a></span>
		<!-- ENDIF -->
	</p>
	<!-- ENDIF -->

	<br style="clear: both;" /><br />

Does anyone have any idea how I can get this to work? What code to type and where to type it? Any help will be greatly appreciated.

**Dyne** · 12-12-2008, 03:52 PM

Guess that means no HTML coders here... :(

**BadCat** · 12-13-2008, 11:23 AM

May I suggest you get a good HTML/JavaScript editor such as CoffeeCup?

**wulfpaw** · 12-15-2008, 06:40 AM

Here's a free online analysis site: http://www.websiteoptimization.com/services/analyze/ You paste in the url, and it gives you an analysis of your code. Here's an analysis of the forum's main page here at CU:

TOTAL_HTML - Congratulations, the total number of HTML files on this page (including the main HTML file) is 1 which most browsers can multithread. Minimizing HTTP requests is key for web site optimization. Y
TOTAL_OBJECTS - Caution. You have 19 total objects on this page. From 12 to 20 objects per page, the latency due to object overhead makes up from 75% to 80% of the delay of the average web page. See Figure II-3: Relative distribution of latency components showing that object overhead dominates web page latency in Website Optimization Secrets for more details. Consider reducing, eliminating, and combining external objects (graphics, CSS, JavaScript, iFrames and XHTML) to reduce the total number of objects, and thus separate HTTP requests. Consider using CSS sprites to help consolidate decorative images.
TOTAL_IMAGES - Caution. You have a moderate amount of images on this page (10 ). Consider using fewer images on the site or try reusing the same image in multiple pages to take advantage of caching. Using CSS techniques such as colored backgrounds, borders, or spacing instead of graphic techniques can help reduce HTTP requests.
TOTAL_CSS - Congratulations, the total number of external CSS files on this page is 1 . Because external CSS files must be in the HEAD of your HTML document, they must load first before any BODY content displays. Although they are cached, CSS files slow down the initial display of your page. Remember to place CSS files in the HEAD and JavaScript files at the end of the BODY to enable progressive display.
TOTAL_SIZE - Caution. The total size of this page is 104062 bytes, which will load in over 20 seconds on a 56Kbps modem - or 24.54 seconds on a 56Kbps modem. Consider reducing total page size to less than 100K to achieve sub 20 second response times on 56K connections. Be sure to provide feedback for pages over 100K by layering your design to display useful content within the first two seconds. Consider optimizing your site with Website Optimization Secrets, Speed Up Your Site or contacting us about our optimization services.
TOTAL_SCRIPT - Warning! The total number of external script files on this page is 7 , consider reducing this to a more reasonable number. Combine, refactor, and minify to optimize your JavaScript files. Ideally you should have one (or even embed scripts for high-traffic pages) on your pages. Consider suturing JavaScript files together at the server to minimize HTTP requests. Placing external JavaScript files at the bottom of your BODY, and CSS files in the HEAD enables progressive display in XHTML web pages.
HTML_SIZE - Congratulations, the total size of this HTML file is 14106 bytes, which less than 50K. Assuming that you specify the HEIGHT and WIDTH of your images, this size allows your HTML to display content in under 10 seconds, the average time users are willing to wait for a page to display without feedback.
IMAGES_SIZE - Congratulations, the total size of all your images is 14297 bytes, which is less than 50K. Even with a 50K HTML page this page should load in less than 20 seconds on a 56Kbps connection. Ideally each image should be less than 1160 bytes, to easily fit into one TCP-IP packet.
SCRIPT_SIZE - Warning! The total size of external your scripts is 73986 bytes, which is over 20K. Consider optimizing your JavaScript for size, combining them, and using HTTP compression where appropriate for any scripts placed in the HEAD of your documents. You can substitute CSS menus for JavaScript-based menus to minimize or even eliminate the use of JavaScript.
CSS_SIZE - Congratulations, the total size of your external CSS is 1673 bytes, which is less than 8K.
MULTIM_SIZE - Congratulations, the total size of all your external multimedia files is 0 bytes, which is less than 10K.

Thread: Need help from an HTLM coding master (or just someone who knows what they're doing)

Thread Tools

Display

Bookmarks