- fahad
- 3:29 ص
- الشبكات الاجتماعية ، JAVA/HTML
- 2 تعليقات
بسم الله الرحمن الرحيم
السلام عليكم ورحمة الله وبركاته
كود تابع صفحة مدونة البلوجر على الشبكات الأجتماعية ورابط التغذية الخاصة بمدونتك (rss) بشكل جديد ومنسق
الأضافة بدون استخدام css اوحتي الجاف سكربت الكود شكله أنيق ويضيف الجمالية والاحترافية لمدونتك
الازرار تشبه أزرار نظام الويندوز8
الشبكات الأجتماعية المضافة في الكود هي:
الفيسبوك، تويتر، يوتيوب، جوجل بلس، ينكدين، بينتيريست وRSS.
صورة للمعاينة شكل الأضافة
طريقة تركيبها وأضافتها لصفحة الرئيسية لمدونتك البلوجر
سهلة جدا ولاتستغرق الكثير من الوقت
كل ماعليك هو أضافة روابط صفحات مدونتك بشبكات الأجتماعية ورابط تغذية المدونة في الكود التالي
<div class='metro-social'><li><a class="fb" href=ضع هنا رابط صفحة المدونة فيسبوك rel="nofollow"></a></li><li><a class="tw" href=رابط المدونة بتويتر></a></li><li><a class="gp" href="رابط المدونة قوقل بلس"></a></li><li><a class="pi" href=رابط المدونة بينترست ="nofollow"></a></li><li><a class="in" href=رابط المدونة لينكد="nofollow"></a></li><li><a class="yt" href=رابط المدونة يوتيوب></a></li><li><a class="fd" href=رابط التغذية للمدونة="nofollow"></a></li></div><style>.metro-social{width:285px}.metro-social li{position:relative;cursor:pointer;padding:0;list-style:none}.metro-social .fb,.tw,.gp,.pi,.in,.yt,.fd{z-index:7;float:left;margin:1px;position:relative;display:block}.metro-social .fb{background:url(//goo.gl/6xmUk) no-repeat center center #1f69b3;width:140px;height:141px}.metro-social .tw{background:url(//goo.gl/oyiFK) no-repeat center center #43b3e5;width:68px;height:70px}.metro-social .gp{width:69px;height:70px;background:url(//goo.gl/oT0kF) no-repeat center center #da4a38}.metro-social .pi{background:url(//goo.gl/7olxx) no-repeat center center #d73532;width:68px;height:69px}.metro-social .in{background:url(//goo.gl/PhFhj) no-repeat center center #0097bd;width:69px;height:69px}.metro-social .yt{background:url(//goo.gl/zcwjB) no-repeat center center #e64a41;width:140px;height:69px}.metro-social .fd{background:url(//goo.gl/lhBP1) no-repeat center center #e9a01c;width:140px;height:69px}.metro-social li:hover .fb{background:url(//goo.gl/MH8AP) no-repeat center center #1f69b3}.metro-social li:hover .tw{background:url(//goo.gl/hHRHv) no-repeat center center #43b3e5}.metro-social li:hover .gp{background:url(//goo.gl/wva4B) no-repeat center center #da4a38}.metro-social li:hover .pi{background:url(//goo.gl/IORvy) no-repeat center center #d73532}.metro-social li:hover .in{background:url(//goo.gl/2zHrm) no-repeat center center #0097bd}.metro-social li:hover .yt{background:url(//goo.gl/I1c4a) no-repeat center center #e64a41}.metro-social li:hover .fd{background:url(//goo.gl/CjzDP) no-repeat center center #e9a01c}</style>
يعدما تقوم بتعديل على الكود
توجه للوحة التحكم ببلوجر
ثم
تخطـيـط
بعد ذلك
أضافة أداة
وأختار (تهيئة HTML/JavaScript)
وألصق الكود بداخل الصندوق
ثم ضع في المكان الذي تريده في صفحة مدونتك
وأعمل حفظ للقالب
أتمنى أن تنال على أعجابكم ورضاكم
وسلام عليكم ورحمة الله وبركاته
أضافة مميزة تصلح للمواقع html
ردحذفأهلا بك شكرا لمرورك وتعليقك
حذف