顶部、底部模版调用
知识点
get_header | 页面头部(header.PHP) |
get_footer | 页面底部(footer.php) |
功能实现
在/wp-content/themes/shouce下新建header.php内容如下:
<!doctype HTML> <head> <meta Http-equiv="Content-Type" content="text/html; charset=<?php echo get_bloginfo('charset'); ?>" /> <title><?php bloginfo('name'); ?></title> <meta name="description" content="<?php bloginfo('description'); ?>" /> <link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" /> <?php wp_head(); ?> </head> <body>
在/wp-content/themes/shouce下新建footer.php内容如下:
<div class="c"> <div class="footer"> <p> 版权所有 <a href="<? bloginfo('url'); ?>"><? bloginfo('name'); ?></a> </p> </div> </div> <?php wp_footer(); ?> </body> </html>
修改/wp-content/themes/shouce/index.php如下:
<?php get_header(); ?> <div id="header"> <div id="headerimg"> <h1> <a href="<?php echo get_option('home'); ?>"><?php bloginfo('name'); ?></a> </h1> <div class="description"><?php bloginfo('description'); ?></div> </div> </div> <div class="c"> <div id="left-box"> <div id="home-loop"> <?php if (have_posts ()) { while ( have_posts () ) { // 获取下一篇文章的信息,并且将信息存入全局变量 $post 中 the_post (); ?> <div class="post-item"> <div class="post-title"> <h2> <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a> </h2> </div> <div class="post-content"><?php the_content(); ?></div> <div class="post-meta"> 类别:<?php the_category(','); ?><span>|</span> 作者:<?php the_author(); ?><span>|</span> 时间:<?php the_time( 'Y-m-d' ); ?> <?php edit_post_link('修改', ' <span>|</span> ', '' ); ?> </div> </div> <?php } } else { echo '没有日志可以显示'; } ?> </div> <div class="posts_nav_link"> <?php posts_nav_link(); ?> </div> </div> <?php get_sidebar(); ?> </div> <?php get_footer(); ?>
效果图: