打开APP
userphoto
未登录

开通VIP,畅享免费电子书等14项超值服

开通VIP
微信公众平台图文消息内容编辑技巧(一)

 

  本文适用于对HTML/CSS基本没有了解,但希望更好地管理图文消息的微信公众平台管理者。

  本文的初衷是作为学生会宣传部内部公众平台管理培训材料。

  本文所介绍的方法最终实现依赖微信公众平台的设定,不保证永久有效。

  

1.本文适用范围

(1)带有格式的Word文本(如设定了字号,粗体,颜色)直接复制入图文编辑框,可以在编辑框内看到效果,但无法在“预览”或最终推送的消息中显示相应的文字效果甚至不显示该段文字。

(事实上,在大多数情况下是可以直接从Word中复制特殊效果的文字的,但鉴于本人确实遇到过复制入编辑框的文字在最终消息中无法显示而险些造成大错的情况,故在此列出)

(2)希望手动更改或精确设定某一部分文本的文字效果。

 

2.微信公众平台的基本界面

  任何一个微信公众平台管理者都应该对此界面相当熟悉,对于其中的基本功能不再介绍。

 

3.大字号加粗居中标题的具体实现

  本文以实现一个简单而具体的例子来介绍最基本的方法,更多的效果可以通过其它的CSS元素修改来实现。

(1)居中标题

  通过公众平台编辑框自带的 右键 功能可以轻松实现标题的居中。

(2)加粗标题

  通过公众平台编辑框自带的 加粗 按钮可以轻松实现标题的居中。

(3)更改字号

  微信公众平台的图文消息编辑框并不自带更改字号的功能,如果Word直接复制无法实现更改字号,则下列叙述提供了一种手动更改文本字号的方法:

  本文以Chrome浏览器作叙述,Firefox亦有“审查元素”功能,IE亦可以通过开发者工具(F12)实现相同功能。

  首先在编辑框的灰色区域右键,选择“审查元素”(此操作仅是为了更快地找到需要更改的地方,直接呼出开发者工具可以实现相同功能)

  找到如下图所示内容:

  一个较快的方法是对照每个div元素的id寻找。

  展开上图所示body元素后可以找到如下内容:

  被span标签包围的部分即需修改的标题文字部分,可以看到,该span标签的style属性中相比起其它标签中的style属性被增加了一条内容,即font-size:24px

  通过增加这条CSS属性,标题文字的字号已经被修改为24px,而一般普通文本的字号是16px。

  修改后的效果如下:

 

  最终消息的效果:

  

  一个显而易见的问题是:为什么字体从宋体变成了微软雅黑?

  这是由于我们没有规定这些文本的字体,它们显示什么字体将取决于上一级标签中定义的字体,或者浏览器显示HTML文本时默认的字体。

  如果要手动更改字体,可以在 "font-size:24px" 的属性后面增加一条 "font-family:字体名" 属性。

 

4.最后的声明

  实现本文所述效果的最简便方法是从Word中复制相应格式的文字,本文仅作为直接复制法失效时的临时补救措施。

  本文所述方法仅是对HTML/CSS知识的最基本应用,本文的叙述模式并不适合于HTML/CSS的入门。学习更系统的HTML/CSS知识才能举一反三,实现更精妙的效果。

 

《微信公众平台图文消息内容编辑技巧(二)》链接http://blog.renren.com/blog/724763858/935983571

在(二)中将实现气泡式聊天框等背景、边框效果。

 

最后更新:2014年9月26日 

联系作者:contactme@straywarrior.com

本站仅提供存储服务,所有内容均由用户发布,如发现有害或侵权内容,请点击举报
打开APP,阅读全文并永久保存 查看更多类似文章
猜你喜欢
类似文章
【热】打开小程序,算一算2024你的财运
代码学习群简易教程(4)
公众号设计排版 ,公众号怎么排版好看,公众号怎么排版
移动端BASE
CSS——CSS字体样式属性和CSS外观属性
微信公众号美观排版技巧之文字和段落
5000字干货!写给新手设计师的UI字体使用指南
更多类似文章 >>
生活服务
热点新闻
分享 收藏 导长图 关注 下载文章
绑定账号成功
后续可登录账号畅享VIP特权!
如果VIP功能使用有故障,
可点击这里联系客服!

联系客服