Astra主题详解:页眉和页脚的设置指南(12)

在打造一个完美的WordPress网站时,主题的选择和设置至关重要。Astra主题凭借其高度自定义和灵活的功能,成为了许多用户的首选。在之前的教程中,我们已经讨论了Astra主题的其他设置,今天将重点讲解页眉和页脚的设置。这部分设置虽然被留到了最后,但它们的重要性不容忽视。通过合理的配置,您可以显著提升网站的视觉效果和用户体验。

步骤:网站后端→Appearance→Customize→Header Builder

Astra主题详解:页眉和页脚的设置指南(12)

点击后,我们会得到这一个界面

Astra主题详解:页眉和页脚的设置指南(12)

左侧红色框会显示我们的页眉,也就是标头的一些放置的内容,方便总体调整,当然你也可以在下方单独调整

Astra主题详解:页眉和页脚的设置指南(12)

如上图,对应的网站logo(Site Title & Logo),菜单(Primary Menu),按钮(Button 1),个人账户(Account),根据你实际需求去调整

大家很疑惑为什么有三排页眉,但现在只有中间一排有布局,这就是留给你自己的操作空间,你可以把上下两排当做空隙调整,或者加入其他功能,他的布局也会在前端的页面展示在上下两排,下面我添加一个功能大家可以看一下

Astra主题详解:页眉和页脚的设置指南(12)

如上图,我加入了一个搜索功能,然后他就出现在页眉的上方,大家觉得展示的太小了对吧,因为这排的间隙没有调整好,之前是只有第二排有布局,上下两排间隙是调整到最小的,不然整个页眉会显得很庞大,不协调,下面看怎么调整间隙

Astra主题详解:页眉和页脚的设置指南(12)

点击设置符号,然后可以设置高度,也就是间隙,还有展示在那些设备,如下图

Astra主题详解:页眉和页脚的设置指南(12)
Astra主题详解:页眉和页脚的设置指南(12)

如上图,你还可以单独设置这一排的文字颜色背景颜色等等,非常的方便

其他两排也是这样的操作,当然你也可以设置整个页眉

步骤:网站后端→Appearance→Customize→Header Builder→DESIGN

Astra主题详解:页眉和页脚的设置指南(12)

因为我们选择的是透明页眉,所以设置不在这

步骤:网站后端→Appearance→Customize→Header Builder→Transparent Header

Astra主题详解:页眉和页脚的设置指南(12)
Astra主题详解:页眉和页脚的设置指南(12)

当然透明页眉也可以设置展示的设备,还有更换网站logo,但这里是我没用打开Enable on Complete Website(在整个网站上启用)可以不用设置,因为我在页眉的网站logo设置了,如果你在这里启用了,那你之前的设置就会被覆盖

Astra主题详解:页眉和页脚的设置指南(12)

在这里设置各种文字和背景,如果没有设置透明页面就不用在这里设置

Astra主题详解:页眉和页脚的设置指南(12)

如上图,透明页眉是看你需要的网站效果的,如果你不需要首页的幻灯片或者海报融为一体,可以不启用这个,Astra主题的模版有些是透明页眉有些不是,在导入的时候可以看清楚,如果还是没注意,也是可以调整的

Astra主题详解:页眉和页脚的设置指南(12)

页眉是分三个部分的,怎么排列就看你需要什么样的效果了,中间肯定居中的,适合放菜单

Astra主题详解:页眉和页脚的设置指南(12)

添加也是有很多功能可以选择的,如上图和下图

Astra主题详解:页眉和页脚的设置指南(12)

按钮最多可以添加两个Button 1和Button 2,适合跳转链接

分隔器也是最多两个Divider 1和Divider 2

简码展示:HTML 1和HTML 2,也是最多两个,比如有一些插件可以用这种简码插入到标头,比如多语言多货币

LanguageSwitcher:多语言(语言转换器)

Secondary Menu:(次要菜单),你可以理解为主菜单后的存在

ToggleButton:(折叠符号),手机端的菜单展示

Search是搜索栏,Social是社交链接

Cart:是购物车

小部件的功能可以到后端小部件设置:Widget 1到4,当然一般用于页脚的,如果页脚不需要你可以设置页眉

Astra主题详解:页眉和页脚的设置指南(12)

还有四个已经添加在页眉,所以不会显示在可以添加的功能

Astra主题详解:页眉和页脚的设置指南(12)

同时也主要三个设备的调试,比如下面的手机端

Astra主题详解:页眉和页脚的设置指南(12)
Astra主题详解:页眉和页脚的设置指南(12)

手机端OFF CANVAS是折叠符号和里面的内容设置

Astra主题详解:页眉和页脚的设置指南(12)

菜单记得配置好每一个对应的菜单项目,不然不会显示

下面来讲下页脚,基本差不多,有一个区别就是他可以设定一排多少列

Astra主题详解:页眉和页脚的设置指南(12)
Astra主题详解:页眉和页脚的设置指南(12)

如上图,他可以设置一排几列,能达到你需要的效果,还有布局的效果

Astra主题详解:页眉和页脚的设置指南(12)

能添加的模版都差不多,主菜单变成了页脚菜单,大家更具自己的需要添加

最后还有一个问题就是Astra和Astra pro是有区别的,如下图

Astra主题详解:页眉和页脚的设置指南(12)
Astra主题详解:页眉和页脚的设置指南(12)

Sticky Header(粘性页眉)也就是置顶页眉

Astra主题详解:页眉和页脚的设置指南(12)

置顶页眉还是很好的,不然你滑动的时候页眉是不会粘贴在当前页面的上方的,会处于首页的最上方

所以建议开通Astra pro 解锁所有的功能,体验感会更好

总结

通过本文的介绍,相信大家已经掌握了如何在Astra主题中设置页眉和页脚。这些设置不仅能够让您的网站更具个性化,还能提升用户的浏览体验。如果您对Astra主题或WordPress其他方面的设置感兴趣,欢迎关注我们下期的内容,我们将为您深入讲解盗版主题插件和正版主题插件的区别,帮助您做出更明智的选择。


联系我们
文章看不懂?联系我们为您免费解答!免费助力个人,小企站点!
电话:020-2206-9892
QQ咨询:1025174874
邮件:info@361sale.com
工作时间:周一至周五,9:30-18:30,节假日休息
发布者:光子波动,转转请注明出处:https://www.361sale.com/18215/

(1)
上一篇 2024年 9月 1日 上午9:45
下一篇 2024年 9月 1日 上午10:25

相关推荐

发表回复

您的电子邮箱地址不会被公开。 必填项已用 * 标注

联系我们

020-2206-9892

QQ咨询:1025174874

邮件:info@361sale.com

工作时间:周一至周五,9:30-18:30,节假日休息

客服微信
为方便全球用户注册登录,我们已取消电话登录功能。如遇登录问题,请联系客服协助绑定邮箱。