Docker系列 WordPress系列 WordPress页面
本文最后更新于 508 天前,如有失效请评论区留言。

本博客由ZGOCLOUD大力赞助!如何更快地访问本站?有需要可加电报群获得更多帮助。本博客用什么VPS?创作不易,请支持苯苯!推荐购买本博客的VIP喔,10元/年即可畅享所有VIP专属内容!

前言

经过Docker系列 WordPress系列 WordPress的菜单Docker系列 WordPress系列 WordPress小工具的基本设置,你的页面已经有了基本的框架了,可读性已经不错。

不过,根据我的观察,新近成立的个人博客通常还会有一些特殊页面,比如关于我留言板说说友情链接归档隐私政策等。它会让你的博客布局更加丰满、更加成熟一些。它们均可以通过页面来进行配置。

在后台,我们可以通过页面进入并添加和设置新页面:

image-20220428141248472

系统已经有了两个默认的页面。我们也不用删除它们。你不展示它就行了!

下面我们来新建一些页面并且设置它们。希望不会太难!

留言板

刚刚打开的时候,我这里还是显示的是WP Githuber MD的界面。我不需要用它来编辑留言板等页面。我们去WP Githuber MD的设置里设置一下。

image-20220428141449805

WP Githuber MD默认情况下是所有选项都没有选上,即代表默认全局都使用WP Githuber MD的markdown编辑器。我们这里只选择文章,这样页面说说就会使用默认的编辑器:

image-20220428141700970

再回去新建页面,这时的界面就变成这样了:

image-20220428141725896

我们可以进行一些设置。写一个留言板的标题。模板是留言板;文章页面全都选不显示。可以设置一个固定链接(链接我们尽量使用英文或者数字,避免使用汉字)。设置完后发布。自己看图喽:

image-20220428143502505

我们去菜单里将留言板添加到顶部导般栏,保存生效:

image-20220428142207815

我们可以给留言板先一个不错的图标并保存:

<i class="fa fa-comments-o"></i> 留言板

image-20220428142358878

我们再回到页面中。点击快速编辑,让留言板允许评论。更新页面。

image-20220428142547066

image-20220428142552976

此外,根据我的经验,你最好改变留言的默认时间顺序为倒序。这样新的评论总是可以排在前面,会显得网站比较活跃。设置很简单,只要去设置——讨论里,将下面这一项改为新的

Typora_yRniaRdlKz

最后在站点看效果。这个留言板就可以正常使用了:

image-20220428142700507

不知这个操作难不难?有问题请评论区留言!

关于我

我们新建一个关于我的页面用于自我介绍。我觉得这个页面是比较重要的,它可以让访客快速了解你

作为展示,我随便写些内容进去:

image-20220428143041545

模板用默认的就行。文章设置可以自己自定义,这个看自己喜好。

大家记得定义个固定链接。可以像我这样:

image-20220428143345814

最后在菜单里添加到顶栏。你也可以调整这个页面和其它分类/页面的相对位置。图标可以用:

<i class="fa fa-user"></i> 关于我

最后效果如下:

image-20220428143754805

不知这个操作难不难?有问题请评论区留言!

说说

我其实很早就知道这个说说界面,但我一直不知道这个页面有什么用。

后来我发现,你可以在上面发表一些零散的、不正式的言论,比如“今天天气很好”之类的。很适合喜欢碎碎念的人!

虽然我了解说说比较晚,但说说页面和留言板是十分相似的。这里是有一个说说模板的。不过要像留言板一样,在快速编辑那里设置允许评论。别人才可以评论你的说说。

image-20220428144013961

在菜单添加说说:

image-20220428144256396

说说的图标可以用这个:

<i class="fa fa-quote-left"></i> 说说

不过说说要在后台发表,外面的界面只可以评论。可能是因为说说是针对个人的吧。我这里为了示范,发表了一个测试说说

image-20220428144455168

最终效果图(可评论的说说):

image-20220428144540521

友情链接

友情链接其实是非常重要的!这或许是一个最简单的SEO了!简单来说,就是互加一些志同道合的朋友,在一定程度上可以增加自己网站的曝光度。知乎上也有相关的问题及回答,比如:友情链接有什么用?详解友链的四大作用?。自己去了解吧!

在Argon里,友情链接的实现非常简洁。不知道其它主题是不是也是类似!

我们要先安装一个插件,叫iframe。这个插件是用于进行shortcode的插入:

image-20220428145402733

下载完成后记得启用

我们用默认模板新建一个页面,并且添加一个简码。类似于:

image-20220428145555758

我们在里面加入:

image-20220428145656164

改一下固定链接(URL别名可以是friendlinks)后直接发布。

这里,可以在链接里添加内容:

image-20220428145923552

比如,你可以试试添加我的友链:

站点名称:浮云翩迁之间
站点地址:https://blognas.hwb0307.com
站点描述:百代繁华一朝都,谁非过客;千秋明月吹角寒,花是主人。
站点图标:https://blognas.hwb0307.com/logo.jpg

如图所示:

image-20220428150054598

记得按添加链接保存。

最后,我们在顶部导航栏菜单里加入友情链接这个页面。这个就不演示了。你可以像我一样使用这个图标:

<i class="fa fa-link"></i> 友人帐

最终展示的效果如下:

image-20220428150444365

当然,这个页面你可以加一些内容进去。比如加上你的友链信息、加你友链的限制条件等等。这个你模仿一下别人吧!没有什么固定的规则,全凭个人喜好。

在实际操作中,我比较喜欢使用额外参数。比如,我页面中的实际代码是:

chrome_aKL5BKwdLS

这个的意思是说,我要按评分进行排序。如果你想将喜欢的博主往前排,就将TA的评分值调低一些,这样TA就会排在比较前面。比如,我的链接排序是这样的:

chrome_GOuhypGjon

实际顺序是这样的:

chrome_Cy97NT0CWL

更多的参数设置可以看argon文档的友链参数

最后,还有一种旧短代码的使用方式,大家也可以试试看:

[sfriendlinks] link|https://www.ruanyifeng.com/blog/|阮一峰|阮一峰的网络日志|https://www.ruanyifeng.com/blog/images/person2_s.jpg [/sfriendlinks]

结果如下:

小结

这个章节的操作都比较绕,不过如果有人指导还是比较容易的。自己多尝试一下就好了!

我记得刚刚开始设置的时候,对于页面的概念不是很理解,不太清楚它和文章的区别。现在我知道,WordPress页面适合用来适合一些数量和内容均比较有限的信息。其实和文章没有太大的区别!

另外,还有一个归档页面我并未展示,它的效果大致是这样的:

image-20220428144833798

这就当给大家一个作业吧!设置一个归档页面,并且将它的标签命名为时光轴。大家看看能否重现我的归档效果!

有问题评论区留言!

---------------
完结,撒花!如果您点一下广告,可以养活苯苯😍😍😍

感谢ZGOCLOUD友情赞助 (ฅ´ω`ฅ) 本博客基于m2w创作。版权声明:除特殊说明,博客文章均为Bensz原创,依据CC BY-SA 4.0许可证进行授权,转载请附上出处链接及本声明。VIP内容严禁转载!由于可能会成为AI模型(如chatGPT)的训练样本,本博客禁止将AI自动生成内容作为文章上传(特别声明时除外)。如有需要,请至学习地图系统学习本博客的教程。加Telegram群可获得更多帮助喔! | 博客订阅:RSS | 广告招租请留言 | 博客VPS | 致谢渺软公益CDN |

评论

  1. 秋刀鱼
    Windows Edge 110.0.1587.57
    1 年前
    2023-2-28 21:16:54

    固定连接在哪里啊 找不到

    • 博主
      秋刀鱼
      Windows Chrome 110.0.0.0
      1 年前
      2023-2-28 21:42:03

      固定链接通过插件实现。具体请见: https://blognas.hwb0307.com/linux/docker/1389

  2. smileye
    Windows Edge 110.0.1587.56
    1 年前
    2023-2-26 9:40:29

    谢谢博主!

  3. zijing233
    Windows Chrome 109.0.0.0
    1 年前
    2023-2-04 11:23:35

    请问作者有什么办法修改argon主题文章/页面默认插入字体的大小和各级别标题的大小?每次在编辑器里面插入字体和标题之后都需要手动修改大小,有点麻烦,我尝试修改了style.css和一些font-size属性但是没有起作用,有什么办法解决吗?

    • 博主
      zijing233
      Windows Edge 109.0.1518.78
      1 年前
      2023-2-04 11:41:20

      你可以利用额外CSS的方法。比如,我要修改h1和h2的默认字体大小,可以用:

      h1 {
         font-size: 2.5rem !important;
      }
      
      h2 {
         font-size: 3rem !important;
      }

      你可以看我的文章《特效》了解额外CSS的使用。
      如果非必要,一般我是用m2w 2.0之类的工具进行博文写作的,很少使用古登堡。
      祝顺利 (ฅ´ω`ฅ)

    • 博主
      zijing233
      Windows Edge 109.0.1518.78
      1 年前
      2023-2-04 11:46:26

      我之前的额外CSS也描述了正文字体大小的设置方法:

      /*正文字体大小(不包含代码)*/
      .post-content p{
          font-size: 1.25rem;
      }
      li{
          font-size: 1.2rem;
      }
      • zijing233
        Bensz
        Windows Chrome 109.0.0.0
        1 年前
        2023-2-04 11:47:59

        好的感谢您的耐心回复,我尝试一下

  4. Jensir
    Windows Edge 108.0.1462.76
    1 年前
    2023-1-09 23:22:43

    页面的固定链接是在哪设置呢,我找半天没找着地方∠( ᐛ 」∠)_

    • 博主
      Jensir
      Windows Edge 108.0.1462.76
      1 年前
      2023-1-10 10:50:13

      如图所示:

      查看图片
      msedge_8qK7eqNJ55

  5. Windows Edge 108.0.1462.46
    1 年前
    2022-12-17 14:15:28

    这篇文章的图片好像挂掉了v

    • 博主
      infinity
      Windows Edge 108.0.1462.46
      1 年前
      2022-12-17 15:52:01

      emm。。。其实还在的,可能是网络问题吧。。。( ̄△ ̄;) 加个代理就好了

    • 博主
      infinity
      Windows Edge 108.0.1462.46
      1 年前
      2022-12-17 15:53:15

      我自己关了代理试了一下,感觉正常呀(我是F12按F5强制刷新,不是用缓存)

      • Bensz
        Windows Edge 108.0.1462.46
        1 年前
        2022-12-17 16:06:14

        现在有了,可能刚刚没加载出来٩(ˊᗜˋ*)و

      • 博主
        infinity
        Windows Edge 108.0.1462.46
        1 年前
        2022-12-17 16:07:02

        OK 那就没事了 (☆ω☆)

发送评论 编辑评论


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