Docker系列 WordPress系列 WordPress的菜单
本文最后更新于 55 天前,如有失效请评论区留言。

前言

经过Docker系列 WordPress系列 配置argon主题的简单设置,你的个人网站看上去已经有模有样了。不过,我们还要在页面上加一些链接,比如:

image-20220428115915608

还有侧边栏:

image-20220428115933592

这种对文章/页面的布局被大多数个人博客所采用。你也可以自己去看一下大家的个人博客是怎么设置的。我觉得都差不多!

下面我们就来设置一下这些链接吧!

分类

我们先创建几个分类,为后面菜单的设置做好准备。

从在文章——分类里进入:

image-20220428120516780

一般分类里会有一个未分类,它是不可以删除的。我的演示中有一个test分类,是因为我们之前用m2w时上传过两篇文章在test分类里。

我们创建几个分类。不用选父级分类,直接添加新分类。作为示范,我使用这样的分类:

购物,淘宝,京东,拼多多
外语,日语,英语

如图所示:

image-20220428120947751

菜单

在后台,我们可以通过外观——菜单进入设置页面:

image-20220428120231658

我们可以添加一个顶部导航

image-20220428120351901

我们将刚刚创建的分类全部加进去菜单里并保存:

image-20220428121214134

我们可以拖动这个分类栏,让它们将我想要的层级进行排列。最后不要忘记保存菜单

image-20220428121330693

我们可以查看站点

image-20220428121428315

顶栏已经出现了两个链接:

image-20220428121517884

左侧栏的设置是类似的,自己试一下下面这个效果要如何实现:

image-20220428121713714

图标

其实你仔细观察我博客的顶部导航,会发现文字前面有一个图标:

image-20220428115915608

这些图标是来自:https://fontawesome.com/v4/icons/。如果你有仔细地看argon的帮助文档,应该也会发现。

我们先一个和购物有关的图标:

image-20220428122030807

我觉得这个shopping-cart就可以很好地归纳购物这个分类的性质。我们只要加入:

<i class="fa fa-shopping-cart"></i> 购物

像这样:

image-20220428122253922

保存生效后就会有图标。如图所示:

image-20220428122333530

蛮简单的吧!

小结

菜单这里大家多多研究一下。整体上我觉得是比较直观的。

基础的设置就是这样。以后我们说到页面的时候,还会使用到菜单的配置。

有什么问题可以评论区留言。

敬请期待!

版权声明:除特殊说明,博客文章均为Bensz原创,依据CC BY-SA 4.0许可证进行授权,转载请附上出处链接及本声明。 如有需要,请至学习地图系统学习本博客的教程。加Telegram群可获得更多帮助喔! | 博客订阅:RSS | 广告招租:留言板 | 博客VPS |
暂无评论

发送评论 编辑评论


				
|´・ω・)ノ
ヾ(≧∇≦*)ゝ
(☆ω☆)
(╯‵□′)╯︵┴─┴
 ̄﹃ ̄
(/ω\)
∠( ᐛ 」∠)_
(๑•̀ㅁ•́ฅ)
→_→
୧(๑•̀⌄•́๑)૭
٩(ˊᗜˋ*)و
(ノ°ο°)ノ
(´இ皿இ`)
⌇●﹏●⌇
(ฅ´ω`ฅ)
(╯°A°)╯︵○○○
φ( ̄∇ ̄o)
ヾ(´・ ・`。)ノ"
( ง ᵒ̌皿ᵒ̌)ง⁼³₌₃
(ó﹏ò。)
Σ(っ °Д °;)っ
( ,,´・ω・)ノ"(´っω・`。)
╮(╯▽╰)╭
o(*////▽////*)q
>﹏<
( ๑´•ω•) "(ㆆᴗㆆ)
😂
😀
😅
😊
🙂
🙃
😌
😍
😘
😜
😝
😏
😒
🙄
😳
😡
😔
😫
😱
😭
💩
👻
🙌
🖕
👍
👫
👬
👭
🌚
🌝
🙈
💊
😶
🙏
🍦
🍉
😣
Source: github.com/k4yt3x/flowerhd
颜文字
Emoji
小恐龙
花!
上一篇
下一篇