照着本文做:上传启用 Argon 主题、安装 Elementor、导入 JSON、完成导航/图标/CSS/友链/背景/Live2D/年度进度条,一站式搞定前台美化。最后别忘了做备份!
声明
这篇就是“跟着做就能好看”的实操文。先装主题和页面构建器,再把导航、图标、CSS、友链、背景、Live2D、年度进度条一步步补齐。中途会用到第三方下载(比如 Elementor 的镜像页),记得只从可信来源拿包;涉及账号、密钥、路径的时候——请一定自己留底。另外,做好备份(程序文件 + 数据库),动大配置前先拍一张快照,出事不慌。备份方式参阅 用宝塔面板备份 WordPress(程序文件 + 数据库):手动/自动、异地备份与一键还原全攻略
下载并启用 Argon 主题
- WordPress 后台 → 外观 → 主题 → 添加主题 → 上传主题 → 选择下载的主题包(zip格式) → 安装并启用。
安装并启用 Elementor
访问镜像下载页:http://bidewang.co/ele
账号页(示例):http://bidewang.co/et(可用谷歌邮箱注册/登录)
WordPress后台 -> 插件 -> 安装插件 -> 上传插件 -> 上传下载的elementor -> 立即安装 -> 启用插件
Elementor 基础设置
WordPress后台 -> elementor -> 设置 -> 禁用默认字体 -> 保存更改
导入主题设置 JSON
找到argon主题设置选项(WordPress后台菜单栏) 点击右下角”到底部” 没有就将页面下滑一点点
点击导入设置
将 Argon美化 的 “一键导入.json” 文件里面的内容 粘贴到argon导入设置里面(并在代码里面的“修改”处修改为自己的内容) 点击确定 点击保存更改(后续更改后可以导出该设置自行保存)
更换网站图标
WordPress后台 -> 点击外观 -> 自定义 -> 点击站点身份 -> 更换站点图标 -> 上传文件 -> 更换 -> 点击发布
添加网站导航
WordPress后台 -> 点击页面 -> 添加页面:首页、碎碎念、留言板、关于我、友人帐 (碎碎念和留言板要点击允许评论,并且建立的时候需要需要选择相应的模版)
WordPress后台 -> 点击文章 -> 点击分类目录 -> 添加:文章 (还可以添加父级)
WordPress后台 -> 点击外观 -> 点击菜单 -> 选择顶部导航 -> 设置名称之后左侧菜单项:点击分类目录以及页面或者自定义链接 -> 点击查看所有 -> 点击全选 -> 点击添加至菜单 -> 点击保存菜单
导入额外 CSS(含透明与卡片样式)
WordPress后台 -> 点击外观 -> 点击自定义 -> 点击额外CSS 将 Argon美化 的 “额外CSS.css” 文件里面的内容复制到网站额外CSS设置里面 -> 点击发布
设置后台个人头像与资料
WordPress后台 -> 点击外观 -> 插件 -> 添加新插件 -> 搜索User Profile Picture -> 添加后启用
WordPress后台 -> 点击外观 -> 用户 -> 个人资料 -> 点击Profile Image 上传图片、同时修改管理配色方案为argon、名字、昵称、公开显示为邮箱 -> 点击更新个人资料
上传白天/夜间背景并应用
WordPress后台 -> 外观 -> 媒体 -> 添加文件 -> 上传即可 -> 上传好后点击图片可查看图片的位置 -> 复制图片url位置 -> argon主题选项 -> 右边大纲 -> 页面背景 -> 粘贴url地址到页面背景/页面背景(夜间模式时)输入框
菜单图标
图标库:https://fontawesome.com/v4/icons/
WordPress后台 -> 点击外观 -> 点击菜单 -> 选择顶部导航 -> 将每个菜单的导航标签设置为:
<i class=”fa fa-home”></i>首页
<i class=”fa fa-book” aria-hidden=”true”></i>文章
<i class=”fa fa-quote-left”></i>碎碎念
<i class=”fa fa-user”></i>关于
<i class=”fa fa-link”></i>友人帐
<i class=”fa fa-comments” aria-hidden=”true”></i>留言板
<i class=”fa fa-youtube-play” aria-hidden=”true”></i>bilibili主页
<i class=”fa fa-clock-o” aria-hidden=”true”></i>归档
友链:插件与短码
WordPress后台 -> 链接-> 添加链接-> 以我的为例:
名称:山水别恙的小破站
Web 地址:https://www.ganglitm.cn
描述:想折一枝晚桂去赴旧约,却知少年之舟早已解缆;只好把话折进月色里,让潮声与酒,替我们寒暄。
图片地址:https://www.ganglitm.cn/wp-content/uploads/2025/10/logo.png
点击添加链接即可
友人帐页面
WordPress后台 -> 点击页面 -> 添加页面:友人帐(别名为 friendlinks)-> 使用Elementor编辑 -> 添加一个简码(直接搜索该工具即可)
friendlinks sort="rating"/ # 代码的两端需要加一个中括号 年度倒计时进度条
WordPress后台 -> 外观 -> 小工具-> 左侧栏小工具 -> 添加简码(直接搜索“简码”),填入 Argon美化 的 “年度倒计时进度条.txt” 文件里面的内容复制到里面
添加 Live2D 看板娘
在/wp-content/themes/argon/(相对路径,具体路径在域名下面,请参考自己的路径)下新建live2d目录,然后将 Argon美化 里面的live2d的所有文件传到该文件夹,并将其中的load.js文件里面更改40/41行的路径(相对路径,确保跟自己的目录相同)
WordPress后台 -> Argon主题选项 -> 的页脚内容最后加入(相对路径,确保跟自己的目录相同):
<!– live2d –>
<script src=”/wp-content/themes/argon/live2d/TweenLite.js”></script>
<script src=”/wp-content/themes/argon/live2d/live2dcubismcore.min.js”></script>
<script src=”/wp-content/themes/argon/live2d/pixi.min.js”></script>
<script src=”/wp-content/themes/argon/live2d/cubism4.min.js”></script>
<link href=”/wp-content/themes/argon/live2d/pio.css” rel=”stylesheet” type=”text/css”/>
<script src=”/wp-content/themes/argon/live2d/pio.js”></script>
<script src=”/wp-content/themes/argon/live2d/pio_sdk4.js”></script>
<script src=”/wp-content/themes/argon/live2d/load.js”></script>
添加左侧栏菜单
WordPress后台 -> 点击外观 -> 点击菜单 -> 选择左侧个人链接(左侧栏菜单) -> 加入首页、碎碎念、归档等(图标参见前文)
网站运行时间和内存查询
WordPress后台 -> 外观 -> 主题文件编辑器 -> 找到footer.php -> 将 Argon美化 里面的 网站运行时间和内存查询.txt 的内容复制到footer.php中,位置大概在</footer>之前。其中有需要修改的部分(自己博客的诞生时间)
鼠标仙女棒特效、全文特效
WordPress后台 -> 外观 -> 主题文件编辑器 -> 找到footer.php -> 将 Argon美化 里面的 鼠标仙女棒特效、全文特效.txt 的内容复制到footer.php中,位置大概在</body> 之前(具体采用什么方式可自行注释和启用代码)
🐾 辛苦啦,勇士!现在可以放下键盘,去拥抱现实世界的软沙发啦~
