子比主题-侧边栏添加投稿卡片

效果预览

美化步骤

模块配置，侧边栏添加自定义html

<div class="textwidget custom-html-widget">
    <style type="text/css">
        #update_version img {
            margin: 0px 0 15px
        }

        #update_version a {
            width: 30%;
            height: 35px;
            border-radius: 3px;
            text-align: center;
            line-height: 35px;
            font-size: 9pt;
            color: #fff;
            font-weight: 700;
        }

        .blog_link {
            background-color: #2ba9fa
        }

        .blog_link,
        .cms_link {
            float: left;
            margin-right: 5%
        }

        .cms_link {
            background-color: #ff6969
        }

        .grid_link {
            float: left;
            background-color: #70c041
        }
    </style>
    <div id="update_version">
        <a href="/" target="_blank" rel="noopener"><img title="满心博客" src="https://img.lovelu.top/wordpress/resource/tougao.webp" alt="图片" style="border-radius:5px;"></a>
        <a class="blog_link" href="https://mail.qq.com/cgi-bin/qm_share?t=qm_mailme&email=837054936@qq.com" target="_blank" style="background-image: linear-gradient(120deg, #3ca5f6 0%, #a86af9 100%);" rel="noopener">站长邮箱</a>
        <a class="cms_link" href="/newposts" target="_blank" style="background-image: linear-gradient(120deg, #f093fb 0%, #f5576c 100%);" rel="noopener">在线投稿</a>
        <a class="grid_link" href="/link" target="_blank" style="background-image: linear-gradient(to right, #fa709a 0%, #fee140 100%);" rel="noopener">友情链接</a>
    </div>
    <div>
        <hr>
    </div>
</div>

感谢您的来访，获取更多精彩文章请收藏本站。