WordPress添加自定义文章类型

PetitQ WordPress教程 2019-3-08 1.52K 0 0

wordpress 默认的文章类型是 Post，需要增加自己个性的类型吗，如本站的说说，是一个像写心情一样的文章类型，简单记录某时的心情或感受。这个模块好早就弄好了，一直没有时间分享出来，今晚就分享它，让有需要的朋友们可以自己弄一个喜欢的个性类型。
在 functions.php 最后加入以下代码，首先要创建一个文章类型，这里的代码执行了在后台左侧菜单中创立了一个说说的文章类型入口，包括说说有列表、发表说说等。有几个参数要说明下：

1.menu_position => 9;这个是用来显示说说菜单图标出现的位置。9 是在“文章”这个菜单下。

也想出现在这里？联系我们吧

2.menu_icon => home_url( ‘app.png’, __FILE__ );显示在菜单中的图标；

```
//说说
```
```
add_action('init', 'my_custom_init');
```
```
function my_custom_init(){
```
```
$labels = array( 'name' => '说说',
```
```
'singular_name' => '说说',
```
```
'add_new' => '发表说说',
```
```
'add_new_item' => '发表说说',
```
```
'edit_item' => '编辑说说',
```
```
'new_item' => '新说说',
```
```
'view_item' => '查看说说',
```
```
'search_items' => '搜索说说',
```
```
'not_found' => '暂无说说',
```

'not_found_in_trash' => '没有已遗弃的说说',

```
'parent_item_colon' =>'', 
```
```
'menu_name' => '说说' );
```
```
$args = array( 'labels' => $labels,
```
```
'public' => true,
```
```
'publicly_queryable' => true,
```
```
'show_ui' => true,
```
```
'show_in_menu' => true,
```
```
'exclude_from_search' =>true,
```
```
'query_var' => true,
```
```
'rewrite' => true, 
```
```
'capability_type' => 'post',
```
```
'has_archive' => false, 
```
```
'hierarchical' => false,
```
```
'menu_position' => 9,
```

'menu_icon' => home_url( 'app.png', __FILE__ ),

'supports' => array('editor','author', 'title','custom-fields','excerpt','comments') );

```
register_post_type('shuoshuo',$args);
```
```
}
```

创建一个页面：shuoshuo 在主题 page 文件夹下创建一个页面，用来显示说说的内容，这里用到的图片都是在主题配置中有相关设置的，如果你主题中没有这些设置，直接换成图片的路径就是。

```
<?php
```
```
/* 
```
```
Template Name: 说说 
```
```
 */
```
```
get_header(); ?>
```
```
<style>
```
```
    /*说样式*/
```
```
body {
```

	background: url(<?php echo cs_get_option('i_shuoshuo_bg'); ?>) no-repeat;

```
	background-size: cover;
```
```
	background-position: center top;
```
```
	background-attachment: fixed;
```
```
}
```
```
.ss-title {
```
```
	background: #8BBF5D;
```
```
	display: inline-block;
```
```
	padding: 5px 15px;
```
```
	color: #fff;
```
```
	font-weight: normal;
```
```
	margin: 0;
```
```
}
```
```
.ss-div {
```
```
	padding: 0;
```
```
	overflow: hidden;
```
```
	border-bottom: 1px solid #8BBF5D;
```
```
	margin: 20px;
```
```
}
```
```
.ss-ny {
```
```
	display: inline-block;
```
```
	width: calc(100% - 150px);
```
```
	text-align: right;
```
```
	padding: 0;
```
```
	margin: 0;
```
```
	vertical-align: middle;
```
```
}
```
```
.ss-ny p {
```
```
	margin: 0;
```
```
	color: #fff;
```
```
	font-size: 14px;
```
```
	overflow: hidden;
```
```
	white-space: nowrap;
```
```
	text-overflow: ellipsis;
```
```
}
```

.ss-ul{list-style:none;padding:0 20px;position:relative;}

```
.ss-ul p{margin:0;}
```
```
.ss-ul::after {
```
```
	content: '';
```
```
	position: absolute;
```
```
	right: 140px;
```
```
	top:0;
```
```
	height: 100%;
```
```
	width: 50px;
```

	background: url(<?php echo cs_get_option('i_shuoshuo_bd'); ?>) repeat-y center top 0/50px;

```
}
```
```
.ss-li {
```
```
	background: rgba(255,255,255,.2);
```
```
	border-radius: 5px;
```
```
	position: relative;
```
```
	padding: 20px 0;
```
```
	margin: 20px 0;
```
```
	width: calc(100% - 200px);
```
```
	min-height: 150px;
```
```
	box-sizing: content-box
```
```
}
```
```
.ss-li::before {
```
```
	content: '';
```
```
	width: 100%;
```
```
	height: 100%;
```
```
	position: absolute;
```
```
	left: 0;
```
```
	top: 0;
```
```
	-webkit-filter:blur(20px);
```
```
	filter: blur(20px);
```
```
	z-index: -1;
```
```
}
```
```
.ss-li::after {
```
```
	content: '';
```
```
	width: 0px;
```
```
	height: 0px;
```
```
	border-style: solid;
```
```
	border-width: 0px 0 25px 25px;
```

	border-color: transparent transparent transparent rgba(255,255,255,.2);

```
	position: absolute;
```
```
	right: -25px;
```
```
	top: 40px;
```
```
}
```
```
.ss-li img {
```
```
	width: 150px;
```
```
	float: left;
```
```
	margin: 0 20px;
```
```
	height: 150px;
```
```
	border-radius: 10px;
```
```
}
```

.ss-li:hover .ss-time{background:rgba(0,0,0,.5);}

.ss-li:hover .ss-time:before{border-right-color:rgba(0,0,0,.5);}

```
.ss-lix::before {
```
```
	content: "";
```
```
	width: 0px;
```
```
	height: 0px;
```
```
	border-style: solid;
```
```
	border-width: 0px 0 20px 22px;
```

	border-color: transparent transparent transparent #fff;

```
	position: absolute;
```
```
	left: 730px;
```
```
	top: 23px;
```
```
}
```
```
.ss-txt {
```
```
	font-size: 16px;
```
```
	line-height: 1.7;
```
```
	text-indent: 2em;
```
```
	text-align: justify;
```
```
	color: #fff;
```
```
	padding: 0 20px;
```
```
	position: absolute;
```
```
	left: 170px;
```
```
	top: 50%;
```
```
	-webkit-transform: translateY(-50%);
```
```
	transform: translateY(-50%);
```
```
}
```
```
.ss-time {
```
```
	position: absolute;
```
```
	right: -180px;
```
```
	top: 0px;
```
```
	text-align: center;
```
```
	color: #fff;
```
```
	font-size: 14px;
```
```
	transition: all .3s linear;
```
```
	padding: 10px;
```
```
	box-sizing: content-box;
```
```
	border-radius: 10px;
```
```
}
```
```
.ss-time::before {
```
```
	content: "";
```
```
	position: absolute;
```
```
	left: -20px;
```
```
	top: 35px;
```
```
	border: 10px solid transparent;
```
```
	border-right-color: inherit;
```
```
	transition: all .3s linear;
```
```
}
```
```
.ss-d{
```
```
	display: block;
```
```
	font-size: 3em;
```
```
	font-weight: bold;
```
```
	text-align: center;
```
```
}
```
```
.ss-ym{
```
```
	font-size: 12px;
```
```
	text-align: center;
```
```
}
```
```
.ss-like{
```
```
    position: absolute;
```
```
    right: 10px;
```
```
    bottom:10px;
```
```
    color:#fff;
```
```
}
```
```
.ss-zz{
```
```
	position: absolute;
```
```
	right: 50px;
```
```
	bottom: 8px;
```
```
	height: 24px;
```
```
	line-height: 24px;
```
```
	color: #fff;
```
```
	vertical-align: middle;
```
```
}
```
```
.ss-zz img{
```
```
    width: 24px;
```
```
    height: 24px;
```
```
    border-radius: 50%;
```
```
    margin-right: 5px;
```
```
}
```
```
@media(max-width:1023px){
```
```
    .ss-div{margin:20px 0;}
```

    .ss-title{padding:2px 5px;font-size:16px;}

```
    .ss-ny{width: calc(100% - 80px);}
```
```
    .ss-ul{padding:0;}
```
```
    .ss-ul:after{display:none;}
```
```
    .ss-li{width:100%;min-height:0;}
```
```
    .ss-li:after{display:none;}
```

    .ss-txt{position:static;padding:0 10px 20px 10px;min-height:95px;-webkit-transform:none;transform:none;}

    .ss-time{position:static;border-radius:0;font-size:12px;float:right;margin-left:5px;margin-right:5px;margin-top:-25px;border-top:5px solid #fff;}

```
    .ss-time::before{display:none;}
```
```
    .ss-h{display:none;}
```
```
}
```
```
</style>
```
```
<main class="container" id="main">
```
```
	<div class="ss-div">
```

	    <h1 class="ss-title"><?php the_title(); ?></h1>

```
		<?php if (have_posts()): ?>
```

			<?php while (have_posts()) : the_post(); ?>

```
				<article class="ss-ny">
```
```
					<?php the_content(); ?>
```
```
				</article>
```
```
			<?php endwhile;  ?>
```
```
		<?php endif; ?>
```
```
	</div>
```
```
    <?php 
```

     $paged = (get_query_var('paged')) ? get_query_var('paged') : 1;

```
						$args = array(
```

						    'post_type' =>'shuoshuo',                               //显示哪些类型的文章

						    'post_status' =>'publish',                              //显示发布的

							'posts_per_page' => cs_get_option('i_shuoshuo_per_page'),  //每页显示几条记录，在主题后台设置

```
							'paged' => $paged,
```
```
						);
```
```
						query_posts($args);
```
```
    ?>
```
```
    <?php if (have_posts()) : ?>
```

        <ul class="post-wrap ss-ul">               <!--循环的样式一定要有：post-wrap-->

            <?php while (have_posts()) : the_post(); ?>

                <li class="ss-li wow slideInUp">

                     <?php get_template_part('template-parts/post/diy', 'shuoshuo'); ?>

```
                </li>
```
```
            <?php endwhile; ?>
```
```
        </ul>
```

    <?php get_template_part('template-parts/pagination'); ?>

```
    <?php endif;?>
```
```
</main>
```
```
<?php get_footer(); ?>
```

创建显示说说列表的模板，因本站的说说要用到 AJAX 加载，所以把显示的内容弄成一个模板，方便动态加载。在 template-parts/post 中新建一个 php,名为：diy-shuoshuo.php

<P class="ss-h" style="overflow:hidden;width:180px;"><img src="<?php echo catchFirstImg(); ?>"></P>

            <div class="ss-time"><span class="ss-d"><?php the_time('j'); ?></span><span class="ss-ym"><?php the_time('Y年m月'); ?></span></div>

            <P class="ss-txt"><?php echo get_post_excerpt('',250); ?></P>

            <a class="ss-zz" href="<?php echo get_author_posts_url( get_the_author_meta( 'ID' ) ) ?>" target="_blank">

					<?php echo get_avatar( get_the_author_meta('email'), '' ); ?>

```
					<?php echo get_the_author() ?>
```
```
				</a>
```

            <a href="javascript:;" data-action="ding" data-id="<?php the_ID(); ?>" class="ss-like  favorite<?php if(isset($_COOKIE['bigfa_ding_'.$post->ID])) echo ' done';?>">

                                    <?php if(isset($_COOKIE['bigfa_ding_'.$post->ID])): ?>

                                        <i class="fa fa-thumbs-up"></i>

                                    <?php else: ?>

                                        <i class="fa fa-thumbs-o-up"></i>

                                    <?php endif; ?>

                                    <span class="count">

									<?php if(get_post_meta($post->ID,'bigfa_ding',true)): ?>

                                        <?php echo get_post_meta($post->ID,'bigfa_ding',true); ?>

                                    <?php else: ?>

                                        <?php echo '0'; ?>

                                    <?php endif; ?>

```
								</span>
```
```
                                </a>
```

后台-页面-新建页面，最后在后台页面功能下，新建一个页面，模析就选刚才创建好的“说说”，保存就行。然后添加这个页面到网站的菜单上。要写说说，就像写文章一样，发表说说，CSS 样式都在以上代码中了，可根据自己的风格修改。
整体说说显示效果：

后台说说菜单：

WordPress 添加自定义文章类型

已有 381 人购买

永久更新：
演示数据：

立即购买

查看演示升级 VIP 立刻购买

炫酷企业建站作品展示WordPress中文模板

Supro - 极简电商网站模板WordPress汉化主题

Photon - 全屏摄影相册产品展示网站WordPress汉化主题

WordPress教程

WordPress添加自定义文章类型

WordPress 添加自定义文章类型

相关文章

获取当前 WordPress 环境所有生效的钩子 Hooks（Action 及 filter）

纯代码批量删除WordPress文章中的自定义栏目

WordPress控制文章评论最少字数和最大字数

发表回复取消回复

热销模板

WordPress教程

WordPress 添加自定义文章类型

相关文章

发表回复 取消回复

热销模板

发表回复取消回复