2、添加主题版权信息:
Theme Name: WP一点优化主题
Theme URI: http://www.seoyh.net
Description:这是我们做的第一个企业主题哦
Author: WP一点优化
Author URI: http://www.seoyh.net
Version: 1.0
Tags: white, company, WP一点优化, blue
3、制作模板首页文件index.php;
4、修改style.css文件/图片路径:
<?php bloginfo( 'stylesheet_url' ); ?>
5、修改所有相对路径为WP绝对路径:
<?php bloginfo('template_directory'); ?>
第2节:头部模板文件(header.php)制作
1、分离头部,改用WP调用,调用顶部标签:
<?php get_header();?>
2、元信息调用
编码格式:
SEO标签: <?php include( TEMPLATEPATH . '/seo.php' ); ?>
Hook标签: <?php wp_head(); ?>
去除顶部空白问题:
新建functions.php函数文件并添加下面代码。
<?php add_filter( 'show_admin_bar', '__return_false' );?>
3、制作导航:
3-1、新建 functions.php 函数文件并添加以下代码:
<?php
//自定义菜单
register_nav_menus(
array(
'header-menu' => __( '导航自定义菜单' ),
)
);?>
3-2、导航位置添加菜单调用代码:
<?php wp_nav_menu( array( 'container' => '','menu_class' => 'navigation','menu_id' => 'nav_sgBhgn') ); ?>
3-3、设置菜单。
扩展知识 菜单的参数:http://codex.wordpress.org/Function_Reference/wp_nav_menu
//最外层容器的标签名,默认div
'container' => 'div',
//最外层容器的class名
'container_class' => 'mainNavBlock',
//最外层容器的id名
'container_id' => 'menu',
//导航菜单ul标签的class名
'menu_class' => 'mainNav',
//导航菜单ul标签的id名
'menu_id' => "nav",
//是否打印,默认是true,如果想将导航的代码作为赋值使用,可设置为false
'echo' => true,
//备用的导航菜单函数,用于没有在后台设置导航时调用
'fallback_cb' => 'the_main_nav',
//显示在导航a标签之前
'before' => ''
,
//显示在导航a标签之后
'after' => '',
//显示在导航链接名之前
'link_before' => '',
//显示在导航链接名之后
'link_after' => '',
//显示的菜单层数,默认0,0是显示所有层
'depth' => 0,
//调用一个对象定义显示导航菜单
'walker' => new Walker_Nav_Menu(),
//指定显示的导航名,如果没有设置,则显示第一个
'theme_location' => 'primary',
第3节:侧边栏模板文件(sidebar.php)制作
1、分离侧边栏文件,并使用侧边栏标签调回:
<?php get_sidebar();?>
2、调用某个分类下的文章
<?php $rand_posts =
get_posts('category=ID&numberposts=5&orderby=date');foreach($rand_posts as $post) : ?>
<li><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></li>
<?php endforeach;?>
更多按钮链接:
<?php echo get_option('home'); ?>/
3、产品树形结构调用
<?php wp_list_categories('title_li=0&orderby=name&show_count=0&depth=0'); ?>
Css样式:
.prod_type{float:left;width:250px;overflow:hidden;margin-left:15px;padding-bottom:10px; }
.prod_type ul li{background:url("images/jiahao.gif")no-repeat scroll 0 10px transparent;padding-left: 15px;font-weight:bold;}
.prod_type ul li ul li{background: url("images/minus.gif") no-repeat scroll 0 10px transparent;margin-left: -8px;font-weight: normal;}
.prod_type ul li a {height:30px;line-height:30px;}
.prod_type ul ul{ display:block!important;}
4、友情链接只在首页显示
<?php if ( is_home()) { ?>
<?php wp_list_bookmarks('title_li=&categorize=0&orderby=rand&limit=24'); ?>
<?php } ?>
找回3.5版本后隐藏的友链管理功能:
函数文件functions.php,粘贴以下代码:
<?php add_filter( 'pre_option_link_manager_enabled', '__return_true' ); ?>
第4节:底部模板文件(footer.php)制作
1、分离底部文件
通过WP标签调用回来,调用底部标签:
<?php get_footer();?>
2、版权信息:
Copyright © 2014-2018 ”> <?php bloginfo(‘name’); ?> All rights reserved. 版权所有
3、添加hook标签
<?php wp_footer();?>
第三课、首页模板文件(index.php)制作
第1节:首页内容修改
1、修改公司介绍信息:
<?php query_posts('page_id=2');//修改页面ID ?>
2、调用最新产品:
2-1、 循环调用:
<?php if (have_posts()) : ?>
2-2、标题调用:
<?php echo mb_strimwidth(get_the_title(), 0, 16,''); ?>
2-3、缩略图调用步骤:
(A)、复制缩略图文件thumbnail.php到主题文件夹中;
(B)、在主题文件夹里面的functions.php文件中添加下面代码:
<?php
//支持外链缩略图
if ( function_exists(‘add_theme_support’) )
add_theme_support(‘post-thumbnails’);
function catch_first_image() {
global $post, $posts;
$first_img = ‘’;
ob_start();
ob_end_clean();
$output = preg_match_all(’//i’, $post->post_content, $matches);
$first_img = $matches [1] [0];
if(empty($first_img)){ //Defines a default image
r
a
n
d
o
m
=
m
t
r
a
n
d
(
1
,
2
)
;
e
c
h
o
g
e
t
b
l
o
g
i
n
f
o
(
′
s
t
y
l
e
s
h
e
e
t
d
i
r
e
c
t
o
r
y
′
)
;
e
c
h
o
′
/
i
m
a
g
e
s
/
r
a
n
d
o
m
/
′
.
random = mt_rand(1, 2); echo get_bloginfo ( 'stylesheet_directory' ); echo '/images/random/'.
random=mtrand(1,2);echogetbloginfo(′stylesheetdirectory′);echo′/images/random/′.random.’.jpg’;
}
return $first_img;
}
?>
(C)、在images文件夹下建立random文件夹,放入默认缩略图,图片名称必须为1.jgp,2.jpg
这种格式。以数字1~10作为名字。
(D)、通过下面代码调用:
<?php include( TEMPLATEPATH . '/thumbnail.php' ); ?>
2-4、控制输出分类和显示数量:
在循环标签 if (have_posts()) 和while (have_posts()) : the_post(); 之间添加以下代码:
<?php query_posts('cat=3' . $mcatID. '&caller_get_posts=1&showposts=6'); ?>
第2节:滚动产品调用
1、删除原有图片调用所有代码
2、放上我们自己的div代码:
3、复制以下js代码至主题文件中:
4、复制css样式
#demo {background: #FFF;overflow:hidden;width: 500px; }
#demo img { border: 3px solid #F2F2F2; }
#indemo { float: left; width: 800%; }
#demo1 { float: left; }
#demo2 { float: left; }
.thumb{float:left;width:167px;height:150px;text-align:center;}
.thumb img{width:160px;height:120px;}
5、放置循环代码;
<?php if (have_posts()) : ?>
6、替换循环标签里面的代码为缩略图调用代码和标题:
<?php include(TEMPLATEPATH . '/thumbnail.php'); ?>
<?php echo mb_strimwidth(get_the_title(), 0, 16, ''); ?>
第四课、其他页面制作
第1节:文章列表页面(archive.php)制作
1、制作archive.php页面
2、调用header、sidebar、footer文件
头部标签: <?php get_header();?>
底部标签: <?php get_footer();?>
侧边栏标签: <?php get_sidebar();?>
3、文章列表调用:
3-1、循环调用文章
<?php if (have_posts()) : ?>
3-2、标题调用:
<?php echo mb_strimwidth(get_the_title(), 0, 16,''); ?>
日期调用: <?php the_date_xml()?>
标题调用: <?php wp_title('');?>
4、分页插件使用wp-pagenavi插件
<?php wp_pagenavi(); ?>
- 分页方法二(不使用插件)
1.在functions.php里的?>之前添加如下代码
function par_pagenavi($range = 9){
global $paged, $wp_query;
if ( !$max_page ) {$max_page = $wp_query->max_num_pages;}
if($max_page > 1){if(!$paged){$paged = 1;}
if($paged != 1){echo " 返回首页 ";}
previous_posts_link(' 上一页 ');
if($max_page > $range){
if($paged < $range){for($i = 1; $i <= ($range + 1); $i++){echo "$i";}}
elseif($paged >= ($max_page - ceil(($range/2)))){
for($i = $max_page - $range; $i <= $max_page; $i++){echo "$i";}}
elseif($paged >= $range && $paged < ($max_page - ceil(($range/2)))){
for($i = ($paged - ceil($range/2)); $i <= ($paged + ceil(($range/2))); $i++){echo "$i";}}}
else{for($i = 1; $i <= $max_page; $i++){echo "$i";}}
next_posts_link(' 下一页 ');
if($paged != $max_page){echo " 最后一页 ";}}
}
添加下面样式到style.css文件夹
.page_navi{overflow:hidden;width:100%;text-align:center}
.page_navi a{height:36px;border:1px solid #DDD;-webkit-border-radius:12px;-moz-border-radius:12px;border-radius:12px;color:#888;text-decoration:none;line-height:36px;margin:2px;padding:3px 8px}
.page_navi a:hover,.page_navi a.current{border:1px solid #FFBB76;color:#FF7200;font-weight:bolder}
添加以下代码到category,page等你想添加的页面
第2节:产品展示页面(category-slug.php / category-id.php)
1、制作category-slug.php页面;
2、调用header、sidebar、footer文件
头部标签: <?php get_header();?>
底部标签: <?php get_footer();?>
侧边栏标签: <?php get_sidebar();?>
3、产品调用
3-1、循环调用:
<?php if (have_posts()) : ?>
3-2、标题调用:
<?php echo mb_strimwidth(get_the_title(), 0, 16,''); ?>
3-3、图片调用:
<?php include( TEMPLATEPATH . '/thumbnail.php' ); ?>
3-4、页面名字调用:
<?php wp_title('');?>
3-5、分页插件使用wp-pagenavi:
<?php wp_pagenavi(); ?>
第3节:文章内容页面(single.php)制作
1、制作single.php
2、调用header、sidebar、footer文件
头部标签: <?php get_header();?>
底部标签: <?php get_footer();?>
侧边栏标签: <?php get_sidebar();?>
3、文章内容调用:
3-1、循环标签
<?php if (have_posts()) : ?>
3-2、元信息调用
日期调用: <?php the_date_xml()?>
页面标题: <?php wp_title('');?>
文章内容: <?php the_content(""); ?>
所属分类: <?php the_category(', ') ?>
文章标签: <?php the_tags('标签: ', ', ', ''); ?>
分类名称 <?php single_cat_title(); ?>
3-3、大小调整js代码:
3-4、调整大小:
16px
14px
12px
4、文章下一篇上一篇调用:
上一篇调用: <?php previous_post_link('上一篇: %link'); ?>
下一篇调用: <?php next_post_link('下一篇: %link'); ?>
扩展:上一篇下一篇另一种写法:
<?php if (get_previous_post()) { previous_post_link(‘%link’);} else {echo “没有了,已经是最后文章”;} ?>
5、浏览数显示方法:
安装浏览数插件:WP-PostViews
<?php if(function_exists('the_views')) { the_views(); } ?>
6、最新文章
<?php $rand_posts = get_posts('numberposts=10&orderby=date');foreach($rand_posts as $post) : ?>
- <?php echo mb_strimwidth(get_the_title(), 0, 32, ''); ?>
- <?php endforeach;?>
获取主题存放路径:
<?php bloginfo('template_directory'); ?>7、相关文章调用(通过分类来判断相关文章)
- * <?php the_title(); ?>
- <?php endwhile; else : ?>
- * 暂无相关文章
- <?php endif; wp_reset_query(); } ?>
第4节:页面文件(page.php)制作
page页面的制作一般和single一样,只是需要修改一些代码.第5节:搜索页面(search.php)和404页面(404.php)制作
1、制作search.php,直接复制archive.php分类目录页面
并在<?php endwhile; ?>后添加未找到提示文字:
<?php else: ?>未找到
没有找到任何文章!
2、wordpress默认搜索代码
修改后的搜索框代码:
本站搜索:
3、热门标签:
<?php wp_tag_cloud('smallest=10&largest=10&number=5&order=RAND&separator= , '); ?>4、404页面制作
4-1、下载404静态页面;
4-2、复制到主题文件夹并修改路径。第五课、模板组件专题
第1节:二级导航
1、添加一个jquery库:
2、使用谷歌jquery库文件加载
3、添加CSS样式:
/* 二级菜单 */
.sub-menu{
display:none;/初始状态下隐藏子目录/
position:absolute;/显示最顶层/
}
.sub-menu li{
width:100%;/*显示子目录宽度/针对IE6/
clear:both;/垂直显示/
background:#000;/子目录背景颜色/
}Wordpress找回密码:
1.在数据库中找到wp-users
然后点击编辑
在users-pass里修改密码为:5d41402abc4b2a76b9719d911017c592
然后在登陆时密码选项里输入hello2.在sql命令里输入
update wp_users set user_pass=md5(“123456”) where user_login=‘admin’;
这里新密码为123456插入html文档时乱码解决办法:
修改wordpress后台登陆地址方法:
<? function login_protection(){ if($_GET['cdx'] != 'cdx')header('Location: http://localhost/'); } add_action('login_enqueue_scripts','login_protection');?>
在当前主题的functions.php文件里添加如下代码:方法二:打开wordpress根目录找到wp-login.php文件用编辑器打开在55行左右找到如下代码:
if ( $shake_error_codes && $wp_error->get_error_code() && in_array( $wp_error->get_error_code(), $shake_error_codes ) )
add_action( ‘login_head’, ‘wp_shake_js’, 12 );在其代码之下加上一段代码
if($_GET[“qq”]!=“1032106247”){ header('Location:/404 '); }
Wordpress侧边栏调用子分类方法:
<?php function get_category_root_id($cat) { $this_category = get_category($cat); // 取得当前分类 while($this_category->category_parent) // 若当前分类有上级分类时,循环 { $this_category = get_category($this_category->category_parent); // 将当前分类设为上级分类(往上爬) } return$this_category->term_id; // 返回根分类的id号 } ?>
1.在functions.php文件中添加如下代码:
<?php wp_list_categories("child_of=".get_category_root_id(the_category_ID(false)). "&depth=0&hide_empty=0&title_li="); ?>2.在某个“子”分类模板中添加如下代码:
Wordpress更改后台默认登陆界面外观:
<?php function diy_login_page() { echo '' . "\n"; } add_action( 'login_enqueue_scripts', 'diy_login_page' ); ?>
1.在functions.php文件中添加如下代码:2.在主题根目录新建login.css文件,加入以下代码:
html{
background: transparent;
}
body.login{
background: #000 url(“images/login_bg.jpg”) no-repeat center top;
}
body.login div#login h1 a {
display: none;
}
body.login div#login h1{
display: block;
height: 70px;
}
.login form,.login form .input, .login input[type=“text”],.wp-core-ui .button-primary,.wp-core-ui .button-primary:hover{
-webkit-box-shadow:none;
box-shadow:none;
-webkit-border-radius: 0;
border-radius: 0;
}
.login form{
background: rgba(10,35,35,.4);
border: none;
}
.login form .input, .login input[type=“text”]{
background: transparent;
border-color: #444;
color: #eee;
}
.login form .input:focus{
border-color: #666;
}
.login label{
color: #999;
line-height: 35px;
}.wp-core-ui .button.button-primary{
background: rgba(187,64,48,.7);
border: none;
line-height: 12px;
padding: 10px 30px;
}
.wp-core-ui .button-primary:hover{
background: rgba(0,0,0,.4);
-webkit-transition: background 0.5s ease-out 0s;
-moz-transition: background 0.5s ease-out 0s;
-ms-transition: background 0.5s ease-out 0s;
-o-transition: background 0.5s ease-out 0s;
transition: background 0.5s ease-out 0s;
}
.wp-core-ui .button.button-primary,
.login label,
.login form .input{
font-family: ‘Microsoft YaHei’;
}
#nav,#backtoblog{
display: none;
}
/白色/
body.login{
background: #fff url(“/upload/pic/2024/11/25/ahbslt0cbmf.jpg”);//图片调用标签
}
.login label{
color: #000;
line-height: 35px;
}
.login form{
background: rgba(255,255,255,.6);
}
.login form .input, .login input[type=“text”]{
background: transparent;
border-color: rgba(50,50,50,.5);
color: #666;
}
.login form .input:focus{
border-color: rgba(50,50,50,.8);
}Wordpress手动添加面包屑导航(内部链接):
1.在functions.php文件中添加如下代码:/**
-
WordPress 添加面包屑导航
-
https://www.wpdaxue.com/wordpress-add-a-breadcrumb.html
’.__( ‘You are here:’ , ‘cmp’ );
*/
function cmp_breadcrumbs() {
$delimiter = ‘»’; // 分隔符
$before = ‘’; // 在当前链接前插入
$after = ‘’; // 在当前链接后插入
if ( !is_home() && !is_front_page() || is_paged() ) {
echo ‘
global $post;
$homeLink = home_url();
echo ’ echo ‘ c a t c o d e = g e t c a t e g o r y p a r e n t s ( cat_code = get_category_parents( catcode=getcategoryparents(cat, TRUE, ’ ’ . $delimiter . ’ ‘);
echo $cat_code = str_replace (’ echo $before . get_the_title() . $after;
}
} elseif ( !is_single() && !is_page() && get_post_type() != ‘post’ ) {
$post_type = get_post_type_object(get_post_type());
echo $before . $post_type->labels->singular_name . $after;
} elseif ( is_attachment() ) { // 附件
p a r e n t = g e t p o s t ( parent = get_post( parent=getpost(post->post_parent);
c a t = g e t t h e c a t e g o r y ( cat = get_the_category( cat=getthecategory(parent->ID); $cat = c a t [ 0 ] ; e c h o ′ < a i t e m p r o p = " b r e a d c r u m b " h r e f = " ′ . g e t p e r m a l i n k ( cat[0]; echo 'cat[0];echo′<aitemprop="breadcrumb"href="′.getpermalink(parent) . ‘">’ . $parent->post_title . ’ ’ . $delimiter . ’ ';
echo $before . get_the_title() . KaTeX parse error: Expected 'EOF', got '}' at position 8: after; }̲ elseif ( is_pa…post->post_parent ) { // 页面
echo $before . get_the_title() . $after;
} elseif ( is_page() && $post->post_parent ) { // 父级页面
$parent_id = $post->post_parent;
b r e a d c r u m b s = a r r a y ( ) ; w h i l e ( breadcrumbs = array(); while ( breadcrumbs=array();while(parent_id) {
p a g e = g e t p a g e ( page = get_page( page=getpage(parent_id);
b r e a d c r u m b s [ ] = ′ < a i t e m p r o p = " b r e a d c r u m b " h r e f = " ′ . g e t p e r m a l i n k ( breadcrumbs[] = 'breadcrumbs[]=′<aitemprop="breadcrumb"href="′.getpermalink(page->ID) . ‘">’ . get_the_title($page->ID) . ‘’;
$parent_id = $page->post_parent;
}
b r e a d c r u m b s = a r r a y r e v e r s e ( breadcrumbs = array_reverse( breadcrumbs=arrayreverse(breadcrumbs);
foreach ($breadcrumbs as $crumb) echo $crumb . ’ ’ . $delimiter . ’ ';
echo $before . get_the_title() . $after;
} elseif ( is_search() ) { // 搜索结果
echo $before ;
printf( __( ‘Search Results for: %s’, ‘cmp’ ), get_search_query() );
echo $after;
} elseif ( is_tag() ) { //标签 存档
echo $before ;
printf( __( ‘Tag Archives: %s’, ‘cmp’ ), single_tag_title( ‘’, false ) );
echo $after;
} elseif ( is_author() ) { // 作者存档
global $author;
u s e r d a t a = g e t u s e r d a t a ( userdata = get_userdata( userdata=getuserdata(author);
echo $before ;
printf( __( ‘Author Archives: %s’, ‘cmp’ ), $userdata->display_name );
echo $after;
} elseif ( is_404() ) { // 404 页面
echo $before;
_e( ‘Not Found’, ‘cmp’ );
echo $after;
}
if ( get_query_var(‘paged’) ) { // 分页
if ( is_category() || is_day() || is_month() || is_year() || is_search() || is_tag() || is_author() )
echo sprintf( __( ‘( Page %s )’, ‘cmp’ ), get_query_var(‘paged’) );
}
echo ‘ ’;
}
}2.在对应页面里面,加入以下代码:
Wordpress标签云添加nofollow
Functions.php文件中加入如下代码:add_filter(‘wp_tag_cloud’,‘tag_cloud_nofollow’);
function tag_cloud_nofollow($cloud){
c l o u d = p r e g r e p l a c e ( ′ / < a / ′ , ′ < a r e l = " n o f o l l o w " ′ , cloud=preg_replace('/cloud=pregreplace(′/<a/′,′<arel="nofollow"′,cloud);
return $cloud;
}Wordpress获取当前文章id的代码(留言板用)
<?php echo $post->ID; ?>Wordpress设置不同的文章页面模板
1.首先需要给functions.php添加模板选择功能,代码如下:add_theme_support( ‘post-formats’, array( ‘aside’, ‘chat’,‘gallery’,‘image’,‘link’, ‘quote’, ‘status’, ‘video’, ‘audio’ ) );
数据类型如下:
Standard:只是一个普通的文章没有什么特别的东西。
Aside:类似于一个facebook的更新。
Link:链接到外部网站。
Image:只是一个简单的图像,没有什么巨大的。
Quote:引用。
Status:一个简短的状态更新,类似于微博。
Video:一个视频。
Audio:音频文件。
Chat:全文聊天。
2.后台新建第二文章模板文件如:single-video.php 后可在里面自定义页面格式。此处后缀文件名应与之前在functions文件里添加代码的数据类型同名。3.在functions.php里添加页面判断代码:
add_action(‘template_include’, ‘load_single_template’);
function load_single_template($template) {
$new_template = ‘’;// single post template
if( is_single() ) {
global $post;// template for post with video format if ( has_post_format( 'video' )) { // use template file single-video.php for video format $new_template = locate_template(array('single-video.php' )); }
}
return (’’ != $new_template) ? $new_template : $template;
}4.完成以上工作之后,直接后台发布文章选择对一个模板便可。
Wordpress option framework框架使用:
1.在主函数functions中添加如下代码:
if (!function_exists(‘optionsframework_init’)){
define(‘OPTIONS_FRAMEWORK_DIRECTORY’, get_template_directory_uri().’/inc/’);
require_once dirname(FILE).’/inc/options-framework.php’;}
<?php echo of_get_option('相应的id', '如果没有内容则输出我'); ?>2.在整合框架文件后,对应调用位置添加如下代码:
-