前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >给WordPress文章添加类似说说的状态样式

给WordPress文章添加类似说说的状态样式

作者头像
用户1696846
发布2018-07-16 16:49:04
1.3K0
发布2018-07-16 16:49:04
举报
文章被收录于专栏:Android自学Android自学

在网上找到一个可以给wordpress增加类似说说的样式教程,便在这里贴出来,大神直接无视哈。

先说明一下,本文所说的是在本博客所用主题上加以修改的哈,其他主题的博客使用的时候可以根据需要修改,下面我也会提及一些。

先附上效果图:

步骤一:找到functions.php文件在

register_nav_menu( 'primary', __( '导航菜单', 'Readd' ) );

register_nav_menu( 'second', __( '分类菜单', 'Readd' ) );

下面添加如下代码:

add_theme_support( 'post-formats', array('status' ));

这个代码主要是为了激活这个样式!其他博客可能没有分类菜单,只需要在导航菜单下面添加此代码即可。

步骤二:新建content-status.php文件,加入以下代码(DW里面直接新建即可),并上传到主题根目录下

代码语言:javascript
复制


<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
	<a href="<?php the_permalink(); ?>"><?php echo get_avatar( get_the_author_meta( 'ID' ), apply_filters( 'Readd_status_avatar', '48' ) ); ?></a>

	<div class="entry-content">
		<?php the_content( __( '','Readd' ) ); ?>
	</div>

	<footer>
		<?php if( is_singular() ): ?>

		<?php endif; ?>
	</footer>
	<div class="clear"></div>
</article><!--post-->

注:别的主题使用的时候请修改一下类似上面代码中

代码语言:javascript
复制


		&lt;?php the_content( __( '','Readd' ) ); ?&gt;

这一行中的‘Readd’,此为自己主题的名字。此处包括全文(上面不止一处),凡是涉及到这个的一律都要修改为自己的主题名字。

步骤三:添加CSS样式,添加到style.css里面的任意位置

代码语言:javascript
复制

rticle.format-status .avatar{float:left;margin-right:24px;box-shadow:0 1px 4px rgba(0,0,0,0.2);}
article.format-status .entry-content{margin-left:72px;padding-top:1px;}
article.format-status p{margin:12px 0;boeder:5px solid:red;background:#F0F0F0;border-radius:15px;

现在已经好了,马写一篇试下吧,哈哈,记得选择文章样式为状态(在后台文章编辑框右侧) 。


skills:如果需要修改头像大小,样式,说说的背景样式大小等等,可以自行修改CSS代码。

截图中①处的‘发布时间’是网上教程所没有的,我自己修改了一下。我用的代码贴在下面。

代码语言:javascript
复制

<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
	<a href="<?php the_permalink(); ?>"><?php echo get_avatar( get_the_author_meta( 'ID' ), apply_filters( 'Readd_status_avatar', '48' ) ); ?></a>
<span><?php _e('在 ', 'Readd'); the_modified_time(__('Y年n月j日,G:i:s ', 'Readd')) ?>发布了一条状态</span>
 
	<div class="entry-content">
		<?php the_content( __( '','Readd' ) ); ?>
	</div>
 
	<footer>
		<?php if( is_singular() ): ?>
 
		<?php endif; ?>
	</footer>
	<div class="clear"></div>
</article><!--post-->

类似的可以自己修改啦,我也是刚刚接触wp的后台代码,好些个不懂的,下面贴出来网上找的wp的时间函数和示例,修改发布时间或者别的形式时或许能够用的到。

在修改的过程中,我们难免会用到时间函数,这当然就涉及到了WordPress 的时间格式。那么我们只要对时间函数: the_time() 做一些对应的修改,就能达到我们想的效果,首先我得要知道那些参数对应的含义,这样用起来才会得心应手。先来看下面这个表格:

下面再举几个WordPress设置时间格式的例子:

中文日期格式设置,年月日:如:2010年2月1日,则Wordpress the time函数的参数这样写:

代码语言:javascript
复制
&lt;? php the_time('Y年n月j日'); ?&gt;

中文时间的设置,小时分秒:如:22:22:22,则Wordpress the time函数的参数这样写:

代码语言:javascript
复制
&lt;? php the_time('G:i:s'); ?&gt;

星期格式设置,星期:如:2010年11月1日星期四,则Wordpress the time函数的参数这样写:

代码语言:javascript
复制
&lt;? php the_time('Y年n月j日l'); ?&gt;

当然,有时候我们主题喜欢中英文混输的日期显示格式,对于使用中文版 WordPress来说,这个就要做一些小小的调整了。这里以显示日志时间的月份为例,我们在主题中使用 the_time( ‘M’ ) 应该可以打印出一个 Sep 的英文简写的月份值。但是幸运而又不幸地是,WordPress 会非常人性化地为你翻译成“九”,说幸运,是因为 WordPress 的智能化让人感到高兴,说不幸是因为我确确实实就需要 Sep 这样的英文简写的时间格式,这让我如何是好。

那么这个时候我们如何办呢,从函数角度出发解决此问题,重置一下,避免汉化。

将函数:

代码语言:javascript
复制
&lt;?php the_time('M');?&gt;

替换成:

代码语言:javascript
复制
&lt;?php echo date('M',get_the_time('U'));?&gt;

这个时候我们就发现得到了我们需要的时间格式了。

好吧,暂且我就知道这么多了,我已经把我会的都贴了出来了。:)

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档