agron主题美化设置
本文最后更新于57 天前,其中的信息可能已经过时,如有错误请发送邮件到1729915388@qq.com

主题资源

链接:https://pan.baidu.com/s/1yyA-m_h_wku7n3qzK-eYEQ?pwd=echo 提取码:echo

总体配置导入

  • 在最下面点击导入设置
{"argon_theme_color":"#673bb7","argon_theme_color_hex_preview":"#673bb7","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":"2","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":"Qiang","argon_toolbar_icon":"","argon_toolbar_icon_link":" ","argon_toolbar_blur":"true","argon_banner_title":"Runse‘s blog","argon_banner_subtitle":"人生百年有几  念良辰美景  休放虚过","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":"http://qnyimg.xyqiang.top/%E6%97%A5%E5%B8%B8%E7%94%A8/wallhaven-jx5yjw.jpg","argon_page_background_dark_url":"http://qnyimg.xyqiang.top/%E6%97%A5%E5%B8%B8%E7%94%A8/wallhaven-2yeo9x.jpg","argon_page_background_opacity":"1","argon_sidebar_banner_title":"****","argon_sidebar_banner_subtitle":"我们拿到的是人生体验卡,而非任务表!","argon_sidebar_auther_name":"Qiang","argon_sidebar_auther_image":"http://qnyimg.xyqiang.top/%E5%8D%9A%E5%AE%A2%E5%9B%BE%E7%89%87/1.jpg","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":"","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% 天前,其中的信息可能已经过时,如有错误请发送邮件到1729915388@qq.com","argon_archives_timeline_show_month":"true","argon_archives_timeline_url":"http://www.xyqiang.top/index.php/licheng/","argon_footer_html":"<style>\n/* 核心样式 */\n.github-badge {\ndisplay: inline-block;\nborder-radius: 4px;\ntext-shadow: none;\nfont-size: 13.1px;\ncolor: #fff;\nline-height: 15px;\nmargin-bottom: 5px;\nfont-family: \"Open Sans\", sans-serif;\n}\n.github-badge .badge-subject {\ndisplay: inline-block;\nbackground-color: #4d4d4d;\npadding: 4px 4px 4px 6px;\nborder-top-left-radius: 4px;\nborder-bottom-left-radius: 4px;\nfont-family: \"Open Sans\", sans-serif;\n}\n.github-badge .badge-value {\ndisplay: inline-block;\npadding: 4px 6px 4px 4px;\nborder-top-right-radius: 4px;\nborder-bottom-right-radius: 4px;\nfont-family: \"Open Sans\", sans-serif;\n}\n.github-badge-big {\ndisplay: inline-block;\nborder-radius: 6px;\ntext-shadow: none;\nfont-size: 14.1px;\ncolor: #fff;\nline-height: 18px;\nmargin-bottom: 7px;\n}\n.github-badge-big .badge-subject {\ndisplay: inline-block;\nbackground-color: #4d4d4d;\npadding: 4px 4px 4px 6px;\nborder-top-left-radius: 4px;\nborder-bottom-left-radius: 4px;\n}\n.github-badge-big .badge-value {\ndisplay: inline-block;\npadding: 4px 6px 4px 4px;\nborder-top-right-radius: 4px;\nborder-bottom-right-radius: 4px;\n}\n.bg-orange {\nbackground-color: #ec8a64 !important;\n}\n.bg-red {\nbackground-color: #cb7574 !important;\n}\n.bg-apricots {\nbackground-color: #f7c280 !important;\n}\n.bg-casein {\nbackground-color: #dfe291 !important;\n}\n.bg-shallots {\nbackground-color: #97c3c6 !important;\n}\n.bg-ogling {\nbackground-color: #95c7e0 !important;\n}\n.bg-haze {\nbackground-color: #9aaec7 !important;\n}\n.bg-mountain-terrier {\nbackground-color: #99a5cd !important;\n}\n</style>\n \n<div class=\"github-badge-big\">\n<span class=\"badge-subject\"><i class=\"fa fa-id-card\"></i> 备案号 </span\n><span class=\"badge-value bg-orange\">\n<a href=\"https://beian.miit.gov.cn/\" target=\"_blank\" one-link-mark=\"yes\"\n>皖ICP备2022016531号</a\n>\n|\n<a\nhref=\"http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=34120402000413\"\ntarget=\"_blank\"\none-link-mark=\"yes\"\n>\n皖公网安备34120402000413号</a\n></span\n>\n</div>\n<div class=\\\"github-badge\\\">\n<span class=\\\"badge-value bg-green\\\"\\n><a href=\"https://cn.wordpress.org/\\\" target=\\\"_blank\\\" one-link-mark=\\\"yes\\\"\\n>WordPress</a\n></span\n>\n</div>\n<div class=\"github-badge-big\">\n<span class=\"badge-subject\">Copyright </span\n><span class=\"badge-value bg-red\">\n2022-2024\n<i class=\"fa fa-copyright\"></i> XYQiang</span\n>\n</script>\n</div>\n<div class=\"github-badge-big\">\n<span class=\"badge-subject\"><i class=\"fa fa-clock-o\"></i> Running Time</span\n><span class=\"badge-value bg-apricots\"\n><span id=\"blog_running_days\" class=\"odometer odometer-auto-theme\"></span>\ndays\n<span id=\"blog_running_hours\" class=\"odometer odometer-auto-theme\"></span> H\n<span id=\"blog_running_mins\" class=\"odometer odometer-auto-theme\"></span> M\n<span id=\"blog_running_secs\" class=\"odometer odometer-auto-theme\"></span>\nS</span\n>\n <script no-pjax=\"\">\nvar blog_running_days = document.getElementById(\"blog_running_days\");\nvar blog_running_hours = document.getElementById(\"blog_running_hours\");\nvar blog_running_mins = document.getElementById(\"blog_running_mins\");\nvar blog_running_secs = document.getElementById(\"blog_running_secs\");\nfunction refresh_blog_running_time() {\nvar time = new Date() - new Date(2022, 10,10, 0, 0, 0);\nvar d = parseInt(time / 24 / 60 / 60 / 1000);\nvar h = parseInt((time % (24 * 60 * 60 * 1000)) / 60 / 60 / 1000);\nvar m = parseInt((time % (60 * 60 * 1000)) / 60 / 1000);\nvar s = parseInt((time % (60 * 1000)) / 1000);\nblog_running_days.innerHTML = d;\nblog_running_hours.innerHTML = h;\nblog_running_mins.innerHTML = m;\nblog_running_secs.innerHTML = s;\n}\nrefresh_blog_running_time();\nif (typeof bottomTimeIntervalHasSet == \"undefined\") {\nvar bottomTimeIntervalHasSet = true;\nsetInterval(function () {\nrefresh_blog_running_time();\n}, 500);\n}\n</script>\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":"<script type=\"text/javascript\">\nvar a_idx = 0;\njQuery(document).ready(function($) {\n $(\"body\").click(function(e) {\n     var a = new Array(\"❤富强❤\",\"❤民主❤\",\"❤文明❤\",\"❤和谐❤\",\"❤自由❤\",\"❤平等❤\",\"❤公正❤\",\"❤法治❤\",\"❤爱国❤\",\"❤敬业❤\",\"❤诚信❤\",\"❤友善❤\");\n     var $i = $(\"<span></span>\").text(a[a_idx]);\n     a_idx = (a_idx + 1) % a.length;\n     var x = e.pageX,\n     y = e.pageY;\n     $i.css({\n         \"z-index\": 99999,\n         \"top\": y - 20,\n         \"left\": x,\n         \"position\": \"absolute\",\n         \"font-weight\": \"bold\",\n         \"color\": \"rgb(\"+~~(255*Math.random())+\",\"+~~(255*Math.random())+\",\"+~~(255*Math.random())+\")\"//颜色随机\n         //\"#2299DD\"  //固定颜色\n     });\n     $(\"body\").append($i);\n     $i.animate({\n         \"top\": y - 180,\n         \"opacity\": 0\n     },\n     1500,\n     function() {\n         $i.remove();\n     });\n });\n});\n</script>\n\n\n<!-- 自定义右键 -->\n<style type=\"text/css\">\n a {text-decoration: none;}\n div.usercm{background-repeat:no-repeat;background-position:center center;background-size:cover;background-color:#fff;font-size:13px!important;width:130px;-moz-box-shadow:1px 1px 3px rgba\n(0,0,0,.3);box-shadow:0px 0px 15px #333;position:absolute;display:none;z-index:10000;opacity:0.9;border-radius: 5px;}\n div.usercm ul{list-style-type:none;list-style-position:outside;margin:0px;padding:0px;display:block}\n div.usercm ul li{margin:0px;padding:0px;line-height:35px;}\n div.usercm ul li a{color:#666;padding:0 15px;display:block}\n div.usercm ul li a:hover{color:#fff;background:rgba(9,145,113,0.88);border-radius: 5px}\n div.usercm ul li a i{margin-right:10px}\n a.disabled{color:#c8c8c8!important;cursor:not-allowed}\n a.disabled:hover{background-color:rgba(255,11,11,0)!important}\n div.usercm{background:#fff !important;}\n </style>\n<div class=\"usercm\" style=\"left: 199px; top: 5px; display: none;\">\n <ul>\n     <li><a href=\"https://www.xyqiang.top/\"><i class=\"fa fa-home fa-fw\"></i><span>首页</span></a></li>\n     <li><a href=\"javascript:void(0);\" onclick=\"getSelect();\"><i class=\"fa fa-file fa-fw\"></i><span>复制</span></a></li>\n     <li><a href=\"javascript:void(0);\" onclick=\"baiduSearch();\"><i class=\"fa fa-search fa-fw\"></i><span>百度</span></a></li>\n     <li><a href=\"javascript:history.go(1);\"><i class=\"fa fa-arrow-right fa-fw\"></i><span>前进</span></a></li>\n     <li><a href=\"javascript:history.go(-1);\"><i class=\"fa fa-arrow-left fa-fw\"></i><span>后退</span></a></li>\n     <li style=\"border-bottom:1px solid gray\"><a href=\"javascript:window.location.reload();\"><i class=\"fa fa-refresh fa-fw\"></i><span>刷新</span></a></li>\n     <li><a href=\"http://www.xyqiang.top/index.php/link/\"><i class=\"fa fa-user fa-fw\"></i><span>和我当邻居</span></a></li>  \n        <li><a href=\"http://www.xyqiang.top/index.php/qiaoqiaohua/\"><i class=\"fa fa-pencil fa-fw\"></i><span>给我留言吧</span></a></li>\n </ul>\n</div>\n<script type=\"text/javascript\" src=\"https://cdn.staticfile.org/layer/3.1.1/layer.js\"></script>\n<script type=\"text/javascript\">\n (function(a) {\n     a.extend({\n         mouseMoveShow: function(b) {\n             var d = 0,\n                 c = 0,\n                 h = 0,\n                 k = 0,\n                 e = 0,\n                 f = 0;\n             a(window).mousemove(function(g) {\n                 d = a(window).width();\n                 c = a(window).height();\n                 h = g.clientX;\n                 k = g.clientY;\n                 e = g.pageX;\n                 f = g.pageY;\n                 h + a(b).width() >= d && (e = e - a(b).width() - 5);\n                 k + a(b).height() >= c && (f = f - a(b).height() - 5);\n                 a(\"html\").on({\n                     contextmenu: function(c) {\n                         3 == c.which && a(b).css({\n                             left: e,\n                             top: f\n                         }).show()\n                     },\n                     click: function() {\n                         a(b).hide()\n                     }\n                 })\n             })\n         },\n         disabledContextMenu: function() {\n             window.oncontextmenu = function() {\n                 return !1\n             }\n         }\n     })\n })(jQuery);\n\n function getSelect() {\n     \"\" == (window.getSelection ? window.getSelection() : document.selection.createRange().text) ? layer.msg(\"请选择需要复制的内容!\") : document.execCommand(\"Copy\")\n }\n function baiduSearch() {\n     var a = window.getSelection ? window.getSelection() : document.selection.createRange().text;\n     \"\" == a ? layer.msg(\"请选择需要百度的内容!\") : window.open(\"https://www.baidu.com/s?wd=\" + a)\n }\n $(function() {\n     for (var a = navigator.userAgent, b = \"Android;iPhone;SymbianOS;Windows Phone;iPad;iPod\".split(\";\"), d = !0, c = 0; c < b.length; c++) if (0 < a.indexOf(b[c])) {\n         d = !1;\n         break\n     }\n     d && ($.mouseMoveShow(\".usercm\"), $.disabledContextMenu())\n });\n </script>","argon_custom_html_foot":"<link rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.css\">\n<script src=\"https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.js\"></script>\n<script src=\"https://cdn.jsdelivr.net/npm/meting@2.0.1/dist/Meting.min.js\"></script>\n \n<meting-js \n    server=\"netease\" \n    type=\"playlist\" \n    id=\"2853587458\"\n    fixed=\"true\" \n    mini=\"true\"\n    order=\"list\"\n    loop=\"all\"\n    preload=\"auto\"\n    list-folded=\"true\"\n    lrc-type=\"0\"\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"}

鼠标左击特效

  • 放在页头脚本中
<script type="text/javascript">
var a_idx = 0;
jQuery(document).ready(function($) {
 $("body").click(function(e) {
     var a = new Array("❤富强❤","❤民主❤","❤文明❤","❤和谐❤","❤自由❤","❤平等❤","❤公正❤","❤法治❤","❤爱国❤","❤敬业❤","❤诚信❤","❤友善❤");
     var $i = $("<span></span>").text(a[a_idx]);
     a_idx = (a_idx + 1) % a.length;
     var x = e.pageX,
     y = e.pageY;
     $i.css({
         "z-index": 99999,
         "top": y - 20,
         "left": x,
         "position": "absolute",
         "font-weight": "bold",
         "color": "rgb("+~~(255*Math.random())+","+~~(255*Math.random())+","+~~(255*Math.random())+")"//颜色随机
         //"#2299DD"  //固定颜色
     });
     $("body").append($i);
     $i.animate({
         "top": y - 180,
         "opacity": 0
     },
     1500,
     function() {
         $i.remove();
     });
 });
});
</script>

自定义右击页面

  • 放在页头脚本里
<!-- 自定义右键 -->
<style type="text/css">
 a {text-decoration: none;}
 div.usercm{background-repeat:no-repeat;background-position:center center;background-size:cover;background-color:#fff;font-size:13px!important;width:130px;-moz-box-shadow:1px 1px 3px rgba
(0,0,0,.3);box-shadow:0px 0px 15px #333;position:absolute;display:none;z-index:10000;opacity:0.9;border-radius: 5px;}
 div.usercm ul{list-style-type:none;list-style-position:outside;margin:0px;padding:0px;display:block}
 div.usercm ul li{margin:0px;padding:0px;line-height:35px;}
 div.usercm ul li a{color:#666;padding:0 15px;display:block}
 div.usercm ul li a:hover{color:#fff;background:rgba(9,145,113,0.88);border-radius: 5px}
 div.usercm ul li a i{margin-right:10px}
 a.disabled{color:#c8c8c8!important;cursor:not-allowed}
 a.disabled:hover{background-color:rgba(255,11,11,0)!important}
 div.usercm{background:#fff !important;}
 </style>
<div class="usercm" style="left: 199px; top: 5px; display: none;">
 <ul>
     <li><a href="https://www.xyqiang.top/"><i class="fa fa-home fa-fw"></i><span>首页</span></a></li>
     <li><a href="javascript:void(0);" onclick="getSelect();"><i class="fa fa-file fa-fw"></i><span>复制</span></a></li>
     <li><a href="javascript:void(0);" onclick="baiduSearch();"><i class="fa fa-search fa-fw"></i><span>百度</span></a></li>
     <li><a href="javascript:history.go(1);"><i class="fa fa-arrow-right fa-fw"></i><span>前进</span></a></li>
     <li><a href="javascript:history.go(-1);"><i class="fa fa-arrow-left fa-fw"></i><span>后退</span></a></li>
     <li style="border-bottom:1px solid gray"><a href="javascript:window.location.reload();"><i class="fa fa-refresh fa-fw"></i><span>刷新</span></a></li>
     <li><a href="https://www.xyqiang.top/link/"><i class="fa fa-user fa-fw"></i><span>和我当邻居</span></a></li>  
        <li><a href="https://www.xyqiang.top/liuyanban/"><i class="fa fa-pencil fa-fw"></i><span>给我留言吧</span></a></li>
 </ul>
</div>
<script type="text/javascript" src="https://cdn.staticfile.org/layer/3.1.1/layer.js"></script>
<script type="text/javascript">
 (function(a) {
     a.extend({
         mouseMoveShow: function(b) {
             var d = 0,
                 c = 0,
                 h = 0,
                 k = 0,
                 e = 0,
                 f = 0;
             a(window).mousemove(function(g) {
                 d = a(window).width();
                 c = a(window).height();
                 h = g.clientX;
                 k = g.clientY;
                 e = g.pageX;
                 f = g.pageY;
                 h + a(b).width() >= d && (e = e - a(b).width() - 5);
                 k + a(b).height() >= c && (f = f - a(b).height() - 5);
                 a("html").on({
                     contextmenu: function(c) {
                         3 == c.which && a(b).css({
                             left: e,
                             top: f
                         }).show()
                     },
                     click: function() {
                         a(b).hide()
                     }
                 })
             })
         },
         disabledContextMenu: function() {
             window.oncontextmenu = function() {
                 return !1
             }
         }
     })
 })(jQuery);
​
 function getSelect() {
     "" == (window.getSelection ? window.getSelection() : document.selection.createRange().text) ? layer.msg("请选择需要复制的内容!") : document.execCommand("Copy")
 }
 function baiduSearch() {
     var a = window.getSelection ? window.getSelection() : document.selection.createRange().text;
     "" == a ? layer.msg("请选择需要百度的内容!") : window.open("https://www.baidu.com/s?wd=" + a)
 }
 $(function() {
     for (var a = navigator.userAgent, b = "Android;iPhone;SymbianOS;Windows Phone;iPad;iPod".split(";"), d = !0, c = 0; c < b.length; c++) if (0 < a.indexOf(b[c])) {
         d = !1;
         break
     }
     d && ($.mouseMoveShow(".usercm"), $.disabledContextMenu())
 });
 </script>

网页虚拟人物

  • 放在页脚脚本
<script src="https://eqcn.ajz.miesnfu.com/wp-content/plugins/wp-3d-pony/live2dw/lib/L2Dwidget.min.js"></script>
<script>
 L2Dwidget.init({
     "model": {
       //jsonpath控制显示那个小萝莉模型,
         //(切换模型需要改动)
//              "https://unpkg.com/(live2d-widget-model-koharu)@1.0.5/assets/(koharu).model.json"
         jsonPath: "https://unpkg.com/live2d-widget-model-koharu@1.0.5/assets/koharu.model.json",
         "scale": 1
     },
     "display": {
         "position": "right", //看板娘的表现位置
         "width": 75,  //小萝莉的宽度
         "height": 150, //小萝莉的高度
         "hOffset": 0,
         "vOffset": -20
     },
     "mobile": {
         "show": true,
         "scale": 0.5
     },
     "react": {
         "opacityDefault": 0.7,
         "opacityOnHover": 0.2
     }
 });
</script>
​
/*   小帅哥: 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 */

动态背景

  • 放在页脚脚本
<video
src="https://new.gcxstudio.cn/wp-content/uploads/2022/03/daymode.mp4" /*白天动态视频链接*/
class="bg-video bg-video-day"
autoplay=""
loop="loop"
muted=""
></video>
<video
src="https://new.gcxstudio.cn/wp-content/uploads/2022/03/darkmode.webm" /*夜间动态视频链接*/
class="bg-video bg-video-night"
autoplay=""
loop="loop"
muted=""
></video>
<style>
video.bg-video {
position: fixed;
z-index: -1;
left: 0;
right: 0;
top: 0;
bottom: 0;
width: 100vw;
height: 100vh;
object-fit: cover;
pointer-events: none;
}
html.darkmode video.bg-video.bg-video-day {
opacity: 0;
}
html.darkmode video.bg-video.bg-video-night {
opacity: 1;
}
video.bg-video.bg-video-day {
opacity: 1;
}
video.bg-video.bg-video-night {
opacity: 0;
}
#banner,
#banner .shape {
background: transparent !important;
}
* {
font-family: "Comfortaa", "Open Sans", -apple-system, system-ui,
BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Helvetica, Arial,
"PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimSun, sans-serif;
}
</style>
<script
src="https://api.gcxstudio.cn/odometer/odometer.min.js"
integrity="sha256-65R1G5irU1VT+k8L4coqgd3saSvO/Wufson/w+v2Idw="
crossorigin="anonymous"
></script>
​
​
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.css">
<script src="https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.js"></script>
​
<div id='aplayer'></div>

音乐播放功能

  • 放在页尾脚本

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

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

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

具体参数设置点击此链接:https://yy.liveout.cn/article/Learn/front-end/aplayer%E5%8F%82%E6%95%B0.png

Aplayer 播放器官网文档:APlayer HTML5 音乐播放器 | ACE-BLOG (ace520.github.io)


<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.css">
<script src="https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/meting@2.0.1/dist/Meting.min.js"></script>
​
<meting-js 
 server="netease" 
 type="playlist" 
 id="2853587458"
 fixed="true" 
 mini="true"
 order="list"
 loop="all"
 preload="auto"
 list-folded="true"
 lrc-type="0"
>

底部备案信息

  • 都放在页脚处
  1. CSS样式
<style>
/* 核心样式 */
.github-badge {
display: inline-block;
border-radius: 4px;
text-shadow: none;
font-size: 13.1px;
color: #fff;
line-height: 15px;
margin-bottom: 5px;
font-family: "Open Sans", sans-serif;
}
.github-badge .badge-subject {
display: inline-block;
background-color: #4d4d4d;
padding: 4px 4px 4px 6px;
border-top-left-radius: 4px;
border-bottom-left-radius: 4px;
font-family: "Open Sans", sans-serif;
}
.github-badge .badge-value {
display: inline-block;
padding: 4px 6px 4px 4px;
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
font-family: "Open Sans", sans-serif;
}
.github-badge-big {
display: inline-block;
border-radius: 6px;
text-shadow: none;
font-size: 14.1px;
color: #fff;
line-height: 18px;
margin-bottom: 7px;
}
.github-badge-big .badge-subject {
display: inline-block;
background-color: #4d4d4d;
padding: 4px 4px 4px 6px;
border-top-left-radius: 4px;
border-bottom-left-radius: 4px;
}
.github-badge-big .badge-value {
display: inline-block;
padding: 4px 6px 4px 4px;
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
}
.bg-orange {
background-color: #ec8a64 !important;
}
.bg-red {
background-color: #cb7574 !important;
}
.bg-apricots {
background-color: #f7c280 !important;
}
.bg-casein {
background-color: #dfe291 !important;
}
.bg-shallots {
background-color: #97c3c6 !important;
}
.bg-ogling {
background-color: #95c7e0 !important;
}
.bg-haze {
background-color: #9aaec7 !important;
}
.bg-mountain-terrier {
background-color: #99a5cd !important;
}
</style>
  1. HTML样式
<div class="github-badge-big">
<span class="badge-subject"><i class="fa fa-id-card"></i> 备案号 </span
><span class="badge-value bg-orange">
<a href="https://beian.miit.gov.cn/" target="_blank" one-link-mark="yes"
>皖ICP备2022016531号</a
>
|
<a
href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode= 32072202010255"
target="_blank"
one-link-mark="yes"
>皖公网安备 (备案中)</a>
</span>
​
</div>
<div class="github-badge-big">
<span class="badge-subject">Copyright </span
><span class="badge-value bg-red">
2022-2022
<i class="fa fa-copyright"></i> Qiang</span
>
</script>
</div>
​
<div class="github-badge">
<span class="badge-subject"><i class="fa fa-wordpress"></i> Powered</span
><span class="badge-value bg-green"
><a href="https://cn.wordpress.org/" target="_blank" one-link-mark="yes"
>WordPress</a
></span
>
</div>
<div class="github-badge-big">
<span class="badge-subject"><i class="fa fa-clock-o"></i> Running Time</span
><span class="badge-value bg-apricots"
><span id="blog_running_days" class="odometer odometer-auto-theme"></span>
days
<span id="blog_running_hours" class="odometer odometer-auto-theme"></span> H
<span id="blog_running_mins" class="odometer odometer-auto-theme"></span> M
<span id="blog_running_secs" class="odometer odometer-auto-theme"></span>
S</span
>
  1. JAVAscripe样式网站运行时间

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

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

<script no-pjax="">
var blog_running_days = document.getElementById("blog_running_days");
var blog_running_hours = document.getElementById("blog_running_hours");
var blog_running_mins = document.getElementById("blog_running_mins");
var blog_running_secs = document.getElementById("blog_running_secs");
function refresh_blog_running_time() {
var time = new Date() - new Date(2022, 10, 10, 0, 0, 0); /*此处日期的月份改为自己真正月份的前一个月*/
var d = parseInt(time / 24 / 60 / 60 / 1000);
var h = parseInt((time % (24 * 60 * 60 * 1000)) / 60 / 60 / 1000);
var m = parseInt((time % (60 * 60 * 1000)) / 60 / 1000);
var s = parseInt((time % (60 * 1000)) / 1000);
blog_running_days.innerHTML = d;
blog_running_hours.innerHTML = h;
blog_running_mins.innerHTML = m;
blog_running_secs.innerHTML = s;
}
refresh_blog_running_time();
if (typeof bottomTimeIntervalHasSet == "undefined") {
var bottomTimeIntervalHasSet = true;
setInterval(function () {
refresh_blog_running_time();
}, 500);
}
</script>

相关链接

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

关于 Argon 主题 更多美化内容文章Argon 主题的美化设置 – Gong_cx (gcxstudio.cn)

关于博客中添加音乐插件: https://echeverra.cn/aplayer

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

Argon 主题制作人博客solstice23 – Blog

Argon 主题使用文档首页 – Argon Theme Docs (solstice23.top)

Argon 主题美化设置参考:https://www.liveout.cn/argon_beauty/

文末附加内容

评论

发送评论 编辑评论


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