当前位置:首页>技术教程wordpress教程> 为WordPress网站增加说说功能

为WordPress网站增加说说功能

网上有很多方法,可以用代码法也可以用王柏元的BY说说插件。一般用WordPress的网友好像都不太喜欢用插件,不过这个插件倒是很小很小,和代码没啥区别。好处就是不需要手动把代码加到相应主题文件里,以后换主题也省事。此文也参考了流年博客,特此感谢。

方法一:使用插件:王柏元的BY说说插件

方法二:打开主题目录下的functions.php文件,添加以下代码:

//新建说说功能

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’ => null,

‘supports’ => array(‘editor’,‘author’,‘title’, ‘custom-fields’) );

register_post_type(‘shuoshuo’,$args);

}

此时后台就会有说说菜单出现了。

为WordPress网站增加说说功能

2、新建shuoshuo.php文件,上传到模板目录。代码如下:



<?php /* Template Name: 说说 */ get_header(); ?>

<section id=“container”>
<div class=“row”>

<?php the_post(); ?>

<article id=“post-box”>>
<div class=“panel”>
<div class=“shuoshuo”>
<ul class=“archives-monthlisting”><?php query_posts(“post_type=shuoshuo&post_status=publish&posts_per_page=-1”);if (have_posts()) : while (have_posts()) : the_post(); ?>
<li><img class=“zhutou” src=“../touxiang.jpg” alt=“作者头像” /><!–?php the_time(‘Y年n月j日G:H’); ?–>
<div class=“shuoshuo-content”>

<div class=“shuoshuo-meta”>— <?php the_author() ?></div>
</div>
</li>
</ul>
</div>
</div>
</article>

</div>
</section><?php get_footer(); ?>

3、后台新建说说页面,模板选择“说说” ,然后保存。

4、添加CSS样式。根据你的主题要求添加到合适的地方。一般是添加到style.css 里。这里的样式也是在网上参考的,可根据自己的情况更改。标红的地方是一个波浪线,可将图片下载到自己的服务器里,更改链接地址即可。

/*说样式*/.shuoshuo {

position: relative;

padding: 10px 0;

}

.shuoshuo li {

padding: 8px 0;

display: block;

}

.shuoshuo-content {

box-shadow: 0 0 3px RGBA(0,0,0,.15);

background-color: #f2f2f2;

border:1px #ccc solid;

border-radius: 4px;

font-size: 1.2em;

line-height:1.5em;

margin:0 150px 0 200px;

letter-spacing: 1px;

padding: 20px 20px 5px 30px;

color: #666;

min-height:60px;

position: relative;

white-space: pre; /* CSS 2.0 */white-space: pre-wrap; /* CSS 2.1 */white-space: pre-line; /* CSS 3.0 */white-space: -pre-wrap; /* Opera 4-6 */white-space: -o-pre-wrap; /* Opera 7 */white-space: -moz-pre-wrap; /* Mozilla */white-space: -hp-pre-wrap; /* HP Printers */word-wrap: break-word; /* IE 5+, 文本行的任意字内断开 */}

.shuoshuo-content p{margin:0;}

/*作者*/.shuoshuo-meta {

text-align: right;

letter-spacing: 0px;

margin-top:-10px;

}

/*时间*/.shuoshuo .tt{margin: 35px 0 0 15px;float:left;font-size:0.7em;}

.shuoshuo li em{float:left;background:url(“../wp-content/themes/Beginning/images/bolangxian.png”) no-repeat;width:50px;height:10px;margin:42px 0 0 28px;}

.shuoshuo li:hover .tt {color:#0c0;font-weight:bold;}

/*头像*/.shuoshuo .zhutou{border-radius: 50%;margin:25px 35px 0 5px;float:right;padding: 2px;border: 1px #ddd solid;display: block;transition: .5s;width: 40px;height: 40px;overflow:hidden;}

.shuoshuo li:hover .zhutou {

transform: rotate(720deg);-webkit-transform: rotate(720deg);-moz-transform: rotate(720deg);border-color: #0c0;}

/*前面的轴*/.shuoshuo:before {

height: 100%;

width: 2px;

background: #eee;

position: absolute;

left: 164px;

content: “”;

top:0px;

}

.shuoshuo-content:before {

position: absolute;

top: 40px;

bottom: 0px;

left: -42px;

background: #fff;

height: 12px;

width: 12px;

border-radius: 6px;

content: “”;

box-shadow: inset 0 0 2px #0c0;

}

.shuoshuo-content:after {

position: absolute;

top: 42px;

bottom: 0px;

left: -40px;

background: #ccc;

heigh

t: 8px;

width: 8px;

border-r
adius: 6px;

content: “”;

}

.shuoshuo li:hover .shuoshuo-content:after {

background: #0c0;

-webkit-transform: scale(1.3);

-moz-transform: scale(1.3);

-ms-transform: scale(1.3);

-o-transform: scale(1.3);

}

.shuoshuo li:hover .shuoshuo-content:before {-webkit-transform: scale(1.3);

-moz-transform: scale(1.3);

-ms-transform: scale(1.3);

-o-transform: scale(1.3);}

/*后面的轴*/.shuoshuo:after {

height: 100%;

width: 2px;

background: #eee;

position: absolute;

right: 100px;

content: “”;

top:0px;

}

.shuoshuo-meta:before {

position: absolute;

top: 42px;

bottom: 0px;

right: -56px;

background: #fff;

height: 12px;

width: 12px;

border-radius: 6px;

content: “”;

z-index:2;

box-shadow: inset 0 0 2px #0c0;

}

.shuoshuo-meta:after {

position: absolute;

top: 44px;

bottom: 0px;

right: -54px;

background: #ccc;

height: 8px;

width: 8px;

z-index:2;

border-radius: 6px;

content: “”;

}

.shuoshuo li:hover .shuoshuo-meta:after {

background: #0c0;

}

@media screen and (max-width: 800px) {

.shuoshuo-content {margin:0 60px 0 70px;padding: 10px 10px 5px 10px;font-size:0.9em;}

.shuoshuo .tt{width:30px;font-weight:bold;margin: 30px 0 0 1px;font-size:0.5em;height: 20px;}

.shuoshuo li:hover .tt {color:#0c0;font-size:0.5em;}

.shuoshuo:before {left: 50px;}

.shuoshuo-content:before {left: -26px;top:30px;}

.shuoshuo-content:after {left: -24px;top:32px;}

.shuoshuo:after {right: 27px;}

.shuoshuo-meta:before {right: -39px;top:33px;}

.shuoshuo-meta:after {right: -37px;top:35px;}

.shuoshuo .zhutou{margin: 20px 8px 0 5px;}

.shuoshuo li em{float:left;width:39px;height:10px;margin:34px 0 0 -1px;}

}

为WordPress网站增加说说功能

对着个功能有兴趣的朋友可以试试。

重要声明

本站资源大多来自网络,如有侵犯你的权益请联系管理员, 我们会第一时间进行审核删除。站内资源为网友个人学习或测试研究使用,未经原版权作者许可,禁止用于任何商业途径!请在下载24小时内删除!


如果遇到 付费 才可 观看 的文章,建议升级 会员或者成为认证用户。 全站所有资源 任意下免费看”。 本站资源少部分采用 7z压缩, 为防止有人压缩软件不支持7z格式,7z 解压,建议下载 7-zip ,zip、rar 解压,建议下载 WinRAR

给TA赞助
共{{data.count}}人
人已赞助
wordpress教程技术教程

无插件使用SMTP发送邮件

2023-12-8 14:42:33

wordpress教程技术教程

7B2主题-网站添加浮动文章导航目录

2023-12-8 16:19:07

0 条回复A文章作者M管理员
    暂无讨论,说说你的看法吧