Different templates for pages

Forum
Last Post
Threads / Messages

Dinocanid

Member
Member
Joined
Aug 30, 2016
Messages
520
Points
18
Age
23
Location
Maryland, USA
Mysidian Dollar
43,334
Today I was curious about creating a landing page for Wild Souls, but I wanted it to have a different appearance than the usual site layout. After some research and experimenting, I now present this tutorial!

-Step 1-

You’re going to need to open class_template.php and scroll down to the function “assigntemplateVars”. Add this string of code underneath the other assigned variables:
PHP:
$fullurl = $_SERVER['REQUEST_URI'];
$this->assign('page_name',basename($fullurl));
What this does is get the name of the page you are currently on. This is in place of getting the file name, which constantly returned “index”. So if you visited “yoursite.com/about” for example, it would return “about”. That’s what we’re going to need that further on.

-Step 2-

Now go to the folder of the theme you are currently using and make a new tpl file. It can be called whatever you like, but for the sake of this tutorial I’ll call it “landing.tpl”.

Open it up and add in the HTML of your desired layout (including body tags). Here is an example of mine:
HTML:
<body class='text-center' style='background-image: none;'>
    <div class=' cover-container d-flex w-100 h-100 p-3 mx-auto flex-column'>
      <header class='masthead mb-auto'>
        <div class='inner'>
          <h3 class='masthead-brand'>{$document_title}</h3>
          <nav class='nav nav-masthead justify-content-center'>
            <a class='nav-link active' href='#'>Home</a>
            <a class='nav-link' href='#'>Features</a>
            <a class='nav-link' href='#'>Contact</a>
          </nav>
        </div>
      </header>
 
      <main role='main' class='inner cover'>
        <p class='lead'>{$document_content}</p>
      </main>
 
      <footer class='mastfoot mt-auto'>
        <div class='inner'>
          <p>Cover template for <a href='https://getbootstrap.com/'>Bootstrap</a>, by <a href='https://twitter.com/mdo'>@mdo</a>.</p>
        </div>
      </footer>
    </div>
</body>

-Step 3-

Now the good part! Take a look at this string of code here:
PHP:
{if $page_name == 'index' || $page_name == '' || $page_name == 'home'} 
    {include file="{$root}{$temp}{$theme}/landing.tpl"}
{else}
What this does is it uses the landing page template if the user is currently on “yoursite.com”, “yoursite.com/index”, or “yoursite.com/home”.

Now, here is the basic skeleton of how your template.tpl file should use that code:
HTML:
{include file="{$root}{$temp}{$theme}/header.tpl"}
<!-- User is on the landing page -->
{if $page_name == 'index' || $page_name == ''} 
    {include file="{$root}{$temp}{$theme}/landing.tpl"}
{else}
<!-- User is NOT on the landing page -->
    <body>
        <!-- Usual template html goes here... -->
    </body>
{/if}
</html>
Aaand that’s it! Now you can create more unique sites, rather than having every page look the same.
 
Today I was curious about creating a landing page for Wild Souls, but I wanted it to have a different appearance than the usual site layout. After some research and experimenting, I now present this tutorial!

-Step 1-

You’re going to need to open class_template.php and scroll down to the function “assigntemplateVars”. Add this string of code underneath the other assigned variables:
PHP:
$fullurl = $_SERVER['REQUEST_URI'];
$this->assign('page_name',basename($fullurl));
What this does is get the name of the page you are currently on. This is in place of getting the file name, which constantly returned “index”. So if you visited “yoursite.com/about” for example, it would return “about”. That’s what we’re going to need that further on.

-Step 2-

Now go to the folder of the theme you are currently using and make a new tpl file. It can be called whatever you like, but for the sake of this tutorial I’ll call it “landing.tpl”.

Open it up and add in the HTML of your desired layout (including body tags). Here is an example of mine:
HTML:
<body class='text-center' style='background-image: none;'>
    <div class=' cover-container d-flex w-100 h-100 p-3 mx-auto flex-column'>
      <header class='masthead mb-auto'>
        <div class='inner'>
          <h3 class='masthead-brand'>{$document_title}</h3>
          <nav class='nav nav-masthead justify-content-center'>
            <a class='nav-link active' href='#'>Home</a>
            <a class='nav-link' href='#'>Features</a>
            <a class='nav-link' href='#'>Contact</a>
          </nav>
        </div>
      </header>
 
      <main role='main' class='inner cover'>
        <p class='lead'>{$document_content}</p>
      </main>
 
      <footer class='mastfoot mt-auto'>
        <div class='inner'>
          <p>Cover template for <a href='https://getbootstrap.com/'>Bootstrap</a>, by <a href='https://twitter.com/mdo'>@mdo</a>.</p>
        </div>
      </footer>
    </div>
</body>

-Step 3-

Now the good part! Take a look at this string of code here:
PHP:
{if $page_name == 'index' || $page_name == '' || $page_name == 'home'} 
    {include file="{$root}{$temp}{$theme}/landing.tpl"}
{else}
What this does is it uses the landing page template if the user is currently on “yoursite.com”, “yoursite.com/index”, or “yoursite.com/home”.

Now, here is the basic skeleton of how your template.tpl file should use that code:
HTML:
{include file="{$root}{$temp}{$theme}/header.tpl"}
<!-- User is on the landing page -->
{if $page_name == 'index' || $page_name == ''} 
    {include file="{$root}{$temp}{$theme}/landing.tpl"}
{else}
<!-- User is NOT on the landing page -->
    <body>
        <!-- Usual template html goes here... -->
    </body>
{/if}
</html>
Aaand that’s it! Now you can create more unique sites, rather than having every page look the same.

I was following this I think pretty well until step 3 lol I got lost... I'm not sure where I'm suppose to paste the skeleton coding at in the template file's code.
 
I was following this I think pretty well until step 3 lol I got lost... I'm not sure where I'm suppose to paste the skeleton coding at in the template file's code.

The skeleton code is basically what the whole template file is supposed to look like. In this example, the page shows the landing template if you're on the index page. Where it says "usual template html goes here", that's where you post the template code that will be used on every other page.

I sometimes forget to check here so forgive my if I seem kinda dead lol. If you have discord though, mine is Dinocanid#6171. I usually answer there pretty much instantly
 
The skeleton code is basically what the whole template file is supposed to look like. In this example, the page shows the landing template if you're on the index page. Where it says "usual template html goes here", that's where you post the template code that will be used on every other page.

I sometimes forget to check here so forgive my if I seem kinda dead lol. If you have discord though, mine is Dinocanid#6171. I usually answer there pretty much instantly

Thank you so much! It's working now :D I'll add you on Discord though if that's okay?
 

Similar threads

Users who are viewing this thread

  • Forum Contains New Posts
  • Forum Contains No New Posts

Forum statistics

Threads
4,274
Messages
33,115
Members
1,602
Latest member
BerrieMilk
BETA

Latest Threads

Latest Posts

Top