Location>code7788 >text

How to make your blog look better

Popularity:904 ℃/2025-04-20 20:25:04

Select Custom on the blog skin, and then fill in the CSS code on the page

#loading{bottom:0;left:0;position:fixed;right:0;top:0;z-index:9999;background-color:#f4f5f5;pointer-events:none;}.loader-inner{will-change:transform;width:40px;height:40px;position:absolute;top:50%;left:50%;margin:-20px 0 0 -20px;background-color:#3742fa;border-radius:50%;animation:scaleout 0.6s infinite ease-in-out forwards;text-indent:-99999px;z-index:999991;}@keyframes scaleout{0%{transform:scale(0);opacity:0;}40%{opacity:1;}100%{transform:scale(1);opacity:0;}}

(Remember to turn on the disabled template default CSS)
Fill in the HTML code of the first time<div ><div class="loader-inner"></div></div>
Fill in the footer HTML code

<script src="/awescnb/"></script>
 <script>
  const opts = {
     theme: {
       name: 'geek',
       url: "/acnb-theme-geek/",
       log: true,
       avatar: "/cnblogs_com/blogs/840523/galleries/2447096/o_250328224322_%E5%A4%B4%E5%83%", //Your avatar
       headerBackground:
       "/cnblogs_com/blogs/840523/galleries/2447096/t_250328232835_%E5%B1%8F%E5%B9%95%E6%88%AA%E5%9B%BE%202025-03-29%", //The background image of your interface top
     },
     highLight: {
       enable: true,
     },
     lineNumbers: {
       enable: true,
     },
     github: {
       enable: false,
       url: "/xxxx",//Your github account, you can enable:false
     },
     gitee: {
       enable: false,
       url: '/xxxxxx',//Your gitee account, you can enable:false
     },
     Click: {
       enable: true,
     },
     emoji: {
       enable: true,
     },
     darkMode: {
       enable: true,
       autoDark: true,
       autoLight: false,
     },
     qrcode: {
       enable: false,
       img: '/img/',//Your WeChat official account picture, you can enable:false
       desc: 'WeiyiGeek official account',//Your WeChat official account name
     },
     donation: {
       enable: false,
       qrcodes: ['/gh/weiyigeek//img/'],
     },//Your Alipay appreciates the picture, no can enable:false
     signature: {
       enable: true,
       contents: [
          "<b>💡 Have ideals, but not delusions, 💭 Have hope, but not extravagant expectations, 🐬 Have actions, but not act recklessly.</b>",
       ],//Your personal signature
     },
     postSignature: {
       enable: true,
       enableLicense: true,
       content: ['Attribution-Non-Commercial Use-Share in the same way 4.0 International', '/licenses/by-nc-sa/4.0/'],
     },
     links: {
       enable: true, //The following section can define your other related interfaces and account links
       value: [
         {
           name: "🍞 OI Wiki",
           link: "/",
         },
         {
           name: "🎨 Blog Home Page",
           link: "/",
         },
         // {
         // name: "👨‍💻 Blogger introduction",
         // link: "/about/",
         // },
         {
           name: "🍻 luogu homepage",
           link: "/user/1022974",
         },
         {
           name: "🧀 Bilibili",
           link: "/1531385378?spm_id_from=333.1007.0.0",
         },
         // {
         // name: "🍪 Today's Headlines",
         // link: "/c/user/token/MS4wLjABAAAAqcPSoMqfctaEqJpGSF775eeCjWkrop4AOyLITdMx-L78F5iXzfQcSRM5sY4dq3wR/?source=author_home",
         // },
         // {
         // name: "🦁 Baijiahao",
         // link: "/home?from=blog&app_id=1726736601523415",
         // }
       ],//These are all "portals" that can be changed by yourself, followed by the web address
     },
   };
   $.awesCnb(opts);
 </script>
 <script type="text/javascript">
      = function () {
         var minSize = 10; //Minimum font
         var maxSize = 20; //Maximum font
         var newOne = 500; // Generate snowflake interval
         var flakColor = "#f5f5f5fa"; //Snowflake color
         var flak = $("<div></div>").css({ position: "absolute", "top": "0px", "z-index": "9999" }).html("✽"); //Define a snowflake, add z-index
         var dhigh = $(window).height(); //Define the view height
         var dw = $(window).width() - 80; //Define the view width
         setInterval(function () {
             var sizeflak = minSize + () * maxSize; //Produce snowflakes of varying sizes
             var startLeft = () * dw; //Snowflake generation is a random left value
             var startOpacity = 0.7 + () * 0.3; //Random transparency
             var endTop = dhigh - 100; //The position of the snowflake stop top
             var endLeft = () * dw; //The left position of the snowflake stop
             var durationfull = 5000 + () * 3000; //The snowflakes fall at different speeds
             ().appendTo($("body")).css({
                 "left": startLeft,
                 "opacity": startOpacity,
                 "font-size": sizeflak,
                 "color": flakColor
             }).animate({
                 "top": endTop,
                 "left": endLeft,
                 "opacity": 0.1 //Fixed spelling error: "opacity"
             }, durationfull, function () {
                 $(this).remove()
             });
         }, newOne);
     }
 </script>

In the footer code, I have written some comments for you, and you can adjust them yourself. If you don’t write comments, don’t worry about them (remember to have JS permissions. It’s okay if you don’t have one, just apply. Just fill in the reason for "I want to decorate the blog so that readers can read more happily")