طريقة اضافة ايقونات ايقونات المشاركات الاجتماعية المتحركة بيمين المدونة
السلام عليكم ورحمة الله تعالي وبركاتة
زوار مدونة فرتكة نيوز الكرام
نقد لكم اليوم كود جميل جدا
يمكنك من خلاله وضع ايقونات المشاركات الاجتماعيه ( Face book - Twitter - RSS - الخ ) فى يمين المدونة
وتتحرك معك
صورة للتطبيق
وطريقة عمل ذلك كالتالي
1 - من لوحة البلوجر " نضغط على قالب".
2 - توجه إلى تخطيط .
3 - انقر فوق زر تحرير HTML .
4 - قم بالبحث فى القالب عن ]]></b:skin>.
عن طريق الضغط على ctrl + f ثم ضع الكود المراد البحث عنه فى المربع ثم اضغط enter
5 - ثم قم بلصق الكود التالي قبلها مباشرةً :
mg.hovereffect {
opacity: 0.5;
-webkit-transition: all .3s linear;
-moz-transition: all .3s linear;
-o-transition: all .3s linear;
transition: all .3s linear;
}
img.hovereffect:hover {
opacity: 1;
}
.flt-wdt{
position: fixed;
right: 10px;
top: 43%;
}
.flt-wdt img{
float: right;
clear: right;
margin: 5px;
-webkit-transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
}
.flt-wdt img:hover{
-moz-transform: scale(1.2) rotate(6deg);
-webkit-transform: scale(1.2) rotate(6deg);
-o-transform: scale(1.2) rotate(6deg);
-ms-transform: scale(1.2) rotate(6deg);
transform: scale(1.2) rotate(6deg);
}
opacity: 0.5;
-webkit-transition: all .3s linear;
-moz-transition: all .3s linear;
-o-transition: all .3s linear;
transition: all .3s linear;
}
img.hovereffect:hover {
opacity: 1;
}
.flt-wdt{
position: fixed;
right: 10px;
top: 43%;
}
.flt-wdt img{
float: right;
clear: right;
margin: 5px;
-webkit-transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
}
.flt-wdt img:hover{
-moz-transform: scale(1.2) rotate(6deg);
-webkit-transform: scale(1.2) rotate(6deg);
-o-transform: scale(1.2) rotate(6deg);
-ms-transform: scale(1.2) rotate(6deg);
transform: scale(1.2) rotate(6deg);
}
ثم
6 - قم بالبحث فى القالب مرة اخري عن </body> .
عن طريق الضغط على ctrl + f ثم ضع الكود المراد البحث عنه فى المربع ثم اضغط enter
7 - ثم قم بلصق الكود التالي قبلها مباشرةً :
مع التعديل لما باللون الاحمر
مع التعديل لما باللون الاحمر
<!-- SimpleBloggerTutorials.com -->
<div class='flt-wdt'>
<!-- Facebook -->
<a href='URL' target='_blank' title='صفحتنا على الفيس بوك'><img alt='صفحتنا على الفيس بوك' src='https://lh3.googleusercontent.com/-QaLRred01jw/ToE0l2ruGBI/AAAAAAAACvc/ydfvF-xOi_4/s800/Facebook_creatures.png'/></a>
<!-- Twitter -->
<a href='URL' target='_blank' title='صفحتنا على التويتر'><img alt='صفحتنا على التويتر' src='https://lh3.googleusercontent.com/-HiZe1pm_Rok/ToE0l_3Wl4I/AAAAAAAACvY/ztE85o-w3Lg/s800/Fa_Twitter_creatures.png'/></a>
<!-- RSS -->
<a href='URL' target='_blank' title='RSS'><img alt='RSS' src='https://lh5.googleusercontent.com/-16rpSgs_Rdk/ToE0l6-gnjI/AAAAAAAACvg/pbKahocVGVg/s800/Feed_creatures.png'/></a>
<!-- Example/Delete -->
<a href='URL='احصل على هذا التطبيق'><img alt='احصل على هذا التطبيق' src='URL'/></a>
</div>
<!-- End -->
<div class='flt-wdt'>
<!-- Facebook -->
<a href='URL' target='_blank' title='صفحتنا على الفيس بوك'><img alt='صفحتنا على الفيس بوك' src='https://lh3.googleusercontent.com/-QaLRred01jw/ToE0l2ruGBI/AAAAAAAACvc/ydfvF-xOi_4/s800/Facebook_creatures.png'/></a>
<!-- Twitter -->
<a href='URL' target='_blank' title='صفحتنا على التويتر'><img alt='صفحتنا على التويتر' src='https://lh3.googleusercontent.com/-HiZe1pm_Rok/ToE0l_3Wl4I/AAAAAAAACvY/ztE85o-w3Lg/s800/Fa_Twitter_creatures.png'/></a>
<!-- RSS -->
<a href='URL' target='_blank' title='RSS'><img alt='RSS' src='https://lh5.googleusercontent.com/-16rpSgs_Rdk/ToE0l6-gnjI/AAAAAAAACvg/pbKahocVGVg/s800/Feed_creatures.png'/></a>
<!-- Example/Delete -->
<a href='URL='احصل على هذا التطبيق'><img alt='احصل على هذا التطبيق' src='URL'/></a>
</div>
<!-- End -->
جميل