最新使用Elementor设计wordpress网站Single Post文章主体页面

Z站站长今天给大家分享一个来自柴郡猫的资源,也是来自别的网站,希望大家喜欢,下载地址就在文中。

 

教程总目录:菜鸟建站进阶篇–使用Elementor设计wordpress网站页面

 

前面两篇我们已经做好了网站的页眉和页脚设计。下面给大家介绍一下文章主体内容区域的页面设计。

1.创建Single Post文章页面模板

文章页面模板选择一个自己大致喜欢的即可,细节上我们可以进行微调。

这里就以第一个为例。

使用Elementor设计wordpress网站Single Post文章主体页面

加载后可以看到,这个模板页面顶部是分为了两部分。

左侧是日期和文章标题,右侧是作者信息。有点丑,下面我们给他改一下。

使用Elementor设计wordpress网站Single Post文章主体页面

2.修改Single Post模板布局

先把这两部分删除掉,我们自己重新创建。

先添加一个单栏结构,然后拉到顶部位置。

使用Elementor设计wordpress网站Single Post文章主体页面

2.1添加文章标题

把post title拖过去这里作为文章标题显示的区域。

使用Elementor设计wordpress网站Single Post文章主体页面

在创建一个2栏结构,把他拖到文章标题下,左栏显示文章的分类、标签、作者等信息,右侧我们放一些分享按钮。

2.2添加文章日期分类信息工具

post info小工具可以显示文章的一些基础信息。

使用Elementor设计wordpress网站Single Post文章主体页面

默认这个小工具是显示作者、日期、时间、评论数。评论数我们删掉。添加一些分类目录和标签

使用Elementor设计wordpress网站Single Post文章主体页面

 

2.3调整两栏宽度占比

这时候我们可能发现,左侧栏有一点小,当文章标签多的时候会显示不完。

一般情况下他会自动换行显示,但是我们右栏明显长了些,我们重新调整一下左右两栏的占比。

使用Elementor设计wordpress网站Single Post文章主体页面

调整右栏的百分比即可,左栏会自动扩展

使用Elementor设计wordpress网站Single Post文章主体页面

2.4添加分享按钮

右侧我们现在可以添加分享按钮了,分享按钮可以调整他的显示皮肤。选择匹配自己模板的即可。

使用Elementor设计wordpress网站Single Post文章主体页面

2.5删除文章特色图片显示

这个模板默认在文章正文前添加了一个显示文章特色图的区域。

一般情况下我们文章配图都是挺大的,在这里显示特色图的话基本文章打开后整个页面就是一张图片,看不到正文。

所以我们直接删除这个特色图显示,真要显示图片的话我们写文章时候可以自己添加图片。

使用Elementor设计wordpress网站Single Post文章主体页面

 

再往下在文章主体内容下面这个模板有一个文章导航,就是上一篇和下一篇的导航。可以看情况保留。这里就删掉了

继续往下看,是更多内容的区域,但是他这个工具有些问题,我们给他改一下。

使用Elementor设计wordpress网站Single Post文章主体页面

到这里基本就差不多了,我们预览看一下效果。

使用Elementor设计wordpress网站Single Post文章主体页面

 

3.发布Single Post文章页面模板

显示条件我们选择:包含-文章-所有

使用Elementor设计wordpress网站Single Post文章主体页面

 

大家觉得Z站站长分享得这个资源怎么样?赶紧评论一下吧!

【小程序源码网资源版权风险说明】:
本站为避免不必要的纷争,分享的所有资源中一切可能有版权风险的资源将全部转载自第三方网站或平台,站长只为大家提供相关资源的介绍和跳转引导。 因可能有疏忽大意,所以如有遗漏资源侵犯了您的合法权利,请联系站长删除。
【小程序源码网资源下载使用说明】:
本站所分享的一切QQ小程序源码,thinkphp整站源码,微信小程序源码,图文教程等资源仅供用户学习参考使用,任何人不得作其他用途,违者自行承担所有责任。
【小程序源码网毫无人看的介绍】:
本站又称Z站,原名贼娘网,开站于2018年,换过三任站长,目前站长是第四任站长,本站是一个主要分享免费开源小程序源码/网站源码/免费素材/教程资源的网站,主要小程序资源有用于学习的小程序源码,也有正版原创可商用的小程序源码,是一个公益博客型网站。
【小程序源码网原创源码版权申明】:
未经小程序源码网许可,任何人不得擅自使用本站原创首发源码进行商业行为(除本站VIP用户在期限内,版权无使用限制),否则将依法承担相应赔偿责任。
【小程序源码网转载文章版权申明】:
本站所转载的QQ小程序或微信小程序源码与其他资源仅供学习,任何人不得作其他用途,违者自行承担所有责任。
【小程序源码网站长最后的屁话】:
如有您认为本站有任何侵犯您合法权益的文章,或者您有什么疑问需求,欢迎联系站长QQ,站长24小时在线,备注公司名称和源码版权问题或者需要小程序定制开发等站长业务类型可急速处理,如果您只是交流小程序的一些开发问题或源码问题可以加入QQ群讨论,就不用加站长啦,对于白嫖党,QQ群才是处理问题的天堂,当然站长也欢迎大家骚扰~
小程序源码网 » 最新使用Elementor设计wordpress网站Single Post文章主体页面

发表评论

嘿,投喂下嘛!