欢迎来到我的博客小站。  交流请加我微信好友: studyjava。  也欢迎关注公众号:Java学习之道 Fork me on GitHub

博客园打赏设置

1、个性签名中打赏设置:

我们就来做个求打赏的签名吧,支付宝求打赏签名测试代码:

在设置页面的左边菜单“博客签名”使用的代码:

<div class="div_masklayer" id="div_masklayer"></div>
<div class="div_popup" id="Div_popup"> <img class="img_zfb" id="img_zfb" src="http://images.cnblogs.com/cnblogs_com/mmzs/1152946/o_zhichi.jpg">
  <p class="mid" style="color: white; font-size: 16px">您的资助是我最大的动力!<br>金额随意,欢迎来赏!</p>
</div>


<div class="autograph">
  <p style="font-size: 16px"> <span style="display: none"> 如果,您认为阅读这篇博客让您有些收获,不妨点击一下右下角的<a id="btnRecommendMyBlog">【<strong>推荐</strong>】</a>按钮<br>
    </span> 如果,您希望更容易地发现我的新博客,不妨点击一下绿色通道的<a id="guanzhuwo">【<strong>关注我</strong>】</a>。</p>
  <div class="blogds" style="font-family: 楷体; font-size: 19px"><b>如果,想给予我更多的鼓励,</b><span class="bold">求打</span> <a class="btn_donate" style="position: absolute" id="btn_donate" title="Donate 打赏" target="_self"></a> </div>
  <p style="font-size: 16px">因为,我的写作热情也离不开您的肯定支持,感谢您的阅读,我是<a href="http://www.cnblogs.com/mmzs">【<strong>淼淼之森</strong>】</a>!</p>
</div>

在博客园后台设置-->页面定制CSS代码:

<!-- 打赏个性签名 -->
<style type="text/css">
* {
    margin:0;
    padding:0;
}
html {
    _background:url(about:blank);
} /**//* 阻止闪动 in IE6 , 把空文件换成about:blank , 减少请求 */
body {
    background:#fff;
    font: 12px/1.5 Tahoma, Geneva, \\5b8b\\4f53, sans-serif;
    height:100%;
}
.custom_hide {
    display: none;
}
.mid {
    font-size:18px;
    font-weight:bold;
    color:#f9f;
    text-align:center;
    vertical-align:top;
    line-height:24px;
}
/**//** 遮罩层 **/ 
.div_masklayer {
    background:#000;
    display:none;
    filter:alpha(opacity = 50);
    opacity:0.5;
    top:0;
    left:0;
    height:100%;
    width:100%;
    z-index:999;
    position:fixed;
    _position:absolute;
_left: expression(documentElement.scrollLeft + documentElement.clientWidth - this.offsetWidth);
_top: expression(documentElement.scrollTop + documentElement.clientHeight - this.offsetHeight);
}
/**//** 弹出层 **/ 
.div_popup {
    display:none;
    width:50%;
    z-index:1000;
    background:#0aa;
    left:30%;
    top:50%;
    position:fixed!important;
    margin-left:-150px !important;
    _position:absolute;
_top:expression(eval(document.compatMode && document.compatMode=='CSS1Compat')? documentElement.scrollTop + (document.documentElement.clientHeight - this.offsetHeight)/2: /**//*IE6*/ 
document.body.scrollTop + (document.body.clientHeight - this.clientHeight)/2); /**//*IE5 IE5.5*/
}
/*图片样式*/
.img_zfb {
    width:100%;
    height:100%;
}
/*签名*/
.autograph {
    padding: 15px;
    background-color: #F0DEC5;
    border-radius: 6px;
    font-family:"Courier New", 微软雅黑, Consolas, Arial, 宋体;
}
.custom_hide {
    display: none;
}
.blogds {
    height:82px;
    line-height:82px;
}
a.btn_donate {
    display: inline-block;
    width: 82px;
    height: 82px;
    background: url("https://files.cnblogs.com/files/yanweidie/btn_reward.gif") no-repeat;
    _background: url("https://files.cnblogs.com/files/yanweidie/btn_reward.gif") no-repeat;
    -webkit-transition: background 0s;
    -moz-transition: background 0s;
    -o-transition: background 0s;
    -ms-transition: background 0s;
    transition: background 0s;
}
a.btn_donate:hover {
    cursor:pointer;
    background-position: 0px -82px;
    background-color:unset !important;
}
.bold {
    font-weight: bold;
}
</style>

我们在设置页面-->页脚Html代码:

<script type="text/javascript">
// 博客签名脚本 //
    function btn_donateClick() {
        var DivPopup = document.getElementById('Div_popup');
        var DivMasklayer = document.getElementById('div_masklayer');
        DivMasklayer.style.display = 'block';
        DivPopup.style.display = 'block';
        var h = Div_popup.clientHeight;
        with (Div_popup.style) {
            marginTop = -h / 2 + 'px';
        }
    }

    function MasklayerClick() {
        var masklayer = document.getElementById('div_masklayer');
        var divImg = document.getElementById("Div_popup"); 
        masklayer.style.display = "none";
        divImg.style.display = "none";
    }

    setTimeout(
        function () {
            document.getElementById('div_masklayer').onclick = MasklayerClick;
            document.getElementById('btn_donate').onclick = btn_donateClick;
            var a_gzw = document.getElementById("guanzhuwo");
            a_gzw.href = "javascript:void(0);";
            $("#guanzhuwo").attr("onclick","follow('20262d02-687d-4752-11ca-08d49c352df3');");
        }, 900);
</script>


<div style="font-size: 18px" width="350" height="300" align="center"><b>&nbsp;&gt;&gt;&gt;转载请注明出处&lt;&lt;&lt;</b></div>

好了,再看看你的每一篇博文的最后,是否已经加上了自己的签名了 ^_^

2、右侧悬飘打赏设置: 

页首Html代码:(这是一个github上的开源项目)自己找找吧

<!-- 打赏插件 -->
<script>
window.tctipConfig = {
        imagePrefix: "https://files.cnblogs.com/files/kdy11/",
        cssPrefix:     "https://files.cnblogs.com/files/kdy11",
        buttonImageId:  4,
        buttonTip:  "dashang",
        list:{
            alipay: {qrimg: "https://files.cnblogs.com/files/mmzs/zfb.bmp"},
            weixin:{qrimg: "https://files.cnblogs.com/files/mmzs/weichat.bmp"},
        }
};
</script>
<script src="https://files.cnblogs.com/files/mmzs/tctip.js"></script>

 


参考出处:https://www.cnblogs.com/mq0036/p/7048716.html

 

posted @ 2018-02-02 12:34  淼淼之森  阅读(1238)  评论(8编辑  收藏  举报
  👉转载请注明出处和署名