خدمه جميله جدا يا اخى , شكرا
العفو
نايس جدا والله حاجة جميلة جدا يسلمو
خدمة ممتازة من شخص ممتاز جدااااا
خدمة رائع من شخص ممتاز جدا
بعد طول غياب عن التدوين فى مدونة ابداعاتى عدت لكم باضافات جميلة جدا جدا أدعو الـلــه أن تنال على اعجاب جميع متتبعى المدونة الكرام وهى اضافة أداة المشاركة الاجتماعية لمدونات بلوجر بشكل منزلق من جانب المدونة وهذه الاضافة بسيطة جدا ولن تؤثر على منظر مدونتك إلا بالشكل الاحترافى وسلاسة الحركة المنزلقة لها بتقنية الجاكورى وهذا ما سيضفى جانب الجمال والأناقة على مدونتك
مميزات الاضافــــــــــــــــة
(1) خفيفة جدا ولن تؤثر على سرعة المدونة
(2) مفيدة لنشر المدونة على مواقع التواصل الاجتماعى
(3) حركتها الانسيابية ستضفى الجمال على مدونتك
(4) سهلة التركيب على قالب مدونتـــــــــــــــــك
(5) لا تشغل مساحة كبيرة فى مدونتك على خلاف غيرها
ويمكنك لمس كل هذه المميزات من خلال المعاينة المباشرة للاضافة
شرح تركيب الاضافة
اذهب للوحة التحكم >> القالب >> تحرير HTML
الخطوة الأولى
ابحث عن </head>
ضع اسفله مباشرة هذا الكود
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
الخطوة الثانية
اذهب للتخطيط >> اضافة أداة >> HTML/JAVASCRIPT
ضع بها الكــــــــــــــــود المناسب وقم بالحفظ
كود الاضافة لتظهر على يسار المدونة
<script type="text/javascript">
/*<![CDATA[*/
jQuery(document).ready(function () {
jQuery(".hbslidebox").hover(function () {
jQuery(this).stop().animate({
left: "0"
}, "medium");
}, function () {
jQuery(this).stop().animate({
left: "-70"
}, "medium");
}, 500);
});
/*]]>*/
</script>
<style type="text/css">
.hbslidebox {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjuNY2tS8RYVKDo0rpaHV1OdV5AIM0xPaxTWYtVJhkLzwcw7xxZuOrF9v0GlWesTsghIscsGG6XYvdDzk9kNTitRSWniqi9t7btQyGkpTIubORO5cRLgbwJCxFhr9cUzoC8TaamPaWJ4m8/s102/share-left.png") no-repeat scroll right top transparent !important;
display: block;
float: left;
height: auto;
padding: 0 45px 0 0px;
width: 65px;
height:102px;
z-index: 99999;
position:fixed;
left:-70px;
top:20%;
}
.hbslidebox div {
border:none;
position:relative;
display:block;
}
#floatingbuttons {
background: #fff;
border-radius: 5px 5px 5px 5px;
border: 1px solid #CCCCCC;
float:left;
padding:0 0 3px 0;
bottom:15%;
z-index:399;
}
#floatingbuttons .floatbutton {
float:left;
clear:both;
margin:5px 4px 0 4px;
}
.addbuttons {
clear:both;
text-align:center;
padding-top:5px;
}
.addbuttons a span.getfloat, .addbuttons a span.sharebuttons {
color:#000;
background:none;
font-family:arial, sans-serif;
display:block;
font-size:9px;
font-weight:bold;
text-decoration:none;
line-height:11px;
}
.addbuttons a:hover span {
color:#0502CD;
background:none;
text-decoration:underline;
}
</style>
<div class="hbslidebox" style="">
<div>
<div id='floatingbuttons' title="Share this post!">
<script src="http://connect.facebook.net/en_US/all.js#xfbml=1">
</script>
<script src='http://apis.google.com/js/plusone.js' type='text/javascript'> {lang: 'en-US'} </script>
<!-------------- Medium Button ------------->
<script src='http://platform.twitter.com/widgets.js' type="text/javascript"></script>
<div class='floatbutton' id='facebook'> <fb:like layout="box_count" show_faces="false" font=""></fb:like>
</div>
<div class='floatbutton' id='google+1'> <g:plusone size="tall"></g:plusone>
</div>
<div class='floatbutton' id='twitter'> <a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical">Tweet</a>
</div>
<div class="addbuttons"> <a href="http://myebd3at.blogspot.com/"target="_blank" title="أضف هذه الآداة الى مدونتك!"><span class="getfloat">كود الإضافة</span></a>
</div>
</div>
</div>
</div>
كود الاضافة لتظهر على يمين المدونـــــــــة
<script type="text/javascript">
/*<![CDATA[*/
jQuery(document).ready(function () {
jQuery(".hbslidebox").hover(function () {
jQuery(this).stop().animate({
right: "0"
}, "medium");
}, function () {
jQuery(this).stop().animate({
right: "-70"
}, "medium");
}, 500);
});
/*]]>*/
</script>
<style type="text/css">
.hbslidebox {
background: url("https://lh3.googleusercontent.com/-KgklF6q4Bxg/UQOnO6tIrOI/AAAAAAAAAW8/OqtCfwr9c5w/s102/share-right.png") no-repeat scroll left top transparent !important;
display: block;
float: right;
height: auto;
padding: 0 0px 0 45px;
width: 65px;
height:102px;
z-index: 99999;
position:fixed;
right:-70px;
top:20%;
}
.hbslidebox div {
border:none;
position:relative;
display:block;
}
#floatingbuttons {
background: #fff;
border-radius: 5px 5px 5px 5px;
border: 1px solid #CCCCCC;
float:right;
padding:0 0 3px 0;
bottom:15%;
z-index:399;
}
#floatingbuttons .floatbutton {
float:right;
clear:both;
margin:5px 4px 0 4px;
}
.addbuttons {
clear:both;
text-align:center;
padding-top:5px;
}
.addbuttons a span.getfloat, .addbuttons a span.sharebuttons {
color:#000;
background:none;
font-family:arial, sans-serif;
display:block;
font-size:9px;
font-weight:bold;
text-decoration:none;
line-height:11px;
}
.addbuttons a:hover span {
color:#0502CD;
background:none;
text-decoration:underline;
}
</style>
<div class="hbslidebox" style="">
<div>
<div id='floatingbuttons' title="Share this post!">
<script src="http://connect.facebook.net/en_US/all.js#xfbml=1">
</script>
<script src='http://apis.google.com/js/plusone.js' type='text/javascript'> {lang: 'en-US'} </script>
<!-- Medium Button -->
<script src='http://platform.twitter.com/widgets.js' type="text/javascript"></script>
<div class='floatbutton' id='facebook'>
<fb:like layout="box_count" show_faces="false" font=""></fb:like>
</div>
<div class='floatbutton' id='google+1'>
<g:plusone size="tall"></g:plusone>
</div>
<div class='floatbutton' id='twitter'>
<a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical">Tweet</a>
</div>
<div class="addbuttons">
<a href="http://myebd3at.blogspot.com/"target="_blank" title="أضف هذه الآداة الى مدونتك!"><span class="getfloat">كود الإضافة</span></a>
</div>
</div>
</div>
</div>
تم الموضوع بحمد اللــــه
√ فى انتظار تعليقات مشجعة على تقديم المزيد من مدونة ابداعاتى √
0 تعليقات 