Tech Question with Wordpress Custom Templates | HTML Pages.....

11 replies
Hey Everyone

I have a quick question about creating a new template / page for wordpress...

I know how to create the template with the following code

<?php
/*
TEMPLATE NAME: XYZ
*/
?>

But what I want to do is to use this as a standard template within my admin area that I can publish new pages with.....

I need it to be able to extract the html code that I insert within the WP Admin / New Page section And Display.

If I am in my c-panel I can add the code no problem but I will have to do this each time I want to create a new stand alone page....

So For instance if I want to create an Iframe I can do this manually in the C-Panel

<?php
/*
TEMPLATE NAME: XYZ
*/
?>

<iframe frameborder ="0" scrolling="yes" style="border:0px" src ="http://www.JOBLOW WEBSITE DOT COM" width="100%" height="100%">
<p>Your browser does not support iframes.</p>
</iframe>


============= I don't want to go into the CPanel every time

I want to set this up so that all I have to do is go into the
WP Admin
-Create New Page
---Template = XYZ
-----Insert My Code
-------Publish


Does this make sense?


Any help is much appreciated!

Sean
#custom #pages #question #static #tech #templates #wordpress
  • Profile picture of the author Elle Holder
    Have you already created the new custom post/page template?

    If so, go the to add new post/page screen. There should be a template drop box there now in the right sidebar. Just choose your new custom template from the pull down, and then create your new post/page using your custom template.

    If I understood your question, that should answer it!
    Signature

    {{ DiscussionBoard.errors[1620913].message }}
    • Profile picture of the author Sean A McAlister
      Thanks Elle,

      I hear ya on that....but I wanted to be able to create custom HTML pages straight from word press...and I could not get the new template to pull the html from WP..... but

      I figured it out....still needs a it of tweaking but

      If you go into your CP Panel

      ---WP-Content
      -----Your Theme Folder

      ---create a file and name it what you want and be sure to use .php at the end of that name.

      Then Insert this code

      ================
      <?php
      /*
      TEMPLATE NAME: html
      */
      ?>

      <div id="content">

      <?php if (have_posts()) : while (have_posts()) : the_post();?>
      <div class="post">
      <div class="entrytext">
      <?php the_content('<p class="serif">Read the rest of this page &raquo;</p>'); ?>
      <?php endwhile; endif; ?>

      </div>

      =================

      Be Sure to include the name of your new template at the beginning of this code where it says TEMPLATE NAME>

      Now you are good....

      When you go into WP
      ----Pages
      ------Create New Page

      You can select your new template from the right hand side (down a little on the page)

      And then insert any html you want within the WP Admin area vs the CPanel

      You can create as many Custom HTML pages as you want...

      And if you want to exclude those pages from your menu bar there is a WP Plugin for that.

      Sean
      Signature
      New Product Launches, Affiliate Marketplace

      Need More Sales? More Affiliates? LaunchBoards.com
      {{ DiscussionBoard.errors[1620987].message }}
  • Profile picture of the author Istvan Horvath
    To be honest I didn't really understand your OP.
    Now I see what the issue was.

    So, for the "posteriority"

    Normal WP themes have a template file with the name page.php - that is the default Page template. If it exists, WP recognizes its presence and you don't have to do anything.

    [Side note: as in the case of all 'content' templates, if they don't exist, the general fall back template is always index.php in the theme folder]

    As soon as you create a second Page template (following the steps in the posts above), in your WP admin panel for writing Pages you will see a drop-down menu for selecting which Page Template to use for that particular Page.
    The drop-down is NOT visible if you have only page.php in the template folder!

    You can have as many Page templates in a theme as many you need... all with different design even. Just make sure you use different div IDs and classes and define them in your stylesheet.

    Actually, you can even have different header and footer file included with them
    Signature

    {{ DiscussionBoard.errors[1621020].message }}
    • Profile picture of the author Sean A McAlister
      Thanks man....I know the original post was confusing I just didn't know how to spit it out....lol.

      That was the issue....I did not want Any themes just a blank white page as a template that I could modify within the WP Admin and add my own custom HTML...more importantly Iframes....and now I got it.



      Originally Posted by Istvan Horvath View Post

      To be honest I didn't really understand your OP.
      Now I see what the issue was.

      So, for the "posteriority"

      Normal WP themes have a template file with the name page.php - that is the default Page template. If it exists, WP recognizes its presence and you don't have to do anything.

      [Side note: as in the case of all 'content' templates, if they don't exist, the general fall back template is always index.php in the theme folder]

      As soon as you create a second Page template (following the steps in the posts above), in your WP admin panel for writing Pages you will see a drop-down menu for selecting which Page Template to use for that particular Page.
      The drop-down is NOT visible if you have only page.php in the template folder!

      You can have as many Page templates in a theme as many you need... all with different design even. Just make sure you use different div IDs and classes and define them in your stylesheet.

      Actually, you can even have different header and footer file included with them
      Signature
      New Product Launches, Affiliate Marketplace

      Need More Sales? More Affiliates? LaunchBoards.com
      {{ DiscussionBoard.errors[1621031].message }}
  • Profile picture of the author Istvan Horvath
    Let me add this: looking at the code you posted above:

    ================
    <?php
    /*
    TEMPLATE NAME: html
    */
    ?>

    <div id="content">

    <?php if (have_posts()) : while (have_posts()) : the_post();?>
    <div class="post">
    <div class="entrytext">
    <?php the_content('<p class="serif">Read the rest of this page &raquo;</p>'); ?>
    <?php endwhile; endif; ?>

    </div>

    =================
    ...if really that's all you have in that template, you may end up with "quirky" mode in some browsers.

    A normal html page still needs the basic HTML tags: html, head, body.
    If you want it blank (i.e. without the actual theme's design/layout) you still need to include some sort of header/footer.

    Here is how to do it:

    The WP themes call the header part with this code ('template tag')
    PHP Code:
    <?php get_header(); ?>
    and similarly the footer:
    PHP Code:
    <?php get_footer(); ?>
    If there is a header.php and footer.php, respectively, in your theme folder - they will be included at the top and the bottom of your content templates.

    The sidebar.php is included with the same technique - those PHP functions are defined in the WP engine.

    Now, if you want a different header to be included with your special Page template, then create a header2.php (or name it whatever.php) with a simple code:
    HTML Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
      <meta http-equiv="content-type" content="text/html; charset=utf-8">
      
      <title></title>
      </head>
      <body>
    (edit the title etc. or use WP template tags)

    and put this line above the content div:

    PHP Code:
    <?php include (TEMPLATEPATH '/whatever.php'); ?>
    Same with the footer2.php etc.

    The only thing you have to change in the code line above - the name of your file between the single quotes. Do not touch anything else in that line
    Signature

    {{ DiscussionBoard.errors[1621106].message }}
    • Profile picture of the author Sean A McAlister
      I wanted to be able to modify everything from WP...the <html> <head> <title> etc.

      So now I have a blank template that I can modify within WP

      This is what I was trying to accomplish...

      No header, no footer just a straight Iframe and still be able to use the wordpress plugins such as SEO, Bookmarks etc.


      http://newproductlaunch.launchboards...-forum-around/
      Signature
      New Product Launches, Affiliate Marketplace

      Need More Sales? More Affiliates? LaunchBoards.com
      {{ DiscussionBoard.errors[1621196].message }}
      • Profile picture of the author Istvan Horvath
        Originally Posted by Sean A McAlister View Post

        I wanted to be able to modify everything from WP...the <html> <head> <title> etc.

        So now I have a blank template that I can modify within WP
        No, you don't...
        That's what I am trying to tell you.

        The source code of the example page linked above:
        HTML Code:
        <div id="content">
        
          <div class="post">
          <div class="entrytext">
           <p><strong>Warrior Forum</strong><br />
        <html><br />
        <body><br />
        <iframe hspace="0" marginheight="0" scrolling="no" src ="http://www.warriorforum.com" width="100%" height="3500"></p>
        <p>Your browser does not support iframes.</p>
        <p></iframe><br />
        </html><br />
        </body></p>
        <!-- Social Bookmarks BEGIN -->
        <div class="social_bookmark">
        The html, head and body tags are all in the wrong place.

        As I said: some browsers won't bother and they will display it in an acceptable manner... others will do crazy things.
        Signature

        {{ DiscussionBoard.errors[1621225].message }}
        • Profile picture of the author Sean A McAlister
          I am with ya now!!

          So then when I call for the header file I would use my new header2.php
          right?


          I am going to go make some modifications...

          I owe you for this one....thanks for the help




          Originally Posted by Istvan Horvath View Post

          No, you don't...
          That's what I am trying to tell you.

          The source code of the example page linked above:
          HTML Code:
          <div id="content">
          
            <div class="post">
            <div class="entrytext">
             <p><strong>Warrior Forum</strong><br />
          <html><br />
          <body><br />
          <iframe hspace="0" marginheight="0" scrolling="no" src ="http://www.warriorforum.com" width="100%" height="3500"></p>
          <p>Your browser does not support iframes.</p>
          <p></iframe><br />
          </html><br />
          </body></p>
          <!-- Social Bookmarks BEGIN -->
          <div class="social_bookmark">
          The html, head and body tags are all in the wrong place.

          As I said: some browsers won't bother and they will display it in an acceptable manner... others will do crazy things.
          Signature
          New Product Launches, Affiliate Marketplace

          Need More Sales? More Affiliates? LaunchBoards.com
          {{ DiscussionBoard.errors[1621248].message }}
          • Profile picture of the author Istvan Horvath
            Originally Posted by Sean A McAlister View Post

            I am with ya now!!

            So then when I call for the header file I would use my new header2.php
            right?
            Yep, just use the code line I gave above for the non-default template files. It can be used with any file that resides in your theme's folder:

            PHP Code:
            <?php include (TEMPLATEPATH '/whatever.php'); ?>
            Replace only the "whatever" part with your filename, nothing else.

            You can include in this way a different header or footer or sidebar... sometimes I put my ads in a separate file and call it like this.

            Also, if you include a new header file... you can refer in it to a different stylesheet - changing the whole look of that page. Opens up lots of possibilities :p
            Signature

            {{ DiscussionBoard.errors[1621278].message }}
            • Profile picture of the author Sean A McAlister
              Istvan.....you are a gem....


              Looks much better now when you look at the source code.

              I just need to add the Title text and some meta data but I totally understand what you were talking about now!!!!

              Check it out
              http://newproductlaunch.launchboards...-forum-around/

              Do you have a suggestion on how I might be able to get rid of the white space above the IFrame? Even if is a colored bar of sorts.


              Again..... I owe you!! I really appreciate it
              Now I have to go dominate google :p
              Signature
              New Product Launches, Affiliate Marketplace

              Need More Sales? More Affiliates? LaunchBoards.com
              {{ DiscussionBoard.errors[1621302].message }}
  • Profile picture of the author Istvan Horvath
    Much better... but not finished yet

    1. You need the closing /body and /html tags to be moved at the end - try to include a footer.php containing just those AND delete them from inside the header file!

    2. You have a lot of obsolete p and br tags in the header. It should be only likethis:

    HTML Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
      <meta http-equiv="content-type" content="text/html; charset=utf-8">
      
      <title></title>
      </head>
      <body> 
    <div id="content">
    <div class="post">
     <div class="entrytext">
       <strong>Warrior Forum</strong>
    <iframe hspace="0" marginheight="0" scrolling="no" src ="http://www.warriorforum.com" width="100%" height="3500">
    Your browser does not support iframes.
    </iframe>
    And then put everything between the
    <!-- Social Bookmarks BEGIN -->
    ...
    <!-- Social Bookmarks END -->

    + the closing stuff
    HTML Code:
    <script type="text/javascript">$$('div.d175').each( function(e) { e.visualEffect('slide_up',{duration:0.5}) }); </script>  
       
      </div>
     </div>
    </html>
    </body>
    into the footer2.php and call it in the same way as the header2

    That should do it. At least it did on my computer
    Signature

    {{ DiscussionBoard.errors[1621390].message }}

Trending Topics