[alert]关于新建页面、菜单图标等操作请跳转目录到教程视频~[/alert]

[alert]搭建博客遇到的99.9%问题已经在文档、相关视频以及评论区中给出,一定要认真看文档及视频讲解,不会可以翻评论区[/alert]

## 前言

> 很开心这篇美化文章能够帮助到大家,如果转载请标注原文地址哦,十分感谢!

常言道:工欲善其事必先利其器,在发表文章前,美化博客,使其利于自己的观看与管理极其重要,所以我四处搜寻,得到了以下美化代码。

但是,有时候我们走得太远,会忘了为什么出发。希望阅览本文章的人不要忘记初心,想想一开始为什么搭建博客。我相信大部分朋友都是为了记录自己学习笔记,生活故事。

所以,有时候博客美化过度会适得其反,望各位仔细斟酌,莫要使自己的博客变成了花架子,好的文章才是博客之本,立足之根。

## 主题资源

链接:
提取码:echo

![](https://liveout.cn/usr/uploads/pic/article/project/argon.png)

## 1. 我的博客美化 JSON

**`注意`:可复制一键导入**

**别忘记在主题设置页面修改头像、背景以及底部信息等设置哦**(博客背景url已失效,需自己填写)

> 建议主题设置全局里 CDN 选择不使用或更换为自己的,否则可能出现CSS样式失效

```
{"argon_theme_color":"#5e72e4","argon_theme_color_hex_preview":"#5e72e4","argon_show_customize_theme_color_picker":true,"argon_enable_immersion_color":"true","argon_darkmode_autoswitch":"time","argon_enable_amoled_dark":"false","argon_card_radius":"15","argon_card_shadow":"default","argon_page_layout":"double","argon_article_list_waterflow":"2","argon_article_list_layout":"1","argon_font":"serif","argon_assets_path":"jsdelivr_fastly","argon_custom_assets_path":"","argon_wp_path":"/","argon_dateformat":"YMD","argon_enable_headroom":"true","argon_toolbar_title":"Echo","argon_toolbar_icon":"","argon_toolbar_icon_link":" ","argon_toolbar_blur":"true","argon_banner_title":"Echo‘s blog","argon_banner_subtitle":"Banner 副标题","argon_banner_size":"fullscreen","argon_page_background_banner_style":"transparent","argon_show_toolbar_mask":true,"argon_banner_background_url":"--bing--","argon_banner_background_color_type":"shape-primary","argon_banner_background_hide_shapes":true,"argon_enable_banner_title_typing_effect":"true","argon_banner_typing_effect_interval":"100","argon_page_background_url":"https://yy.liveout.cn/background/wallhaven-yxjm57_1920x1080.png","argon_page_background_dark_url":"https://yy.liveout.cn/background/wallhaven-6dqjdl_1920x1080.png","argon_page_background_opacity":"1","argon_sidebar_banner_title":"左侧栏标题","argon_sidebar_banner_subtitle":"左侧栏子标题(格言)","argon_sidebar_auther_name":"Echo","argon_sidebar_auther_image":"https://yy.liveout.cn/photo/photo1.png","argon_sidebar_author_description":"左侧栏作者简介","argon_sidebar_announcement":"","argon_fab_show_settings_button":"false","argon_fab_show_darkmode_button":"true","argon_fab_show_gotocomment_button":"false","argon_seo_description":"网站描述 (Description Meta 标签)","argon_seo_keywords":"搜索引擎关键词(Keywords Meta 标签)","argon_article_meta":"time|categories|views","argon_show_readingtime":"true","argon_reading_speed":"580","argon_reading_speed_en":"80","argon_reading_speed_code":"10","argon_show_thumbnail_in_banner_in_content_page":"false","argon_first_image_as_thumbnail_by_default":"true","argon_reference_list_title":"参考","argon_show_sharebtn":"true","argon_show_headindex_number":"false","argon_donate_qrcode_url":"https://www.liveout.cn/usr/uploads/2022/10/wechat1.jpg","argon_additional_content_after_post":"文末附加内容","argon_related_post":"category,tag","argon_related_post_sort_orderby":"meta_value_num","argon_related_post_sort_order":"DESC","argon_related_post_limit":"10","argon_article_header_style":"article-header-style-2","argon_outdated_info_time_type":"createdtime","argon_outdated_info_days":"1","argon_outdated_info_tip_type":"inpost","argon_outdated_info_tip_content":"本文最后更新于%modify_date_delta% 天前,其中的信息可能已经过时,如有错误请发送邮件到big_fw@foxmail.com","argon_archives_timeline_show_month":"true","argon_archives_timeline_url":"https://www.liveout.cn/pigeonhole/","argon_footer_html":"

\n \n

\n\n \n

\n

\n

\n Running Time\ndays\n H\n M\n\nS\n \n","argon_enable_code_highlight":"true","argon_code_theme":"vs2015","argon_code_highlight_hide_linenumber":"true","argon_code_highlight_break_line":"false","argon_code_highlight_transparent_linenumber":"false","argon_math_render":"none","argon_mathjax_cdn_url":"//cdn.jsdelivr.net/npm/mathjax@3/es5/tex-chtml-full.js","argon_mathjax_v2_cdn_url":"//cdn.jsdelivr.net/npm/mathjax@2.7.5/MathJax.js?config=TeX-AMS_HTML","argon_katex_cdn_url":"//cdn.jsdelivr.net/npm/katex@0.11.1/dist/","argon_enable_lazyload":"true","argon_lazyload_threshold":"800","argon_lazyload_effect":"fadeIn","argon_lazyload_loading_style":"1","argon_enable_fancybox":"true","argon_enable_zoomify":"false","argon_zoomify_duration":"200","argon_zoomify_easing":"cubic-bezier(0.4,0,0,1)","argon_zoomify_scale":"0.9","argon_enable_pangu":"article","argon_custom_html_head":"","argon_custom_html_foot":"\n\n\n \n\n\n\n\n","argon_enable_smoothscroll_type":"1_pulse","argon_enable_into_article_animation":"true","argon_disable_pjax_animation":"false","argon_comment_pagination_type":"page","argon_comment_emotion_keyboard":"true","argon_hide_name_email_site_input":"false","argon_comment_need_captcha":"false","argon_get_captcha_by_ajax":"false","argon_comment_allow_markdown":"true","argon_comment_allow_editing":"true","argon_comment_allow_privatemode":"true","argon_comment_allow_mailnotice":"true","argon_comment_mailnotice_checkbox_checked":true,"argon_comment_enable_qq_avatar":"true","argon_comment_avatar_vcenter":"false","argon_who_can_visit_comment_edit_history":"commentsender","argon_enable_comment_pinning":"true","argon_enable_comment_upvote":"true","argon_comment_ua":"platform,browser","argon_show_comment_parent_info":"true","argon_fold_long_comments":"true","argon_gravatar_cdn":"gravatar.pho.ink/avatar/","argon_text_gravatar":"true","argon_enable_search_filters":"true","argon_search_filters_type":"*post,*page,shuoshuo","argon_pjax_disabled":"false","argon_hide_categories":"","argon_enable_login_css":"true","argon_home_show_shuoshuo":"false","argon_fold_long_shuoshuo":"true","argon_enable_timezone_fix":"false","argon_hide_shortcode_in_preview":"true","argon_trim_words_count":"0","argon_enable_mobile_scale":"false","argon_disable_googlefont":"false","argon_disable_codeblock_style":"false","argon_update_source":"github","argon_hide_footer_author":"true"}
```

## 2. 年度倒计时显示(左侧栏)

**在左侧栏里添加工具——简码,复制一下代码粘贴进去**

```




```

## 3. 底部音乐播放

> 下面的调用链接可能会突然失效,如有需要可参考官方文档
>
> [APlayer HTML5音乐播放器 | ACE-BLOG (ace520.github.io)](https://ace520.github.io/blog/post/2020/05/26/aplayer/)

**`server="netease"` 指定音乐平台为网易云,`type="song"` 指单曲类型,`id="7373135320"` 为音乐的 id(这里的id为打开音乐歌单,网址显示的id)**

**开启吸底模式 `fixed="true"`, 开启迷你模式** `mini="true"`, 随机播放 `order="random"`, 关闭底部歌词 `lrc-type="0"`

**`注意`**:id需要为自己创建的歌单,不能为我喜欢的音乐;server可以改自己用的音乐平台,如netease(网易云)、tencent(QQ音乐)

具体参数设置点击此链接:

Aplayer播放器官网文档:[APlayer HTML5音乐播放器 | ACE-BLOG (ace520.github.io)](https://ace520.github.io/blog/post/2020/05/26/aplayer/)

```




server="netease"
type="playlist"
id="7360465359"
fixed="true"
mini="true"
order="random"
loop="all"
preload="auto"
list-folded="false">

```

## 4. 动态背景(视频资源失效)

**背景可以通过更改 url 链接设置为自己的动态视频**,*尽量不要太大,否则别人访问时会刷新许久*

`注意`**视频链接已过期,可更换为自己的链接**

> 上传视频到云平台或媒体库,复制资源链接

```
src="https://new.gcxstudio.cn/usr/uploads/2022/03/daymode.mp4" /*白天动态视频链接*/
class="bg-video bg-video-day"
autoplay=""
loop="loop"
muted=""
>
src="https://new.gcxstudio.cn/usr/uploads/2022/03/darkmode.webm" /*夜间动态视频链接*/
class="bg-video bg-video-night"
autoplay=""
loop="loop"
muted=""
>

src="https://api.gcxstudio.cn/odometer/odometer.min.js"
integrity="sha256-65R1G5irU1VT+k8L4coqgd3saSvO/Wufson/w+v2Idw="
crossorigin="anonymous"
>





```

## 5. 虚拟人物(看板娘)

以下代码选择一项复制即可,效果不同,自行选择

具体文章:[stevenjoezhang/live2d-widget: 把萌萌哒的看板娘抱回家 (ノ≧∇≦)ノ | Live2D widget for web platform (github.com)](https://github.com/stevenjoezhang/live2d-widget)

```

```

2. **其中 jsonpath: 后面的链接可按自己爱好更改,选择别的虚拟人物**

```



/* 小帅哥: https://unpkg.com/live2d-widget-model-chitose@1.0.5/assets/chitose.model.json
萌娘:https://unpkg.com/live2d-widget-model-shizuku@1.0.5/assets/shizuku.model.json
白猫:https://unpkg.com/live2d-widget-model-tororo@1.0.5/assets/tororo.model.json
黑猫: https://unpkg.com/live2d-widget-model-hijiki@1.0.5/assets/hijiki.model.json
小可爱(女):https://unpkg.com/live2d-widget-model-koharu@1.0.5/assets/koharu.model.json
小可爱(男):https://unpkg.com/live2d-widget-model-haruto@1.0.5/assets/haruto.model.json
初音:https://unpkg.com/live2d-widget-model-miku@1.0.5/assets/miku.model.json
圣职者妹妹:https://unpkg.com/live2d-widget-model-z16@1.0.5/assets/z16.model.json
茶杯犬:https://cdn.jsdelivr.net/npm/live2d-widget-model-wanko@1.0.5/assets/wanko.model.json
绿毛妹妹:https://unpkg.com/live2d-widget-model-tsumiki@1.0.5/assets/tsumiki.model.json
金龟子妹妹:https://unpkg.com/live2d-widget-model-unitychan@1.0.5/assets/unitychan.model.json
https://unpkg.com/live2d-widget-model-nito@1.0.5/assets/nito.model.json
https://unpkg.com/live2d-widget-model-ni-j@1.0.5/assets/ni-j.model.json
小阿狸: https://unpkg.com/live2d-widget-model-nico@1.0.5/assets/nico.model.json
https://unpkg.com/live2d-widget-model-nietzche@1.0.5/assets/nietzche.model.json
https://unpkg.com/live2d-widget-model-nipsilon@1.0.5/assets/nipsilon.model.json
女学生: https://unpkg.com/live2d-widget-model-hibiki@1.0.5/assets/hibiki.model.json */
```

## 6. 网站底部信息

### CSS(样式表)

```

```

### HTML(底部信息)

```


CDN

Upyun

Powered

WordPress



Copyright
2022-2023
@ Echo





Running Time class="badge-value bg-apricots">
days
H
M
S
```

### JavaScript(网站运行时间脚本)

**`注意`:new Date( year, month, date, hrs, min, sec) 按给定的参数创建 日期对象**

**其中month的值域为0~11,0代表1月,11表代表12月;所以你输入的月份需要为自己真正月份的前一个月**

```

```

## 7. 字体、鼠标等特效

[Docker系列 WordPress系列 特效 - Bensz (hwb0307.com)](https://blognas.hwb0307.com/linux/docker/744#comment-918)

## 8. 博客自定义CSS样式

### 8.1 博主的设置

> 参考上面友情链接, 以下为我的额外CSS,涉及字体、透明等博客样式

在 `外观` --- `自定义` --- `额外CSS` 中

ps: 字体链接需要上传到云端调用才能生效(下面字体链接已失效)

```
/*网站字体*/
/*原则上你可以设置多个字体,然后在不同的部位使用不同的字体。*/
@font-face{
font-family:echo;
src:url(https://fastly.jsdelivr.net/gh/huangwb8/bloghelper@latest/fonts/13.woff2) format('woff2')
}

body{
font-family: 'echo', Georgia, -apple-system, 'Nimbus Roman No9 L', 'PingFang SC', 'Hiragino Sans GB', 'Noto Serif SC', 'Microsoft Yahei', 'WenQuanYi Micro Hei', 'ST Heiti', sans-serif
}

/*横幅字体大小*/
.banner-title {
font-size: 2.5em;
}
.banner-subtitle{
font-size: 28px;

-webkit-text-fill-color: transparent;
background: linear-gradient(94.75deg,rgb(60, 172, 247) 0%,rgb(131, 101, 253) 43.66%, rgb(255, 141, 112) 64.23%,rgb(247, 201, 102) 83.76%,rgb(172, 143, 100) 100%);
-webkit-background-clip: text;
}

/*文章标题字体大小*/
.post-title {
font-size: 25px
}

/*正文字体大小(不包含代码)*/
.post-content p{
font-size: 1.25rem;
}
li{
font-size: 1.2rem;

}

/*评论区字体大小*/
p {
font-size: 1.2rem

}

/*评论发送区字体大小*/
.form-control{
font-size: 1.2rem
}

/*评论勾选项目字体大小*/
.custom-checkbox .custom-control-input~.custom-control-label{
font-size: 1.2rem
}
/*评论区代码的强调色*/
code {
color: rgba(var(--themecolor-rgbstr));
}

/*说说字体大小和颜色设置*/
.shuoshuo-title {
font-size: 25px;
/* color: rgba(var(--themecolor-rgbstr)); */
}

/*尾注字体大小*/
.additional-content-after-post{
font-size: 1.2rem
}

/* 公告居中 */
.leftbar-announcement-title {
font-size: 20px;
/* text-align: center; */
color: #00FFFF
}

.leftbar-announcement-content {
font-size: 15px;
line-height: 1.8;
padding-top: 8px;
opacity: 0.8;
/* text-align: center; */
color:#00FFFF;
}

/* 一言居中 */
.leftbar-banner-title {
font-size: 20px;
display: block;
text-align: center;
opacity: 0.8;
}

/* 个性签名居中 */
.leftbar-banner-subtitle {
margin-top: 15px;
margin-bottom: 8px;
font-size: 13px;
opacity: 0.8;
display: block;
text-align: center;
}

/*========颜色设置===========*/

/*文章或页面的正文颜色*/
body{
color:#364863
}

/*引文属性设置*/
blockquote {
/*添加弱主题色为背景色*/
background: rgba(var(--themecolor-rgbstr), 0.1) !important;
width: 100%
}

/*引文颜色 建议用主题色*/
:root {
/*也可以用类似于--color-border-on-foreground-deeper: #009688;这样的命令*/
--color-border-on-foreground-deeper: rgba(var(--themecolor-rgbstr));
}

/*左侧菜单栏突出颜色修改*/
.leftbar-menu-item > a:hover, .leftbar-menu-item.current > a{
background-color: #f9f9f980;
}

/*站点概览分隔线颜色修改*/
.site-state-item{
border-left: 1px solid #aaa;
}
.site-friend-links-title {
border-top: 1px dotted #aaa;
}
#leftbar_tab_tools ul li {
padding-top: 3px;
padding-bottom: 3px;
border-bottom:none;
}
html.darkmode #leftbar_tab_tools ul li {
border-bottom:none;
}

/*左侧栏搜索框的颜色*/
button#leftbar_search_container {
background-color: transparent;
}

/*========透明设置===========*/

/*白天卡片背景透明*/
.card{
background-color:rgba(255, 255, 255, 0.8) !important;
/*backdrop-filter:blur(6px);*//*毛玻璃效果主要属性*/
-webkit-backdrop-filter:blur(6px);
}

/*小工具栏背景完全透明*/
/*小工具栏是card的子元素,如果用同一个透明度会叠加变色,故改为完全透明*/
.card .widget,.darkmode .card .widget,#post_content > div > div > div.argon-timeline-card.card.bg-gradient-secondary.archive-timeline-title{
background-color:#ffffff00 !important;
backdrop-filter:none;
-webkit-backdrop-filter:none;
}
.emotion-keyboard,#fabtn_blog_settings_popup{
background-color:rgba(255, 255, 255, 0.95) !important;
}

/*分类卡片透明*/
.bg-gradient-secondary{
background:rgba(255, 255, 255, 0.1) !important;
backdrop-filter: blur(10px);
-webkit-backdrop-filter:blur(10px);
}

/*夜间透明*/
html.darkmode.bg-white,html.darkmode .card,html.darkmode #footer{
background:rgba(66, 66, 66, 0.9) !important;
}
html.darkmode #fabtn_blog_settings_popup{
background:rgba(66, 66, 66, 0.95) !important;
}

/*标签背景
.post-meta-detail-tag {
background:rgba(255, 255, 255, 0.5)!important;
}*/

/*========排版设置===========*/

/*左侧栏层级置于上层*/
#leftbar_part1 {
z-index: 1;
}

/*分类卡片文本居中*/
#content > div.page-information-card-container > div > div{
text-align:center;
}

/*子菜单对齐及样式调整*/
.dropdown-menu .dropdown-item>i{
width: 10px;
}
.dropdown-menu>a {
color:var(--themecolor);
}
.dropdown-menu{
min-width:max-content;
}
.dropdown-menu .dropdown-item {
padding: .5rem 1.5rem 0.5rem 1rem;
}
.leftbar-menu-subitem{
min-width:max-content;
}
.leftbar-menu-subitem .leftbar-menu-item>a{
padding: 0rem 1.5rem 0rem 1rem;
}

/*左侧栏边距修改*/
.tab-content{
padding:10px 0px 0px 0px !important;
}
.site-author-links{
padding:0px 0px 0px 10px ;
}
/*目录位置偏移修改*/
#leftbar_catalog{
margin-left: 0px;
}
/*目录条目边距修改*/
#leftbar_catalog .index-link{
padding: 4px 4px 4px 4px;
}
/*左侧栏小工具栏字体缩小*/
#leftbar_tab_tools{
font-size: 14px;
}

/*正文图片边距修改*/
article figure {margin:0;}
/*正文图片居中显示*/
.fancybox-wrapper {
margin: auto;
}
/*正文表格样式修改*/
article table > tbody > tr > td,
article table > tbody > tr > th,
article table > tfoot > tr > td,
article table > tfoot > tr > th,
article table > thead > tr > td,
article table > thead > tr > th{
padding: 8px 10px;
border: 1px solid;
}
/*表格居中样式*/
.wp-block-table.aligncenter{margin:10px auto;}

/*回顶图标放大*/
button#fabtn_back_to_top, button#fabtn_go_to_comment, button#fabtn_toggle_blog_settings_popup, button#fabtn_toggle_sides, button#fabtn_open_sidebar{
font-size: 1.2rem;
}

/*顶栏菜单放大*/
/*这里也可以设置刚刚我们设置的btfFont字体。试试看!*/

.navbar-nav .nav-link {
font-size: 1rem;
font-family: 'echo';

}
.navbar-brand {
font-family: 'echo';
font-size: 1.2rem;
margin-right: 1.0 rem;
padding-bottom: 0.2 rem;

-webkit-text-fill-color: transparent;
background: linear-gradient(94.75deg,rgb(60, 172, 247) 0%,rgb(131, 101, 253) 43.66%, rgb(255, 141, 112) 64.23%,rgb(247, 201, 102) 83.76%,rgb(172, 143, 100) 100%);
-webkit-background-clip: text;
}

/*菜单大小*/
.nav-link-inner--text {
font-size: 1.25em;
}
.navbar-nav .nav-item {
margin-right:0;
}
.mr-lg-5, .mx-lg-5 {
margin-right:1rem !important;
}
.navbar-toggler-icon {
width: 1.8rem;
height: 1.8rem;
}
/*菜单间距*/
.navbar-expand-lg .navbar-nav .nav-link {
padding-right: 1.4em;
padding-left: 1.4em;
}

/*隐藏wp-SEO插件带来的线条阴影(不一定要装)*/
*[style='position: relative; z-index: 99998;'] {
display: none;
}

/* Github卡片样式*/
.github-info-card-header a {
/*Github卡片抬头颜色*/
color: black !important;
font-size: 1.5rem;
}
.github-info-card {
/*Github卡片文字(非链接)*/
font-size: 1rem;
color: black !important;
}
.github-info-card.github-info-card-full.card.shadow-sm {
/*Github卡片背景色*/
background-color: rgba(var(--themecolor-rgbstr), 0.1) !important;
}

/* 左侧栏外观CSS */

/* 头像 */
#leftbar_overview_author_image {
width: 100px;
height: 100px;
margin: auto;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
background-color: rgba(127, 127, 127, 0.1);
overflow: hidden;
transition: transform 0.3s ease;
}

/* 头像亮暗 */
#leftbar_overview_author_image:hover {
transform: scale(1.23);
filter: brightness(150%);
}

/* 名称 */
#leftbar_overview_author_name {
margin-top: 15px;
font-size: 18px;align-content;
color:#00FFFF;
}

/* 简介 */
#leftbar_overview_author_description {
font-size: 14px;
margin-top: -4px;
opacity: 0.8;
color:#c21f30;
}

/* 标题,链接等 */
a, .btn-neutral {
color:#AF7AC5 ;

}

/* 页脚透明 */
#footer {
background: var(--themecolor-gradient);
color: #fff;
width: 100%;
float: right;
margin-bottom: 25px;
text-align: center;
padding: 25px 20px;
line-height: 1.8;
transition: none;
opacity: 0.6;
}
```

### 8.2 根据主题自动透明

添加到 `页尾脚本` 里,根据主题色自动透明,透明度可以在op1、op2、op3.....那里设置

```

```

来源自友链朋友:[北冥红烧鱼 (hongshaoyv.com)](https://hongshaoyv.com/)

## 9. 头像缩放或亮暗

鼠标经过头像时自动缩放、高亮/暗

在 `外观` --- `自定义` --- `额外CSS` 中

```
#leftbar_overview_author_image {
width: 100px;
height: 100px;
margin: auto;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
background-color: rgba(127, 127, 127, 0.1);
overflow: hidden;
box-shadow: 0 0 5px rgba(116, 8, 204, 0.3);
transition: transform 0.3s ease; /*变化速度*/
}

#leftbar_overview_author_image:hover {
transform: scale(1.2); /*缩放大小*/
filter: brightness(150%); /*调节亮度*/
}
```

## 10. 头像/姓名跳转相关页

在 `外观` --- `主题文件编辑器` 中, 选择 `边栏文件(sidebar.php)`

点击 `头像` 跳转大概在第 `126` 行左右,

添加 `` 标签,即 ``, 其中链接改为想要跳转的地方

```



.... `

```


```

---

## 11. 评论头像显示

在 `外观` --- `主题文件编辑器` 中的 `function` 模板函数添加此代码

```
if ( ! function_exists( 'get_cravatar_url' ) ) {
/**
* 把Gravatar头像服务替换为Cravatar
* @param string $url
* @return string
*/
function get_cravatar_url( $url ) {
$sources = array(
'www.gravatar.com',
'0.gravatar.com',
'1.gravatar.com',
'2.gravatar.com',
'secure.gravatar.com',
'cn.gravatar.com'
);
return str_replace( $sources, 'cravatar.cn', $url );
}
add_filter( 'um_user_avatar_url_filter', 'get_cravatar_url', 1 );
add_filter( 'bp_gravatar_url', 'get_cravatar_url', 1 );
add_filter( 'get_avatar_url', 'get_cravatar_url', 1 );
}
```

来源:网络

## 12. 插件合集

### 12.1 网站访问数据(左侧栏)

1. **进入Wordpress,点击插件,搜索并且下载 Wp Statistics**
2. **外观——小工具——站点额外内容——旧版小工具——统计**

### 12.2 评论IP地址

> 以下根据体验自己选择

[WP-UserAgent | kyleabaker.com](https://www.kyleabaker.com/goodies/coding/wp-useragent/) From 友链大佬:[obaby@mars (h4ck.org.cn)](https://h4ck.org.cn/)

[WordPress 展示评论者地理位置插件 Easy Location | 歲月留聲 (0xo.net)](https://0xo.net/1947)

### 12.3 评论管理

**Akismet Anti-Spam: Spam Protection**

### 12.4 邮件发送

**WP Mail SMTP**

### 12.5 文章字数统计

**WP Word Count**

### 12.6 WP用户个人头像

**Simple Local Avatars**

## 教程视频

[个人博客网站美化代码使用*哔哩哔哩*bilibili](https://www.bilibili.com/video/BV1qM411k7NK/?spm_id_from=333.999.0.0)

[个人博客网站(Wordpress)基本使用*哔哩哔哩*bilibili](https://www.bilibili.com/video/BV1uW4y1E7wA/?spm_id_from=333.999.0.0)

## 推荐文章

1. [个人博客网站搭建 – Echo (liveout.cn)](https://www.liveout.cn/30/)
2. [个人博客主题分享(WordPress) – Echo (liveout.cn)](https://www.liveout.cn/31/)
3. [博客图片托管到又拍云教程 – Echo (liveout.cn)](https://www.liveout.cn/29/)
4. [Wordpress/Typecho博客搬迁教程 – Echo (liveout.cn)](https://www.liveout.cn/50-2/)

## 相关链接

**本文可能涉及的代码出自以下博客文章,十分感谢下面各位大佬的分享**

**关于 Argon 主题 更多美化内容文章**: [Argon 主题的美化设置 - Gong\_cx (gcxstudio.cn)](https://new.gcxstudio.cn/archives/argon-theme-settings/)

**博客透明、鼠标等美化:** [Docker系列 WordPress系列 特效 - Bensz (hwb0307.com)](https://blognas.hwb0307.com/linux/docker/744#comment-918)

**博客添加音乐插件**:

**Argon主题 GitHub地址**:[solstice23/argon-theme: ? Argon - 一个轻盈、简洁的 WordPress 主题 (github.com)](https://github.com/solstice23/argon-theme)

**Argon主题作者博客**:[solstice23 – Blog](https://solstice23.top/)

**Argon主题使用文档**:[Argon Theme Docs (solstice23.top)](https://argon-docs.solstice23.top/#/)

## FAQ

**如果遇到问题无法解决,请参考以下途径**

1. B站视频:[博客搭建常见问题汇总*哔哩哔哩*bilibili](https://www.bilibili.com/video/BV1zG4y1A7Wy/?spm_id_from=333.999.0.0&vd_source=a1234589a3616351986bc6d13bcbd8f8)
2. 翻翻评论区,已经有许多问题提出和解决了,大部分都一样
3. 查看官方文档

如果问题还未解决,请评论区留言

## 一些话

**很开心这篇美化文章能够帮助到大家,如果转载请标注原文地址哦,十分感谢!**

标签: 建站

已有 806 条评论

  1. 奕奕 奕奕

    怎么添加下面最底下的?颜色方框我想自己添加几个如果知道的话,添加一下我qq

    1. css添加就行了

      1. 奕奕 奕奕

        那怎么添加?css是不是在插件的顶部信息中添加

        1. 都在主题设置页脚里添加

  2. 奕奕 奕奕

    还在吗?

    1. 添加html,如果自定义样式就添加css

      1. 奕奕 奕奕

        我知道了谢谢

  3. leoxiaowoniu leoxiaowoniu

    能不能把设置导出发给我参考下

    1. json就是导出的设置

  4. zijing233 zijing233

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

    1. 额外css里添加修改标题的css,具体代码可以看字体那段

  5. 汐语 汐语

    博主,鼠标划过的彩色拖尾特效怎么添加呢,可以发一下具体代码吗

    1. 在文章 字体和鼠标那里

  6. 你好,您有过评论回复时间特别长就是卡在发送回复评论这个页面了,但其实评论回复成功了,我试了一下是邮件回复这里出问题了,但是之前还好好的,您知道怎么解决吗

    1. 不懂呢,没有遇到过这种情况

    2. 最近搬迁博客遇到了,确实是邮件原因,具体方法 看服务器25端口打没打开(一般邮件服务占用的端口) 还没用的话就下载插件:WP Mail SMTP
  7. :dinosaur-sweat:

  8. […] Argon主题博客美化 – Echo (liveout.cn) […]

  9. cd cd

    博主你好,我之前利用wp和agron主题搭建了一个网站,但之前服务器已过期,过期前我保存了网站文件,最近为网站搭建了新服务器,我把网站文件上传上去之后,之前的网站、文章、主题设置都没了,请问遇到这种情况该如何解决?

    1. 网站文件是指什么呢,服务器里wp文件夹吗?

      1. cd cd

        我使用的宝塔界面管理的网站文件,然后我是直接将老服务器的“wwwroot”文件夹下的“xxx(我的网站文件)”打包压缩,现在在新服务器的“wwwroot”文件夹下解压,最开始网站显示“数据库连接出错”,我就修改了wpconfig.php文件中的数据库用户名及密码改为了新服务器的数据库用户密码。

        1. 那数据库备份了吗

          1. cd cd

            备份了,都在我打包的网站文件中

          2. 阿哲,那我就不懂了 :dinosaur-powerless:
            我迁移的时候都是wp导出配置文件

          3. cd cd

            那行吧,我还想请问就是argon主题的JSON是保存在哪个文件中的

          4. 不懂哦(ó﹏ò。)

  10. 博主能挂个友链嘛 :flower-flower:
    https://blog.minjm.top/

    1. 缺少头像链接以及介绍哦

      1. 头像链接:https://q1.qlogo.cn/g?b=qq&nk=3240665204&s=640
        介绍:一个一时兴起搭建的小破站~

添加新评论