今天分享的WordPress主题模板开发制作的过程中,记录一些常用标签与使用说明,希望能帮助到大家。
WordPressCMS主题制作流程和代码
1、如何把静态页面制作成主题,多个CSS文件如何选择
2、制作顶部header.php和底部footer.php
3、如何制作幻灯片和tab式新闻栏目
4、如何在首页调用出各个分类下的文章以及图片栏目
5、制作首页的sidebar和添加热门标签栏目
6、制作分类页面category.php,以及分类页面sidebar
7、制作分页和面包屑导航。
8、制作内容页面single.php,添加摘要,上下一篇功能,添加相关文章和评论。
9、制作内容页面sidebar
10、添加搜索框功能search.php和文章浏览量功能。
一、如何把静态页面制作成主题,多个CSS文件如何选择
1、如何把静态页面制作成主题
2、有多个CSS文件的时候,用哪个文件作为style.css
3、如果头部有空行,用utf-8 无bom模式保存
制作一个最简单的主题,只需要两个文件,index.php和style.css
第一步,准备静态页面
第二步,制作index.php和style.css
第三步,给style.css添加版权信息
第四步:把主题上传到空间中wordpress安装路径,wp-content/themes/下面,这里主题的文件夹名字必须是英文
第五步,在wordpress后台启用主题
先给style.css添加版权信息 /* Theme Name: 全百科主题 Theme URI: http://www.quanbaike.com Description: 适应于大多数站长的主题 Author: 全百科 Author URI: http://www.quanbaike.com Version: 1.0 Tags: red, cms, quanbaike */ Style.css路径调用:<?php bloginfo( 'stylesheet_url' ); ?> 主题文件夹路径:<?php bloginfo('template_directory'); ?> 二、制作顶部header.php和底部footer.php 需要用到的调用标签: <?php get_header();?> <?php get_footer();?> <?php get_sidebar();?> 获取主页路径:<?php echo get_option('home'); ?> Header.php中用到的标签: <meta http-equiv="Content-Type" content="text/html; charset=<?php bloginfo( 'charset' ); ?>" /> <title><?php wp_title(''); ?><?php if(wp_title('', false)) { echo ' | '; } ?> <?php bloginfo('name'); ?></title> <?php wp_head(); ?> 设为首页、收藏本站: <script type="text/javascript"> // Bookmark function bookmark(title, url) { if (document.all) window.external.AddFavorite(url, title); else if (window.sidebar) window.sidebar.addPanel(title, url, "") } </script> <div style="float:right"> <a href="#" onClick="this.style.behavior='url(#default#homepage)';this.setHomePage('<?php bloginfo('url'); ?>');" class="homepage">设为首页</a> | <a href="#" onClick="javascript:bookmark('<?php bloginfo('name'); ?>','<?php bloginfo('url'); ?>');" target="_blank" class="favicon">加为收藏</a></div> 自定义css的导航调用方法: <?php $args=array( 'orderby' => 'id', 'order' => 'ASC' ); $categories=get_categories($args); foreach($categories as $category) { echo '<li class="thisclass"><a href="' . get_category_link( $category->term_id ) . '" title="' . sprintf( __( "View all posts in %s" ), $category->name ) . '" ' . '>' . $category->name.'</a></li>'; } ?> 日期向右靠齐: <div style="float:right"></div> 如何添加全站链接: <a href=” <?php echo get_option('home'); ?>”>全站链接1</a> 三、如何制作幻灯片和tab式新闻栏目 调用幻灯片js代码: <script src="<?php bloginfo('stylesheet_directory'); ?>/flash.js"></script> 时间调用:<?php the_time('m-d') ?> 最新文章: <?php $rand_posts = get_posts('numberposts=9&orderby=date');foreach($rand_posts as $post) : ?> <li><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></li> <?php endforeach;?> 随机文章: <?php $rand_posts = get_posts('numberposts=9&orderby=rand');foreach($rand_posts as $post) : ?> <li><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></li> <?php endforeach;?> 热门文章: <?php $post_num = 9; // 设置调用条数 $args = array( 'post_password' => '',