Welcome to WebmasterWorld Guest from 50.19.190.144

Forum Moderators: coopster & jatar k

Message Too Old, No Replies

Simple PHP Layout Tutorial?

Anyone know of one?

     
7:44 pm on Jan 23, 2004 (gmt 0)

New User

10+ Year Member

joined:Jan 19, 2004
posts:17
votes: 0


Hey,

Does anyone know of a good (but easy to follow, I'm relatively new to PHP) PHP Layout tutorial? I'm looking for one similar to this one (http://www.free2code.net/tutorials/programming/php/4/PHP_Layouts.php), but easier to follow. I want to set my site up so it has like an index.php page, then when you click one of the navigation link it only loads the new content - not the whole layout (so the address bar would read like www.mydomain.com/index.php?id=links or whatever). Any ideas?

10:43 pm on Jan 23, 2004 (gmt 0)

Moderator

WebmasterWorld Administrator ergophobe is a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month

joined:Apr 25, 2002
posts:8126
votes: 88


First, a basic principle...


only loads the new content - not the whole layout

You can't do this with PHP in the sense that you mean. You can use PHP to generate HTML frames or Javascript that would do this. Remember, though, PHP is a server-side technology. Whether you load 17 files or one, PHP assembles a page to send to the browser and that is (almost) always true.

That said, there is still a HUGE advantage to using a template system. It won't save you anything in terms of bandwidth, but it will save you tons of time in terms of maintenance. It will be way easier to get a consistent look.

So, how could you go about it? Let's just make a really primitive, but nevertheless fairly effective template. Instead of urls like index.php?page=links, let's just go for the easiest case: links.php for your links, index.php for your index.

file: index.php
<?
$page_title = "My index page";
$content ="<h1>Main Headline</h1>";
$content .="<p>A bunch of stuff that I want to say</p>";

// now we include the default template and it expects (and requires)
// that the variables $page_title and $content be defined. It takes
// those values and plugs them into your template.

include("default_template.php");
?>

file: default_template.php
<html>
<head>
<title><?= $page_title;?></title>
</head>
<body>
<div class="header>
<?
include("header.php"); // header.php has the code that makes the top banner
?>
</div>
<div class="left_navigation_box">
<?
include ("left-nav.php"); // file that has your navigation links etc
?>
</div>
<div class="content">
<?= $content;?>
</div>
<div class="footer">
<? include("footer.php");?>
</div>
</body>
</html>

I think that will do what you want and should be fairly easy to follow.

Tom

11:20 pm on Jan 23, 2004 (gmt 0)

New User

10+ Year Member

joined:Jan 19, 2004
posts:17
votes: 0


Tom,

Thanks for the reply. Currently I am using the include() command. For example I have a "top.php" with all the layout that appears above my content, and a "bottom.php" that contains all layout beneath my content. A sample page looks like

<?php include 'top.php';?>
All of my content of the page here
<?php include 'bottom.php';?>

Would you suggest using your way, or staying with mine? In yours, how often do I need to make a new line for $content?

2:06 am on Jan 24, 2004 (gmt 0)

Moderator

WebmasterWorld Administrator ergophobe is a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month

joined:Apr 25, 2002
posts:8126
votes: 88


Let's see. I would say my way is a small step up from yours on the way to building more flexible and robust templates. Other people might differ. The main difference with my version is this:

- no output occurs until the template file is included
- no processing except variable substitution in the template file.

Advantage - better separation of logic and presentation.

BTW, do you know that there are off-the-shelf templating systems? you might look into those.


how often do I need to make a new line for $content?

As often as you wish.

More often = more readable for debugging, but larger page size, since all those line feeds, tabs, and spaces end up getting sent to the user.

Tom

6:24 pm on Feb 22, 2004 (gmt 0)

New User

10+ Year Member

joined:Feb 22, 2004
posts:9
votes: 0


Im a little confused with the:

<?
$content ="<h1>Main Headline</h1>";
$content .="<p>A bunch of stuff that I want to say</p>";
?>

Why did you use a dot in the second variable? Would the below do exactly the same or is there some advantage with the above?

<?
$content1 ="<h1>Main Headline</h1>";
$content2 ="<p>A bunch of stuff that I want to say</p>";
?>

<html>
<body>
<div class="content">
<h1><?= $content1;?></h1>
<p><?= $content2;?></p>
</div>
</body>
</html>

Thanks for your help.

Andy

7:41 pm on Feb 22, 2004 (gmt 0)

Full Member

10+ Year Member

joined:Nov 17, 2002
posts:313
votes: 0


dj_lysuc,

The '.' before the = means that it is adding that line to the variable, in this case $content.

Lets see:

$content ="<h1>Main Headline</h1>";
$content .="<p>A bunch of stuff that I want to say</p>";

The .= means that it is added to the $content variable, meaning you can output everything at one, and don't have to worry about splitting it up.

I would use this in a database driven content management system, where you can output the content of the page, from fields in a database. So you can store page title, heading, content in 3 spearate fields, then on the page, it can just stick them all together and output them.

Whereas:

$content ="<h1>Main Headline</h1>";
$content2 ="<p>A bunch of stuff that I want to say</p>";

In your example, you have to output both $content and $content2 - you are having to deal with more variables.

Hope this answers your question.

wruk999.

8:02 pm on Feb 22, 2004 (gmt 0)

Senior Member

WebmasterWorld Senior Member 10+ Year Member

joined:Jan 8, 2004
posts:865
votes: 0


Just throwin in my input, not saying it's better or worse.

I set up all my pages like so,

<?
include( 'includes/page_setup.php' );
include( 'includes/content/widgets/setup.php' );
include( 'includes/page_header.php' );
include( 'includes/content/widgets/content.php' );
include( 'includes/page_footer.php' );
?>

The includes folder has CHMOD settings to 700 so nobody can view it (600 might work also, don't remember)

  • The includes/page_setup.php file has database setup, gzip setup, nav setup, and a few functions and variables that I use from page to page.

  • The includes/content/widgets/setup.php file is where I setup all my info for my page. Including page title, description, database retrieval, and variables i'll be using on my page.

  • The includes/page_header.php file starts with doctype, nav setup and all the basic header stuff that I want to use on each page.

  • The includes/content/widgets/content.php file is just the look of the page. I just plug in the variables I created in the page setup.

  • The footer.php file is just the standard footer stuff.

    The reason widgets/page_setup.php is before the header.php file is so I can plug variables into the header also.

    The nice thing about doing it this way is that when I need to edit something it's easy to find. If I want to change the look of my content I just open up the widgets/content.php and edit there. If I want to change the logic of the page I open up widgets/setup.php and edit there.

    Another nice thing about doing it this way is that you can just plug in your include file. Just define which page you would like to use to show your content in your setup.php like so,

    <?
    include( 'includes/page_setup.php' );
    include( 'includes/content/widgets/setup.php' );
    include( 'includes/page_header.php' );
    include( 'includes/content/widgets/'. $dynamic .'.php' );
    include( 'includes/page_footer.php' );
    ?>

  • 4:17 am on Feb 26, 2004 (gmt 0)

    Junior Member

    10+ Year Member

    joined:Jan 31, 2003
    posts:66
    votes: 0


    Hi Twist,
    How about expanding on all this
    <?
    //Give us a this setup.php
    include( 'includes/page_setup.php' );
    //...and this one also.
    include( 'includes/content/widgets/setup.php' );
    include( 'includes/page_header.php' );
    include( 'includes/content/widgets/content.php' );
    include( 'includes/page_footer.php' );
    ?>

    in different folders I need to change to different css file
    and...
    diferent meta keywords and meta descriptions to enhance search engine results

    I have noticed var...$keywords, $meta descriptions.
    I have not captured control of vars...help!

    Where am I coming from?:
    Here is my index.php...
    <?php
    $title ='Home';
    $server = $_SERVER["DOCUMENT_ROOT"]."/";
    include $server."inc_header.php";
    ?>
    <body>
    <?php
    include $server."inc_logo.php";
    include $server."inc_topnav.php";
    include $server."inc_leftnav.php";
    include $server."inc_right.php";
    <div class="content">
    <em class="source"></em>
    <h1></h1>

    <div id="footer">
    <?php
    include $server."inc_footer.php";
    ?>
    How can I crunch it and include adding different components in the header?

    Russell Griechen

    8:19 pm on Feb 26, 2004 (gmt 0)

    Senior Member

    WebmasterWorld Senior Member 10+ Year Member

    joined:Jan 8, 2004
    posts:865
    votes: 0


    Here is another example. I hope it helps. Pretend widgets.php is your index.php, just replace the word widget with index.

  • widgets.php
    <?
    include( 'includes/widgets/setup.php' );
    include( 'includes/page_header.php' );
    include( 'includes/widgets/content.php' );
    include( 'includes/page_footer.php' );
    ?>

  • widgets/setup.php
    <?
    $page_title = 'Widget Central';
    $meta_keywords = 'keyword1 keyword2 keyword3';
    $meta_description = 'The worlds top widget website';
    $style_sheet = 'widget';
    $page_heading = 'Welcome to the Worlds No.1 Widget Page';
    $top_of_page = 'widgets.php';
    ?>

  • page_header.php
    <?
    echo'

    <html>
    <head>
    <title>'. $page_title .'</title>
    <meta name="Keywords" content="'. $meta_keywords .'" />
    <meta name="Description" content="'. $page_description .'" />
    <link rel="StyleSheet" href="'. $style_sheet .'.css" type="text/css" />
    </head>
    <body>
    <div class="heading"><h1>'. $page_heading .'</h1></div>
    <div class="content">

    ';
    ?>

  • widgets/content.php
    <?
    echo'

    This page is all about widgets.

    ';
    ?>

  • page_footer.php
    <?
    echo'

    </div>
    <div class="footer"><a href="http://example.com/'. $top_of_page .'">Return to top</a></div>

    ';
    ?>

    The above should produce a complete widgets page. The good part comes when you want to create another page. Lets say that next you want to create a page called sprockets.php. Just create a folder called sprockets and put 2 files in it, sprockets/setup.php and sprockets/content.php.

  • sprockets.php
    <?
    include( 'includes/sprockets/setup.php' );
    include( 'includes/page_header.php' );
    include( 'includes/sprockets/content.php' );
    include( 'includes/page_footer.php' );
    ?>
  • 1:21 pm on Feb 28, 2004 (gmt 0)

    Junior Member

    10+ Year Member

    joined:Jan 31, 2003
    posts:66
    votes: 0


    Thanks Twist.

    Just what I was looking for.

    8:19 pm on Feb 28, 2004 (gmt 0)

    New User

    10+ Year Member

    joined:Feb 22, 2004
    posts:9
    votes: 0


    Thanks for the details Twist, I wanted URL's which directed to different pages as well and the title picture to change for different pages, and I have come up with this, will it work?!

    /index.php?page=page

    index.php
    <?
    if (!$page) $page = index;
    include( 'includes/'.$page.'/setup.php' );
    include( 'includes/page_header.php' );
    include( 'includes/'.$page.'/content.php' );
    include( 'includes/page_footer.php' );
    ?>

    index/setup.php
    <?
    $title_pic = 'main'
    $page_title = 'Welcome';
    $meta_keywords = 'keyword1 keyword2 keyword3';
    $meta_description = 'The worlds top website about me.';
    ?>

    page_header.php
    <?
    echo'
    <html>
    <head>
    <title>My Website - '. $page_title .'</title>
    <meta name="Keywords" content="Me, website, '. $meta_keywords .'" />
    <meta name="Description" content="'. $page_description .'" />
    <link rel="StyleSheet" href="http://domain.com/.css" type="text/css" />
    </head>
    <body>
    <img src="../images/'.$title_pic.'.jpg" width="700" height="60">
    ';
    ?>

    index/content.php
    <?
    echo'
    This page is all about me.
    ';
    ?>

    page_footer.php
    <?
    echo'
    </div>
    <div class="footer"><a href="http://domain.com/index.php">Return to top</a></div>
    ';
    ?>

    10:38 pm on Feb 29, 2004 (gmt 0)

    Senior Member

    WebmasterWorld Senior Member 10+ Year Member

    joined:Jan 8, 2004
    posts:865
    votes: 0


    if (!$page) $page = index;

    If index it text you should write it like this 'index' or if it is a variable like this $index. Thats the only thing that seems to stand out to me.

    Seems to look like it will work, tell me how it goes.

    11:49 pm on Feb 29, 2004 (gmt 0)

    New User

    10+ Year Member

    joined:Feb 22, 2004
    posts:9
    votes: 0


    kool, thx. I will have a play shortly when I have setup some pages.
    9:18 pm on Mar 1, 2004 (gmt 0)

    Junior Member

    10+ Year Member

    joined:Jan 31, 2003
    posts:66
    votes: 0


    Hey Twist...

    widgets/setup.php
    <?
    $page_title = 'Widget Central';
    $meta_keywords = 'keyword1 keyword2 keyword3';
    $meta_description = 'The worlds top widget website';
    $style_sheet = 'widget';
    $page_heading = 'Welcome to the Worlds No.1 Widget Page';
    $top_of_page = 'widgets.php';
    ?>


    Should this setup.php be in:
    includes/widgets/setup.php
    or:
    /widgets/setup.php

    ?

    5:42 am on Mar 2, 2004 (gmt 0)

    Junior Member

    10+ Year Member

    joined:Jan 31, 2003
    posts:66
    votes: 0


    Another issue...
    Stylesheets.

    page_header.php
    <?
    echo'
    <html>
    <head>
    <title>'. $page_title .'</title>
    <meta name="Keywords" content="'. $meta_keywords .'" />
    <meta name="Description" content="'. $page_description .'" />
    <link rel="StyleSheet" href="'. $style_sheet .'.css" type="text/css" />
    </head>
    <body>
    <div class="heading"><h1>'. $page_heading .'</h1></div>
    <div class="content">

    ';
    ?>


    How would I handle import stylesheets.
    <style type="text/css" media="screen">@import "style.css";</style>
    syntax? in above quoted code.
    8:01 am on Mar 2, 2004 (gmt 0)

    Senior Member

    WebmasterWorld Senior Member 10+ Year Member

    joined:Jan 8, 2004
    posts:865
    votes: 0


    How would I handle import stylesheets.

    Not sure what you mean exactly. If you are asking if you can define what import stylesheet you would like to use and then echo in your php statement, it's the same as for regular style sheets.

    You add variables to a echo statement the same way for anything.


    $var1 = 'I ';
    $var2 = 'like ';
    $var3 = 'eating ';
    $var4 = 'cheese.';

    echo $var1 . $var2 . $var3 . $var4;


    would display, I like eating cheese.

    echo 'Sometimes '. $var1 . $var2 . $var3 .'chedder '. $cheese;

    would display, Sometimes I like eating chedder cheese

    Even this will work,

    $var1 = 'I ';
    $var1 .= 'like ';
    $var1 .= 'eating ';
    $var1 .= 'cheese.';

    echo $var1;

    would display, I like eating cheese.

     

    Join The Conversation

    Moderators and Top Contributors

    Hot Threads This Week

    Featured Threads

    Free SEO Tools

    Hire Expert Members