wordpress让评论框不再单调,为评论框添加背景图片(更新优化)

一点优化
一点优化
一点优化
478
文章
49
评论
2019年12月27日18:36:01
评论
868看 984字

大家有没有觉得自己的wordpress网站评论框太过单调了吗?你想要以下的评论框背景吗?今天就带大家如何实现WordPress评论框背景!wordpress让评论框不再单调,为评论框添加背景图片(更新优化)
方法很简单一学就会,是通过CSS修改添加的:
首先由于主题不同,所以我的CSS和大家并不一样!因此,我们需要找到评论框所在CSS!我使用的是知更鸟主题5.2版本,用这个版本的可以直接添加代码使用,其它主题可以参考这个方法。
常见的浏览器高速模式、谷歌浏览器都有审查元素功能,评论框右键”审查元素“;火狐浏览器推荐firebug插件,评论框上右键使用firebug查看元素,当然了,也可以使用浏览器自带的查看元素!
wordpress让评论框不再单调,为评论框添加背景图片(更新优化)
找到评论框所使用的id或者class,以我的博客为例,就是comment
wordpress让评论框不再单调,为评论框添加背景图片(更新优化)
然后打开您的主题style.css文件,在4830行,找到comment,插入如下代码:

background-image:url(images/commentbg.png);
background-repeat:no-repeat;
background-position:center center;

如下图:wordpress让评论框不再单调,为评论框添加背景图片(更新优化)
其中background-image,表示背景图片的地址,可以是绝对地址,也可以是相对地址(相对于style.css文件来说的,以上代码是相对地址,也就是主题的images;绝对地址就要包含域名的完整路径)
background-repeat,该属性表示是否重复,no-repeat为不重复,默认不重复。重复样式如下图,满满的一大屏。wordpress让评论框不再单调,为评论框添加背景图片(更新优化)
background-position,该属性用来控制图片在评论框中的位置,前一个参数表示左右位,后一个参数表示上下位。
最后保存,ftp上传style.css到主题文件夹覆盖就可以了!当然还有不要忘了上传背景图片哦!
下面再给大家推荐几个网络上收集的图片:
wordpress让评论框不再单调,为评论框添加背景图片(更新优化)wordpress让评论框不再单调,为评论框添加背景图片(更新优化)wordpress让评论框不再单调,为评论框添加背景图片(更新优化)wordpress让评论框不再单调,为评论框添加背景图片(更新优化)wordpress让评论框不再单调,为评论框添加背景图片(更新优化)wordpress让评论框不再单调,为评论框添加背景图片(更新优化)wordpress让评论框不再单调,为评论框添加背景图片(更新优化)

方法二:

更新整改之后,直接在后台自定义风格添加如下代码即可
#comment
{background-image:url(https://ww1.sinaimg.cn/large/005BYqpgly1fwzl65ny3ng30f1056t8y.jpg);
background-repeat:no-repeat;
background-position:center center;
height: 130px;background-position: 100% 80%;}

  • SEO话题
  • 这是我的QQ群扫一扫
  • weinxin
  • wp开发交流
  • 我的QQ交流群扫一扫
  • weinxin
wordpress搭建站中站(栏目站)教程 基础建站教程

wordpress搭建站中站(栏目站)教程

wordpress如何搭建栏目站?也就是我们所说的站中站。wordpress因为文章数据库表单只有一个,所以一般会比较卡,当然也有一些SEO站长因为站中站权重比较集中,所以使用站中站的方式做优化,还有...
如何修改WordPress数据库前缀 WP综合教程

如何修改WordPress数据库前缀

之前有一点优化有出一个分布式缓存的教程,但是那个分布式缓存会导致多个网站在一个服务器下面,数据库相同表前缀导致出现错误,所以这里一点优化在这边出三个WordPress修改表前缀的方法,分别是插件,安装...
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: