اضافة زر بشكل جميل الى تدوينات بلوجر

السلام عليكم ورحمة الله وبركاته

اقدم لك كود لوضع زر بشكل جميل الى تدوينات بلوجر يمكنك استخدامه لوضع روابط تحميل او مشاهده داخل تدوينتك

التعديل على الكود:

1- استبدل كلمة انقر للمشاهد بالنص المراد عرضه بالصندوق
2-استبدل كلمة الرابط بالرابط المراد الذهاب اليه

الكود:

<a class="a_demo_two" href="الرابط" rel="nofollow" target="_blank"><span style="font-size: large;"><b>انقر للمشاهدة!</b></span></a>
<style>
.a_demo_two {
    background-color:#6fba26;
    padding:10px;
    position:relative;
    font-family: 'Open Sans', sans-serif;
    font-size:12px;
    text-decoration:none;
    color:#fff;
    background-image: linear-gradient(bottom, rgb(100,170,30) 0%, rgb(129,212,51) 100%);
    box-shadow: inset 0px 1px 0px #b2f17f, 0px 6px 0px #3d6f0d;
    border-radius: 5px;
}

.a_demo_two:active {
    top:7px;
    background-image: linear-gradient(bottom, rgb(100,170,30) 100%, rgb(129,212,51) 0%);
    box-shadow: inset 0px 1px 0px #b2f17f, inset 0px -1px 0px #3d6f0d;
    color: #156785;
    text-shadow: 0px 1px 1px rgba(255,255,255,0.3);
    background: rgb(44,160,202);
}
.a_demo_two::before {
    background-color:#072239;
    content:"";
    display:block;
    position:absolute;
    width:100%;
    height:100%;
    padding-left:2px;
    padding-right:2px;
    padding-bottom:4px;
    left:-2px;
    top:5px;
    z-index:-1;
    border-radius: 6px;
    box-shadow: 0px 1px 0px #fff;
}

.a_demo_two:active::before {
    top:-2px;
}
</style>