<body <?php body_class(); ?> data-XXX="<?php if(wp_is_mobile()){ echo 'example';} ?>"></body>
body[data-XXX=example] {
css:
}
获取分类(cat&term)信息
WordPress get_terms()的使用方法：
例1.输出term相关信息
<ul class="products">
<?php $terms = get_terms('category',array(
'with_thumbnail' => true,
'hide_empty' => false,
) );
if ( ! empty( $terms ) && ! is_wp_error( $terms ) ){
foreach ( $terms as $term ) {?>
<li>
<a href="<?php echo get_term_link($term->term_id) ?>">
<div class="term-pic">
<?php the_term_thumbnail($term ->term_id, 'post-thumbnail');?>
</div>
<div>
<h3>
<?php echo $term->name;?>
</h3>
<div>
<?php echo $term->description;?>
</div>
</div>
</a>
</li>
<?php }
}?>
</ul>
例2.循环term显示相应的文章
<?php
$terms = get_terms([
'taxonomy' => 'area',
'hide_empty' => true,
]);
foreach( $terms as $term):?>
<div class="area-part">
<h3>
<?php echo $term->name; ?>
</h3>
<ul class="posts-list">
<?php
$args = array(
'post_type'=>'store',
'tax_query' => array(
array(
'taxonomy' => 'area',
'field' => 'id',
'terms' => $term->term_id,
),
),
);
$query = new WP_Query( $args );
if( $query->have_posts()):
while($query->have_posts()):$query->the_post();
get_template_part('partials/content','shopList');
//Restore orginial post Data
wp_reset_postdata();
endwhile;?>
</ul>
<?php endif;?>
</div>
<?php endforeach;
?>
其他
get_terms()默认参数：
$get_terms_default_attributes = array (
'taxonomy' => 'category', //empty string(''), false, 0 don't work, and return empty array
'orderby' => 'name',
'order' => 'ASC',
'hide_empty' => true, //can be 1, '1' too
'include' => 'all', //empty string(''), false, 0 don't work, and return empty array
'exclude' => 'all', //empty string(''), false, 0 don't work, and return empty array
'exclude_tree' => 'all', //empty string(''), false, 0 don't work, and return empty array
'number' => false, //can be 0, '0', '' too
'offset' => '',
'fields' => 'all',
'name' => '',
'slug' => '',
'hierarchical' => true, //can be 1, '1' too
'search' => '',
'name__like' => '',
'description__like' => '',
'pad_counts' => false, //can be 0, '0', '' too
'get' => '',
'child_of' => false, //can be 0, '0', '' too
'childless' => false,
'cache_domain' => 'core',
'update_term_meta_cache' => true, //can be 1, '1' too
'meta_query' => '',
'meta_key' => array(),
'meta_value'=> '',
);
get_terms()数组返回值:
array(1) {
[0]=>
object(WP_Term) (11) {
["term_id"]=> //int
["name"]=> //string
["slug"]=> //string
["term_group"]=> //int
["term_taxonomy_id"]=> //int
["taxonomy"]=> //string
["description"]=> //string
["parent"]=> //int
["count"]=> // int
["filter"]=> //string
["meta"]=> array(0) { // presumably this would be some returned meta-data?
}
}
}
鼠标点击导航button效果
页面内外锚点跳转
function hashSome() {
var $hash = window.location.hash;
if ($hash.length) {
var $hash = $hash.split("#")[1];
if ($($hash).length) {
var $pst = $('.'+$hash).offset().top - $(".site_header").height();;
$("html,body").stop().animate({
scrollTop: $pst
}, 1000);
}
} else {
// console.log("No hash");
};
}
$(window).on("load", function () { hashSome(); });function hashChangeFunction() {
var a = $("a.internal-link");
a.on("click", function (event) {
event.preventDefault();
var $this = $(this);
var $hash = $this.attr("href");
var $pst = $('.'+$hash).offset().top - $(".site_header").height();
$("html,body").stop().animate({
scrollTop: $pst
}, 1000);
});
}
$(function () { hashChangeFunction();}对应内容切换
<style>
*{
margin: 0;
padding: 0;
box-sizing: border-box;
}
ul{
list-style: none;
max-width: 980px;
margin: auto;
display: flex;
justify-content: space-between;
}
ul>li{
width:20%;
text-align: center;
border-left: 1px solid #333;
float: left;
cursor: pointer;
line-height: 40px;
}
ul>li:last-child{
border-right: 1px solid #333;
}
.items{
max-width: 980px;
margin: 30px auto;
}
.item-content{
background:#999;
margin: 10px 0;
width: 100%;
height: 100px;
padding: 10px;
}
.active{
background: #339;
color: #fff;
position: relative;
}
.active::after{
content: '';
position: absolute;
display: block;
left: 50%;
transform: translate(-50%,-50%) rotate(45deg);
width:16px;
height: 16px;
background:#339;
}
.item-content{
display: none;
}
.items .item-content:first-child{
display: block;
}
</style>
<ul>
<li class="active">A</li>
<li>B</li>
<li>C</li>
<li>D</li>
<li>E</li>
</ul>
<div class="items">
<div class="item-content">1</div>
<div class="item-content">2</div>
<div class="item-content">3</div>
<div class="item-content">4</div>
<div class="item-content">5</div>
</div>
<script>
$(document).ready(function(){
"use strict";
$("ul li").on("click",function(){
$(this).addClass("active").siblings().removeClass("active");
$(this).parent().next().children().eq($(this).index()).show().siblings().hide();
})
})
</script>
wordpress获取特色图片地址
function get_attachment($size, $id)
{
if (empty($size)) {
$size = ‘medium’;
}
$output = ”;
if (has_post_thumbnail($id)) {
$output = wp_get_attachment_image_url(get_post_thumbnail_id($id), $size);
} else {
$attachments = get_posts(array(
‘post_type’ => ‘attachment’,
‘numberposts’ => 1,
‘post_parent’ => $id,
‘post_mime_type’ => ‘image’,
));
if (!empty($attachments)) {
$output = wp_get_attachment_image_url($attachments[0]->ID, $size);
} else {
$output = get_template_directory_uri() . ‘/assets/img/default.jpg’;
}
}
return $output;
}
wordpress小工具
①注册
/* Register widget area*/
function theme_widgets_init() {
register_sidebar( array(
'name' => __( 'Blog Sidebar', 'twentyseventeen' ),
'id' => 'sidebar-1',
'description' => __( 'Add widgets here to appear in your sidebar on blog posts and archive pages.', 'twentyseventeen' ),
'before_widget' => '<section id="%1$s" class="widget %2$s">',
'after_widget' => '</section>',
'before_title' => '<h2 class="widget-title">',
'after_title' => '</h2>',
) );
}
add_action( 'widgets_init', 'theme_widgets_init' );
②输出
<?php
if ( ! is_active_sidebar( 'sidebar-1' ) ) {
return;
}
?>
<aside id="secondary" class="widget-area" role="complementary" aria-label="<?php esc_attr_e( 'Blog Sidebar', '' ); ?>">
<?php dynamic_sidebar( 'sidebar-1' ); ?>
</aside><!-- #secondary -->
jQuery隐藏元素依次出现
$('.mb ul li').hide();
var i;
var j=500;
$('.mb ul li').each(function(){
i=$(this).index();
tt=function(id){
$('.mb ul li').eq(id).fadeIn();
}
setTimeout('tt('+i+')',j);
j=j+500;
});
function showItems() {
for (var $i = 0; $i < $('.featured-ja').find("span").length; $i++) {
(function (n) {
setTimeout(function () {
$('.featured-ja').find("span").eq(n).addClass('showOpacity');
if (n == $('.featured-ja').find("span").length - 1) {
setTimeout(function () {
$('.featured-en').addClass('showOpacity2');
}, 300);
}
}, n * 200);
}($i));
}
}