ICompany FAQ and Tips and Tricks

From IThemes Codex
Revision as of 17:45, January 6, 2011 by Ronald (Talk | contribs)
Jump to: navigation, search

How to create a page template without sidebars

First, create a new page template (http://codex.wordpress.org/Pages#Page_Templates)

Name it whatever you want, let's say that

Template Name: Page No Sidebar

makes sense. Copy the contents of the page.php file in your template, leaving the code described above intact.

Your template should now look like this:

Template Name: Page no Sidebar
<?php get_header(); ?>

<div id="content_wide" class="inner clearfix">

	<?php if (have_posts()) : while (have_posts()) : the_post(); // the loop ?>

	<!--post title-->
	<h1 id="post-<?php the_ID(); ?>"><?php the_title(); ?></h1>

	<!--post text with the read more link-->
	<?php the_content(); ?>

	<!--for paginate posts-->
	<?php link_pages('<p><strong>Pages:</strong> ', '</p>', 'number'); ?>

    <?php //comments_template(); // uncomment this if you want to include comments template ?>

	<?php endwhile; // end of one post ?>
	<?php else : // do not delete ?>

	<h3>Page Not Found</h3>
    <p>We're sorry, but the page you are looking for isn't here.</p>
    <p>Try searching for the page you are looking for or using the navigation in the header or sidebar</p>

    <?php endif; // do not delete ?>


<!--include footer-->
<?php get_footer(); ?>

What you see is the standard page template with the following modifications (makes better sense if you look at the standard page.php file):

  1. . The header to indicate this is a template
  2. . Changed <div id="content" class="inner clearfix">v to <code><div id="content_wide" class="inner clearfix">
  3. . removed <div id="inner"> (AND the corresponding </div> !!)
  4. . removed the include of the sidebar and the tabber area

Finally, the content_wide is a new element that needs to be added to your style.css file. To do so, you can copy the CSS styling for content and the content img and change like this:

 Content Wide Styling for my page template
#content_wide {
   	background: #ffffff;
	float: left;
	margin: 0px;
        padding: 0px 10px;
	display: block;

/* The following may cause alignment issues and may be taken out: */

#content_wide img {
	float: left;
	margin: 0px 10px 5px 0px;

Then add this code to the end of your style.css. Why at the end? That is where you eventually will find all your own custom css coding. Easier to trace should you wish to upgrade your theme and re-apply your own modifications.

Now go into your Write Page panel, and select the "Page No Sidebar" template.

Back to the main iCompany page

Personal tools
iThemes Codex
Codex Navigation