微信公众平台如何进行高级排版
微信平台经常需要发布些图文消息,如何利用微信简单的编辑系统进行推送内容的排版,是很多微信君必须面对的问题。
一个没有态度的微信君在编辑文本段落时,可能是直接复制的文本,也有可能是键盘直接敲打出来的文本。
如果你能在段首敲打2个空格(输入法全角状态),你可以实现首行缩进。如果你能在段尾打个ENTER回车键,那么段落之间结构会很分明。
微信中既然提供有序列表和无序列表功能,说明列表功能还是很实用的。
如果有排版需要,段落格式(鼠标右击会出现菜单)中的左对齐、右对齐、居中对齐、两端对齐可以应用。
如果你用过html中
标签、并且懂一点CSS基础的话,那么你可以设计出高富帅的效果。
?高富一(有缩进):
?高富二(有边框):
?高富三(有背景):
怎么实现高级排版
效果怎么实现的呢?给高手点拨下,给
设置CSS样式,比如border、color、background-color、padding等。在网页制作工具或其他地方设置好样式,再复制文本,文本的样式就会跑到微信中来啦!
考虑到有人听不明白,下面详细讲下这三个高富帅效果吧。
⊙高富一剖析:
关于爱情网分享关于爱情的文字,爱情句子,爱情测试,爱情心理,爱情音乐,爱情微小说,一个文字控喜爱的阅读网站;搜罗男生女生喜爱的创意礼物,一个有爱的的小清新网站。
你不需要知道
标签是什么意思,英文style暗示后面的代码是设置样式用的。"padding:0px20px"作用是设置左边距为20px,"border-left:5pxsolid#c9c9c9;"意思是设置左边框,边框的粗细为5px,样式为实线(高富三样式为点状,dashed),边框颜色为#c9c9c9。关于文字的颜色就必要在代码中声明了,在微信中即可修改。
代码写好后怎么使用呢?不是直接复制微信就可以使用的,我们需要在其他地方把网页效果显示出来,再把文字复制到微信即可,而此时的文本保留了CSS样式。一个完整html的文件具有相应的格式,完整代码如下:
关于爱情网分享关于爱情的文字,爱情句子,爱情测试,爱情心理,爱情音乐,爱情微小说,一个文字控喜爱的阅读网站;搜罗男生女生喜爱的创意礼物,一个有爱的的小清新网站。
你只需把上方文本复制到记事本,并保存为文件名.html形式,然后通过浏览器打开即可看到效果:
全选复制网页中所有东西在微信中黏贴,便修改成自己的效果,高富帅效果就诞生啦!
⊙高富二剖析:
高富二与高富一主要区别是四周都有边框,把border-left改成border即可。
完整代码如下:
关于爱情网分享关于爱情的文字,爱情句子,爱情测试,爱情心理,爱情音乐,爱情微小说,一个文字控喜爱的阅读网站;搜罗男生女生喜爱的创意礼物,一个有爱的的小清新网站。
⊙高富三剖析:
高富三的边框样式为点状dashed,而非实线solid,另外添加了背景颜色:background-color:#116D8A;
完整代码如下:
联系作者:@关于爱情网(新浪微博)
下文是利用mardown进行快速微信排版的教程：
其实，我觉得用markdown书写，然后渲染一下，文章结构清晰而且简洁。
今天教你如何在“简陋编辑器”的现有条件下，利用markdown+扩展插件来优化微信文章的排版。
markdown是一个极其优美、简洁的书写语言（不是编程哦！）。一旦使用，极易上瘾！
1.markdown是什么：(下文引用自简书：markdown——入门指南)
markdown是一种轻量级的「标记语言」，目前也被越来越多的写作爱好者，撰稿者广泛使用。请不要被「标记」、「语言」所迷惑，markdown的语法十分简单。常用的标记符号也不超过十个，学习成本很低，且一旦熟悉这种语法规则，会有一劳永逸的效果。
markdown简洁的语法代替排版，而不像一般我们用的字处理软件word或pages有大量的排版、字体设置。它使我们专心于码字，用「标记」语法，来代替常见的排版格式。例如此文从内容到格式，甚至插图，键盘就可以通通搞定了。
2.使用markdown语言写作的好处：
纯文本，所以兼容性极强，可以用所有文本编辑器打开
让你专注于文字而不是排版
格式转换方便，markdown的文本你可以轻松转换为html、电子书等
结构清晰，排版美观，易读性强
3.markdown简明语法
标题：对于文章的标题1、标题2，你只需要在文字前面加上对应数量的#号，markdown会自动渲染出格式。
列表：在markdown下，列表的显示只需要在文字前加上-或*即可变为无序列表，有序列表则直接在文字前加1.2.3.符号，再在符合和文字之间加上一个字符的空格即可。
引用：如果你需要引用一小段别处的句子，那么就要用引用的格式。你只需要在引用的文本前面加上一个>和空格即可，例如：
更多markdown语法，点击查看markdown——入门指南。（上图转载自简书）
4.如何在微信公众平台优化排版
在chrome上安装markdownhere插件
在微信公众后台使用markdown语言写作
按住快捷键ctrl+alt+m，对markdown文章进行渲染
至此，什么引用符号、标题样式、分割符、代码栏等样式就一一具备了。拿去得瑟吧！
绛旓細濡備綍鎺掔増寰俊鍏紬鍙鏂囩珷1. 棣栧厛锛屽湪鐢佃剳娴忚鍣ㄤ腑鐧诲綍寰俊鍏紬骞冲彴銆2. 鐧诲綍鍚庯紝鐐瑰嚮鈥滄柊寤哄浘鏂団濆垱寤烘柊鐨勬枃绔犮3. 寰俊鍏紬鍙峰唴缃殑缂栬緫鍣ㄥ姛鑳藉彲鑳借緝涓哄熀纭锛屾偍鍙互閫夋嫨缃戜笂鎺ㄨ崘鐨勪赴瀵岀紪杈戝伐鍏蜂互鎻愬崌鎺掔増鏁堟灉銆4. 瀹夎骞舵墦寮涓涓紪杈戝櫒鍚庯紝鎮ㄥ彲浠ュ紑濮嬪鏂囩珷杩涜鎺掔増璁捐銆5. 鎺掔増瀹屾垚鍚庯紝鐐瑰嚮缂栬緫鍣ㄥ彸渚...
绛旓細鏈変笉灏戜汉瀵逛簬寰俊鍏紬骞冲彴鐨勭紪杈戦兘寰堝ご鐤硷紝瑕佹槸娌℃湁缁忛獙鍜屾ā鏉跨殑璇濓紝浼氬鑷村井淇″叕浼楀钩鍙扮殑鍚庡彴缂栬緫璐圭鑰楀姏锛屾墍浠ヤ粖澶╂潵鍛婅瘔澶у涓涓紪杈戠鍣ㄣ傚ぇ瀹跺彲浠ユ悳绱㈠井淇＄紪杈戝櫒锛屽叾瀹炵綉涓婃湁寰堝寰俊缂栬緫宸ュ叿锛岃鏈変簡杩欎釜宸ュ叿灏卞彲浠ヤ簨鍗婂姛鍊嶇殑杩涜鎺掔増浜嗐備笂鍥鹃噷鍙互鐪嬪埌缂栬緫鍣ㄩ噷鏈夊悇绉嶆ā鏉匡紝鍩烘湰鍙互婊¤冻鎵鏈夌殑鎺掔増...
绛旓細璁寰俊鍏紬鍙鏂囩珷鎺掔増鍙樺緱楂樺ぇ涓婏細涓ょ缂╄繘鍜學ord涓殑椤佃竟璺濈被浼硷紝缂╄繘鏁板艰秺澶э紝宸﹀彸椤佃竟璺濈暀鍑烘潵鐨勩岀櫧鑹层嶈秺澶氥傚湪鍚屼竴涓睆骞曞垎杈ㄧ巼涓嬶紝鏍忓澶у皬銆佷袱绔缉杩涘ぇ灏忓拰鍩虹瀛楀彿澶у皬锛屼笁鑰呯浉浜掑喅瀹氾細鏍忓銆佷袱绔缉杩涗笌鍩虹瀛楀彿濡備綍閫夊杩欏洓涓弬鏁扮殑鏁板煎憿銆傚埆鐫鎬ワ紝鎶婂奖鍝嶈繖浜涘弬鏁扮殑鍥犵礌璇存竻妤氫箣鍚庯紝浼氬彂鐜板彲...
绛旓細鍥犳锛岃繖灏辨湁蹇呰浣夸綘瀵硅琛ㄨ揪鐨勫唴瀹逛互鍙鍖栧浘琛ㄧ殑褰㈠紡鏉ュ憟鐜扮粰浣犵殑璇昏呫傝繖鏍蜂笉浠呬娇浣犵殑鏂囩珷鐪嬭捣鏉ラ昏緫娓呮櫚銆佸舰璞℃槑浜嗭紝鏇磋兘澶熷府鍔╀綘娑堥櫎璇昏呯殑闃呰闅滅銆備綍涔愯屼笉涓猴紵浜屻佺編瑙傚ぇ鏂 1銆佸皝闈㈤鍥撅細閫夊彇涓涓兘澶熷惛浜虹溂鐞冪殑灏侀潰鍥炬枃 鍏紬鍙鏂囩珷鎺ㄩ侊紝鐢ㄦ埛绗竴鐪肩湅鍒扮殑灏辨槸浣犳枃绔犵殑灏侀潰鍥炬枃銆傝瘯鎯筹紝浣犵敤...
绛旓細鍐呭鎺掔増-绠娲佸師鍒 瀛楀彿锛14-18px 锛堝紩瑷锛14px锛堟垨鑰呭叾浠栭潪閲嶇偣閮ㄥ垎锛 姝ｆ枃锛16px 鏍囬锛18px锛夎闂磋窛锛1.5-2鍊 娈佃惤锛氫竴鑸笉瓒呰繃5琛 16 鍐呭鎺掔増-鎵嬫満涓灞忓師鍒 鎵嬫満涓灞忓唴涓嶅彲澶崟璋冿紝鏃犻噸鐐广傚彲鎻掑叆灏忓浘鏍囥佸浘鐗囥佽竟妗嗙瓑鍏冪礌锛屾垨鑰呮爣璁伴噸鐐规枃瀛楋紙鏍囪壊銆佸姞绮楃瓑绛夛級锛屼互缂撹В瑙嗚鐤插姵銆傚唴...
绛旓細鐢ㄦ埛鎬绘槸寰堝揩閫熺殑娴忚鍜屾壂鎻忎綘鐨勬枃绔狅紝鎵浠ヨ鍑忓皯鐢ㄦ埛鐪煎厜姘村钩鎵鑼冨洿锛屼粬浠槄璇绘垨鎵弿鐨勯熷害渚夸細澶уぇ鍔犲揩銆備綘鍙互鎶婅緝瀹界殑鏂囧瓧娈佃惤浠ヨ緝灏忕殑瀹藉害鏄剧ず銆傚湪浠ユ枃瀛椾负涓荤殑鍏紬鍙鏂囩珷涓紝鍦ㄩ傚綋鐨勪綅缃姞鍏ュ浘鏍囨垨鍒嗛殧绾匡紝浠ュ強鍏锋湁閱掔洰瀛椾綋鍜岄鑹茬殑鏍囬绛夌瓑锛岃繖浜涢兘鍙互鎴愪负鐢ㄦ埛鍖哄垎涓嶅悓鍐呭鐨勬湁鏁堟爣璁般傚畠浠兘澶熶负...
绛旓細瓒婃潵瓒婂鐨勫叕鍙稿拰缁勭粐寮濮嬬敤寰俊鍏紬鍙鏉ュ睍绀烘帹骞..鍏朵腑寰俊骞冲彴鐨勫鍥炬枃绔犲張鏄富瑕佺殑鏂规硶.鑰屾兂鍒朵綔鍑轰竴涓簿鍝鎺掔増鐨勬枃绔.鐢卞叾鏄兂璁╂枃绔犲唴鏈夊绉嶇敓鍔ㄧ編瑙傜殑椤甸潰鍏冪礌灏辨洿閲嶈浜.浣嗗浜庝竴鑸病鏈夊灏戠綉缁滄妧鏈殑鏂囧瓧缂栬緫宸ヤ綔浜哄憳鏉ヨ,鐜板閭ｄ簺涓撲笟鐨勫姛鑳芥垨浠ｇ爜瀹炲湪澶毦浜.鍥犱负閭ｄ簺閮芥槸闇瑕佹湁鍩烘湰鐨.鍗充娇...
绛旓細鎺掔増椋庢牸 濂界湅鐨勬帓鐗堣绠鍗曠畝鍗曪紝璇撮毦涔熼毦銆傚浜庢柊鎵嬫潵璇达紝杩樻病鏈夎嚜宸辩殑鎺掔増椋庢牸锛屾墍浠ヨ繖鏃跺欐渶濂藉妯′豢涓涓嬩綘瑙夊緱涓嶉敊鐨鍏紬鍙锛岀湅鐪嬪埆浜烘槸鎬庝箞鎺掔増鐨勩傚彲浠ユā浠垮埆浜猴紝浣嗕笉瑕佸叏鐩樼収鎼紝铻嶅悎涓鐐硅嚜宸辩殑鍏冪礌锛屼箙鑰屼箙涔嬶紝灏变細閫愭笎褰㈡垚涓濂楄嚜宸辩殑浣撶郴銆備互涓嬭寰楁瘮杈冨叿浣擄紝浣嗕笉鏄爣鍑嗭紝浠呬緵鍙傝冦傚瓧鍙峰ぇ灏 ...
绛旓細褰撲綘鍋濂藉墠闈袱姝ワ紝鎺掔増宸ヤ綔澶ц嚧宸茬粡瀹屾垚锛屽湪鎺掔増鐨勮繃绋嬩腑涓瀹氱壒鍒敞鎰忕粨鍚堣璁＄殑4澶у師鍒欏幓鎺掔増銆傝璁4澶у師鍒欙細浜插瘑鎬с侀噸澶嶃佸姣斻佸榻愶紝杩4澶у師鍒欏浜庢帓鐗堟潵璇寸壒鍒殑閲嶈锛屽鏋滀綘鎯冲仛濂芥帓鐗堜竴瀹氳鑺辩偣鏃堕棿鍘荤爺绌剁湅鐪嬨04鐗堟潈闂 鍏紬鍙锋帓鐗杩囩▼涓竴瀹氳鐗瑰埆娉ㄦ剰鐗堟潈鐨勯棶棰橈紝涓嶈杞绘槗浣跨敤娌℃湁鎺堟潈鐨...
绛旓細浣滀负鍚岃鎴戣浜涙垜鐨勭粡楠岋紝鏄秴绾х畝鍗曠殑鍏紬鍙鏂囩珷鎺掔増鏂规硶锛1.鐢ㄧ櫨搴︽悳绱⑩滈敭鐩樺柕缂栬緫鍣ㄢ2.鎵撳紑绗竴涓綉绔3.鐐瑰嚮缃戠珯宸︿晶鐨勨滃叏鏂囨ā鏉库濈増鍧4.鎶婁綘鑷繁鍐欑殑瀛楁崲鎺夋ā鏉块噷闈㈢殑瀛5.澶嶅埗鍏ㄦ枃鍒板叕浼楀彿6.鐖嗘鏂囪癁鐢熶簡銆傜幇鍦ㄨ繕鑷繁鎺掔増澶疮浜嗭紝璇曡瘯杩欑鏂规硶鍚э紝鎶婄渷涓嬬殑鏃堕棿鍙互鏇村鐨勬斁鍦ㄥū涔愪笂锛屼笌浣犱竴...
