WordPress自定义页面模板的方法图解 - WordPress

WordPress自定义页面模板的方法图解

用过一段时间wordpress的人都会这个WordPress:自定义页面模板,但还有很多新手不知道页面模板功能.

页面模板的作用: 让WordPress的页面有不同的布局或者样式,wordpress提供了页面功能,可以让我们建立不同的页面以展示不同的内容,如联系方式、留言本等等,很多人都喜欢建个这个,这些页面建立好了,可以自定义标题和内容,但是不同的页面,布局却是完全一样的,没法按自己的需求去改变和添加,有时候我们只想在某一个页面的边栏上添加个什么东西,比如说图片,这时就可以通过自定义模板来实现特定功能的页面.

1、通过ftp工具在你的主题目录下新建一个php文件,比如,links.php,名字随便取.

2、编辑这个新建的文件,在文件头部加上这段代码:

<?php  /*   Template Name:友链   */   ?> 

3、将你的page.php中的内容直接拷贝到links.php当中.

4、然后在links.php 中找到你需要改变的地方,我想,最主要修改的一个是边栏,一个是文章内容,至于怎么改,得看你的需求.

5、修改并保存好这个文件后,创建一个新页面或者修改已存在的页面,在右下边有个[页面模板]的面板,在下拉菜单中选中[友链]后保存就可以了.

links.php当中可以是任何内容,不一定一定要复制page.php中的内容,甚至你可以在其中直接放上html代码而不加任何其它东西.

创建一个联系(contact)页面模板

如果你的网站有 联系单页面(contact page),这样会很容易让您的网站访问者发送电子邮件到你的WordPress博客管理员,下面是一个示例是新建一个联系人的单页面模板主题,你可以把下面的代码复制下:

<?php  /*   Template Name: Contact   */   ?>  <?php    $nameError  =  '' ;  $emailError  =  '' ;  $commentError  =  '' ;  $sumError  =  '' ;    if (isset( $_POST [ 'submitted' ])) {           if (trim( $_POST [ 'contactName' ]) ===  '' ) {               $nameError  =  'Please enter your name.' ;               $hasError  = true;          }  else  {               $name  = trim( $_POST [ 'contactName' ]);          }             if (trim( $_POST [ 'email' ]) ===  '' )  {               $emailError  =  'Please enter your email address.' ;               $hasError  = true;          }  else   if  (! eregi ( "^[A-Z0-9._%-]+@[A-Z0-9._%-]+.[A-Z]{2,4}$" , trim( $_POST [ 'email' ]))) {               $emailError  =  'You entered an invalid email address.' ;               $hasError  = true;          }  else  {               $email  = trim( $_POST [ 'email' ]);          }             if (trim( $_POST [ 'comments' ]) ===  '' ) {               $commentError  =  'Please enter a message.' ;               $hasError  = true;          }  else  {               if (function_exists( 'stripslashes' )) {                   $comments  =  stripslashes (trim( $_POST [ 'comments' ]));              }  else  {                   $comments  = trim( $_POST [ 'comments' ]);              }          }             if (trim( $_POST [ 'sum' ]) ===  ''  || trim( $_POST [ 'sum' ]) !=  '11'  ){               $sumError  =  "Please enter what's 7 + 4" ;               $hasError  = true;          }             if (!isset( $hasError )) {               $emailTo  = get_option( 'pu_email' );               if  (!isset( $emailTo ) || ( $emailTo  ==  '' ) ){                   $emailTo  = get_option( 'admin_email' );              }               $subject  =  '[Contact Form] From ' . $name ;               $body  =  "Name: $name nnEmail: $email nnComments: $comments" ;               $headers  =  'From: ' . $name . ' <' . $emailTo . '>'  .  "rn"  .  'Reply-To: '  .  $emailTo ;                mail( $emailTo ,  $subject ,  $body ,  $headers );               $emailSent  = true;          }    } ?>    <?php get_header(); ?>    <section  class = "box grid_9 list_posts" >          <div  class = "inner" >                    <?php  if  (have_posts()) :  while  (have_posts()) : the_post(); ?>                        <div <?php post_class() ?> id= "post-<?php the_ID(); ?>" >                            <h1  class = "entry-title" ><?php the_title(); ?></h1>                            <div  class = "entry-content" >                                <div  class = "contact-form clearfix" >                                <?php  if (isset( $emailSent ) &&  $emailSent  == true) { ?>                                    <div  class = "thanks" >                                      <p><?php _e( 'Thanks, your email was sent successfully.' ,  'framework' ) ?></p>                                  </div>                                <?php }  else  { ?>                                    <?php the_content(); ?>                                    <?php  if (isset( $hasError ) || isset( $captchaError )) { ?>                                      <p  class = "error" ><?php _e( 'Sorry, an error occured.' ,  'framework' ) ?><p>                                  <?php } ?>                                    <form action= "<?php the_permalink(); ?>"  id= "contactForm"  method= "post" >                                      <ul  class = "contactform" >                                          <li><label  for = "contactName" ><?php _e( 'Name:' ,  'framework' ) ?></label>                                              <input type= "text"  name= "contactName"  id= "contactName"  value= "<?php if(isset($_POST['contactName'])) echo $_POST['contactName'];?>"   class = "required requiredField"  />                                              <?php  if ( $nameError  !=  '' ) { ?>                                                  <span  class = "error" ><?php  echo   $nameError ; ?></span>                                              <?php } ?>                                          </li>                                            <li><label  for = "email" ><?php _e( 'Email:' ,  'framework' ) ?></label>                                              <input type= "text"  name= "email"  id= "email"  value= "<?php if(isset($_POST['email']))  echo $_POST['email'];?>"   class = "required requiredField email"  />                                              <?php  if ( $emailError  !=  '' ) { ?>                                                  <span  class = "error" ><?php  echo   $emailError ; ?></span>                                              <?php } ?>                                          </li>                                            <li  class = "textarea" ><label  for = "commentsText" ><?php _e( 'Message:' ,  'framework' ) ?></label>                                              <textarea name= "comments"  id= "commentsText"  rows= "20"  cols= "30"   class = "required requiredField" ><?php  if (isset( $_POST [ 'comments' ])) {  if (function_exists( 'stripslashes' )) {  echo   stripslashes ( $_POST [ 'comments' ]); }  else  {  echo   $_POST [ 'comments' ]; } } ?></textarea>                                              <?php  if ( $commentError  !=  '' ) { ?>                                                  <span  class = "error" ><?php  echo   $commentError ; ?></span>                                              <?php } ?>                                          </li>                                            <li><label  for = "sum" ><?php _e( '7 + 4:' ,  'framework' ) ?></label>                                              <input type= "text"  name= "sum"  id= "sum"  value= "<?php if(isset($_POST['sum'])) echo $_POST['sum'];?>"   class = "required requiredField"  />                                              <?php  if ( $sumError  !=  '' ) { ?>                                                  <br/><span  class = "error" ><?php  echo   $sumError ; ?></span>                                              <?php } ?>                                          </li>                                            <li  class = "buttons" >                                              <input type= "hidden"  name= "submitted"  id= "submitted"  value= "true"  />                                              <label></label><button  class = "button-message"  type= "submit" ><?php _e( 'Send Email' ,  'framework' ) ?></button>                                          </li>                                      </ul>                                  </form>                              <?php } ?>                                </div>                          </div>                      </div>                        <?php  endwhile ;  else : ?>                        <div id= "post-0"  <?php post_class() ?>>                            <h1  class = "entry-title" ><?php _e( 'Error 404 - Not Found' ,  'framework' ) ?></h1>                            <div  class = "entry-content" >                              <p><?php _e( "Sorry, but you are looking for something that isn't here." ,  "framework" ) ?></p>                              <?php get_search_form(); ?>                          </div>                      </div>                    <?php  endif ; ?>                </div>      </section>        <?php get_sidebar(); ?>    <?php get_footer(); ?> 

创建一个宽屏页面模板

全宽页面模板是其主要区别在于,侧边栏已经被删除,使得在内容区域伸展跨越页面宽度的模板,代码如下:

<?php  /*   Template Name: Fullwidth   */   ?>    <?php get_header(); ?>    <section  class = "box grid_12 list_posts" >          <div  class = "inner" >                <article id= "primary"   class = "hfeed" >              <?php  if  (have_posts()) :  while  (have_posts()) : the_post(); ?>                    <div <?php post_class() ?> id= "post-<?php the_ID(); ?>" >                      <h1  class = "entry-title" ><?php the_title(); ?></h1>                        <div  class = "entry-content" >                          <?php the_content(); ?>                          <?php wp_link_pages( array ( 'before'  =>  '<p><strong>' .__( 'Pages:' ,  'framework' ). '</strong> ' ,  'after'  =>  '</p>' ,  'next_or_number'  =>  'number' )); ?>                        </div>                  </div>                    <?php comments_template( '' , true); ?>                    <?php  endwhile ;  endif ; ?>              </article>              </div>          </section>    <?php get_footer(); ?> 

创建一个存档页面模板

存档页面模板将显示您的所有旧的文章列表,在这个模板也将按月按类别列出前30天的所有的列表,代码如下:

<?php  /*   Template Name: Archives   */   ?>    <?php get_header(); ?>    <section  class = "box grid_9 list_posts" >          <div  class = "inner" >                    <?php  if  (have_posts()) :  while  (have_posts()) : the_post(); ?>                        <div <?php post_class() ?> id= "post-<?php the_ID(); ?>" >                            <h1  class = "entry-title" ><?php the_title(); ?></h1>                            <div  class = "entry-content" >                                <div  class = "archive-lists" >                                    <h4><?php _e( 'Last 30 Posts' ,  'framework' ) ?></h4>                                    <ul>                                  <?php  $archive_30  = get_posts( 'numberposts=30' );                                   foreach ( $archive_30   as   $post ) : ?>                                      <li><a href= "<?php the_permalink(); ?>" ><?php the_title();?></a></li>                                  <?php  endforeach ; ?>                                  </ul>                                    <h4><?php _e( 'Archives by Month:' ,  'framework' ) ?></h4>                                    <ul>                                      <?php wp_get_archives( 'type=monthly' ); ?>                                  </ul>                                    <h4><?php _e( 'Archives by Subject:' ,  'framework' ) ?></h4>                                    <ul>                                      <?php wp_list_categories(  'title_li='  ); ?>                                  </ul>                                </div>              </div>          </div>                        <?php  endwhile ;  else : ?>                        <div id= "post-0"  <?php post_class() ?>>                            <h1  class = "entry-title" ><?php _e( 'Error 404 - Not Found' ,  'framework' ) ?></h1>                            <div  class = "entry-content" >                              <p><?php _e( "Sorry, but you are looking for something that isn't here." ,  "framework" ) ?></p>                              <?php get_search_form(); ?>                          </div>                      </div>                    <?php  endif ; ?>          </div>      </section>        <?php get_sidebar(); ?>    <?php get_footer(); ?> 

好了,到这为止,有关创建WordPress的自定义页面模板就介绍到这里,希望你通过这篇文章的简单了解,可以制作出各种漂亮的页面模板.

查看更多关于WordPress自定义页面模板的方法图解 - WordPress的详细内容...