الرئيسية / blogger / اضافة ازرار مواقع التواصل الاجتماعي لمدونة بلوجر بشكل رائع احترافي و جداب

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

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

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

 

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

مرحبا بزوار ومتتبعي مدونة الشهادة نقدم لكم اليوم موضوع هو عبارة عن اضافة ازرار مواقع التواصل الاجتماعي لمدونة بلوجر بشكل رائع احترافي و جداب عزيزي المدون وجب عليك الاهتمام بمتابعيك وزارك, وهذه الأمور التي يجب الاهتمام بها بحيث تلبي طلباتهم وتحل مشاكلهم, وجميعنا نحب أن يكون لنا العديد من المتابعين ولجلب متابعين يجب علينا الاهتمام في تسهيل لهم الطرق لمتابعتنا بحيث نعمل لمدوناتنا صفحات في مواقع التواصل الاجتماعي ومحاولة ترويجها إلى زوار مدوناتنا, لذالك نجد أنّ يجب عليك تركيب كود أزرار المشاركة في مدونتك لما لها من تأثير ايجابي في زيادة أعداد متابعين المدونة في مواقع التواصل الاجتماعي, لذالك نقدم لكم كود أيقونات مواقع التواصل الاجتماعي بشكل احترافي ومميز, الإضافة يمكن وضعها على القائمة الجانبية كذالك الإضافة تحتوي على جميع مواقع التواصل الاجتماعي.

ملاحظة: هذه الاضافة تعمل مع جميع المواقع بجميل سكربتاتها ونحن شرحنا تركيبها على بلوجر فقط, لكن  تستطيع تركيبها انت في موقعك وستعمل بدون اي مشاكل. 

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

كود أزرار المشاركة  تتكون من جزئين الجزء الأول هو عبارة عن أيقونات التواصل الاجتماعي html أما الجزء الثاني هو عبارة عن css  كود أزرار المشاركة.

طريقة إضافة إيقونات التواصل الاجتماعي.

طريقة تركيب الإضافة سهل جدا, فقط توجه إلى التخطيط ثم اختار المكان المناسب ثم أضف أداة  HTML/JavaScript وضع الكود التالي داخلها.
<div class=”social-counter”>
<ul id=”social”>
<li class=”item-social facebook count=3.5k;”><a href=”#“>
<i class=”item-icon fa”></i><span class=”item-count”>3.5k</span><span class=”item-text”>اعجاب</span>
</a></li>
<li class=”item-social twitter count=1.7k;”><a href=”#“>
<i class=”item-icon fa”></i><span class=”item-count”>1.7k</span><span class=”item-text”>تابع</span>
</a></li>
<li class=”item-social gplus count=735;”><a href=”#“>
<i class=”item-icon fa”></i><span class=”item-count”>735</span><span class=”item-text”>تابع</span>
</a></li>
<li class=”item-social youtube count=2.8k;”><a href=”#“>
<i class=”item-icon fa”></i><span class=”item-count”>2.8k</span><span class=”item-text”>اشتراك</span>
</a></li>
<li class=”item-social pinterest count=524;”><a href=”#“>
<i class=”item-icon fa”></i><span class=”item-count”>524</span><span class=”item-text”>تابع</span>
</a></li>
<li class=”item-social dribbble count=7.3k;”><a href=”#“>
<i class=”item-icon fa”></i><span class=”item-count”>7.3k</span><span class=”item-text”>تابع</span>
</a></li>
<li class=”item-social instagram count=849;”><a href=”#“>
<i class=”item-icon fa”></i><span class=”item-count”>849</span><span class=”item-text”>تابع</span>
</a></li>
<li class=”item-social rss count=286;”><a href=”#“>
<i class=”item-icon fa”></i><span class=”item-count”>286</span><span class=”item-text”>اشتراك</span>
</a></li>
</ul>
</div>

<style  type=”text/css”>
.social-counter{margin:0;padding:0;overflow:hidden}
.social-counter ul{margin:0;padding:0}
.social-counter ul li{list-style: none;width:42%;float:left;text-align:left;margin:0 0 5px;padding:0 0 5px;position:relative;    position: relative;
border: 1px solid #f5f5f5;
padding: 7px;}
.social-counter ul li:nth-child(2),.social-counter ul li:nth-child(4),.social-counter ul li:nth-child(6),.social-counter ul li:nth-child(8){float:right}
.social-counter ul li a{margin:0;padding:0}
.item-icon{float:left;position:relative;text-align:center;vertical-align:middle;color:#fff;margin:0;display:inline-block;width:32px;height:32px;line-height:32px;font-size:16px;border-radius:2px}
.hide-count{display:none}
.item-count{display:inline-block;color:#333;font-weight:700;font-size:13px;line-height:32px;float:left;padding-left:10px}
.item-text{float:right;display:inline-block;color:#666666;font-size:11px;line-height:32px;font-weight:400}
.item-social.facebook .item-icon{background-color:#5271b3}
.item-social.twitter .item-icon{background-color:#49aff8}
.item-social.gplus .item-icon{background-color:#cb2027}
.item-social.rss .item-icon{background-color:#FFC200}
.item-social.youtube .item-icon{background-color:#eb1a21}
.item-social.dribbble .item-icon{background-color:#ea4c89}
.item-social.instagram .item-icon{background-color:#4E729A}
.item-social.pinterest .item-icon{background-color:#cb2027}
.item-social.facebook .item-icon:before{content:”\f09a”}
.item-social.twitter .item-icon:before{content:”\f099″}
.item-social.gplus .item-icon:before{content:”\f0d5″}
.item-social.rss .item-icon:before{content:”\f09e”}
.item-social.youtube .item-icon:before{content:”\f16a”}
.item-social.instagram .item-icon:before{content:”\f16d”}
.item-social.dribbble .item-icon:before{content:”\f17d”}
.item-social.pinterest .item-icon:before{content:”\f0d2″}
.social-counter ul li:hover .item-icon{background-color:#222222}
.social-counter ul li:hover .item-text{color:#01BD5D}
</style>

التعديلات

# استبدلها برابط صفحة المدونة في موقع التواصل الاجتماعي.

class=”item-count”> استبدل هذه الارقام بعدد بمتابعين صفحاتك </span><span

ملاحظة: في حالة أردّت حذف فئة من مواقع التواصل الاجتماعي أحذفها من بداية <li إلى </li>

اذا لم تظهر الأيقونات قم بوضع رابط الأيقونات في مدونتك
<link href=’//maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css’ rel=’stylesheet’/>

هنا نكون قد انتهينا من تركيب كود ايقونات مواقع التواصل الاجتماعي, في حالة حدثت مشكلة معك يمكن وضعها في تعليك وسنقوم برد عليك في اقرب وقت.

 

لا تنسى الاشتراك في القائمة البريدية اعلاه على اليسار ليصلك كل جديد نقوم بنشره

نسعى دائما لتقديم كل ماهو مفيد لكم فاتمنى ان نكون عند حسن ظنكم جميعا فارجو دعمنا وتشجيعنا على تقديم الافضل بمشاركة الموضوع مع اصدقائكم على مواقع التواصل الاجتماعى فيس بوك تويتر واتساب…. عن طريق ازرار المشاركة اسفل التدوينة مع ترك تعليق داخل صندوق التعليقات , كل الود والاحترام لكم , الى اللقاء فى تدوينة اخرى ان شاء الله من تدوينات مدونة الشهادة .

 

مواضيع مماثلة

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

قوالب بلوجر تحميل قالب Naz لمدزنات بلوجر- blogger 2021

شرح إنشاء مدونة على منصة بلوجر مع نصائح مهمة

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

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

قالب دروس نت الحصري لمدونة بلوجر

اضافة لمدونات بلوجر ردود الفعل مثل ايموجي الفيسبوك اسفل الموضوع

أفضل قوالب بلوجر لعام 2021 قوالب “blogger” جديدة

اضافة فتح جميع الروابط الخارجية في نافدة جديدة لمدونات بلوجر Blogger

اضافة مدونتك بلوجر لمشرفي المواقع Sitemap

تحميل قالب Ravua لمدونات “blogger” بلوجر أنيق و خفيف

قالب Defersite لمدونات بلوجر blogger خفيف و أنيق

طريقة اضافة رابط المصدر لمدونات بلوجر عند نسخ الموضوع

قالب بلوجر “blogger “G Vusion 2 المعرب بمميزات رائعة

اضافة قائمة أفقية ثابتة لمدونتك blogger- اضافات وقوالب بلوجر جديدة

اضافة blogger لزيادة سرعة تحميل مدونتك

أفضل قوالب بلوجر لعام 2021 قوالب “blogger” جديدة

قوالب بلوجر جديدة متعددة الإستعمال-مقال محدث باستمرار

قالب MAGONE لمدونات بلوجر سريع في تحميل الصفحات

قالب Palki Grid لمدونات “blogger” بمميزات رائعة أنيق و جداب

قالب صحيفة sahifa المحول من وورد بريس الى بلوجر

قالب Android app لمدونة بلوجر خفيف و جميل

تحميل قالب TruePixel انيق لمدونات بلوجر خفيف التصفح

قالب جديد ChannelPro لمدونات بلوجر التقنية

قالب بلوجر. قالب مدونة تطبيقات الأندرويد حصريا

قالب بلوجر. قالب مدونة فسحة ثقافية حصريا للتحميل

شاهد أيضاً

اجعل زوارك يشاركون مقالات مدونتك على السوشيال ميديا(فيسبوك - تويتر- جوجل بلس)

اجعل زوارك يشاركون مقالات مدونتك على السوشيال ميديا(فيسبوك – تويتر- جوجل بلس)

اجعل زوارك يشاركون مقالات مدونتك على السوشيال ميديا(فيسبوك – تويتر- جوجل بلس) تريد من زوار …

5 خطوات سهلة للفوز بأكبر عدد زيارات بلوجر

5 خطوات سهلة لنشر مدونتك و كيفية زيادة زيارات بلوجر

كنت تعمل بجد على مدونتك ، تشعر أنك راسخ. حان الوقت الآن أن تكون جادًا …

كيفية عمل نسخة احتياطية من مدونة Blogger الخاصة بك (المحتوى والنماذج والصور )

طريقة أخد نسخة احتياطية لمدونة بلوجر الخاصة بك (المحتوى والنماذج والصور )

أخد نسخة احتياطية لمدونة بلوجر أخد نسخة احتياطية لمدونة بلوجر أخد نسخة احتياطية لمدونة بلوجر …

10 طرق لحماية بلوجر من الهكر blogger

10 طرق لحماية بلوجر من الهكر

نظرًا لأن ووردبريس هي أداة شائعة لإعداد المدونات ، فيمكنها بسهولة جذب انتباه المتسللين. يمكنك …

اترك تعليقاً

لن يتم نشر عنوان بريدك الإلكتروني. الحقول الإلزامية مشار إليها بـ *