إضافة أزرار المشاركة في المواقع الإجتماعية بشكل احترافي لبلوجر

محمد الكناني اضافات بلوجر , بلوجر تعليق

إضافة أزرار المشاركة في المواقع الإجتماعية للمُدونات بلوجر بأشكال إحترافية

طريقة اضافتها الى مدونات البلوجر

نتوجه الى المدونة ، قالب ،
تحرير HTML ، ثم نبحث عن </head>
نضيف الكود التالي فوقه مباشرة .

<style type='text/css'>
#demo1.sharrre {
width: 100%;
display: inline-block;
}
.sharrre .box {
float: left;
}
.sharrre .count {
color: #444444;
display: block;
font-size: 17px;
line-height: 34px;
height: 34px;
padding: 4px 0;
position: relative;
text-align: center;
text-decoration: none;
width: 50px;
background-color: #eee;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
}
.sharrre .share {
color: #FFFFFF;
display: block;
font-size: 11px;
height: 16px;
line-height: 16px;
margin-top: 3px;
padding: 0;
text-align: center;
text-decoration: none;
width: 50px;
background-color: #9CCE39;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
}
.sharrre .buttons {
display: none;
float: left;
width: 300px;
}
.sharrre .button {
float: left;
max-width: 50px;
height: 50px;
margin-left: 10px;
}
</style>
<script src='http://code.jquery.com/jquery-1.10.1.min.js'/>
<script src='http://yourjavascript.com/27299101294/jquery-sharrre-min.js' type='text/javascript'/>
<script src='http://yourjavascript.com/22512901748/jquery-sharrre.js' type='text/javascript'/>

نبحث الآن عن الكود </body>
نضيف الكود التالي فوقه مباشرة .

<script>
$(function(){
$('#demo1').sharrre({
share: {
googlePlus: true,
facebook: true,
<a href='http://www.jqueryscript.net/tags.php?/twitter/'>twitter</a>: true,
delicious: true
},
buttons: {
googlePlus: {size: 'tall'},
facebook: {layout: 'box_count'},
twitter: {count: 'vertical'},
delicious: {size: 'tall'}
},
hover: function(api, options){
$(api.element).find('.buttons').show();
},
hide: function(api, options){
$(api.element).find('.buttons').hide();
}
});
});
</script>