اعلن عن قالبك على كن مدون

إضافة متابعة على المواقع الإجتماعية تجمع كل المواقع

 لاحظت أن بعض الموقع تعتمد على كثير من الخدمات الإجتماعية , يعني لديها صفحة ربما على كل المنصات , لكن لا أرى اضافة كل المنصات في القوائم أو في جزء معين في الموقع تكون دائماً شكلها جيد بالعكس أحيانا تكون سيئة وربما تؤثر على التجاوب

لذلك رأيت أن أصنع لكم هذه الإضافة لتخدم من يواجهون تلك المشكلة


إضافة متابعة على المواقع الإجتماعية تجمع كل المواقع

كود الإضافة يمكنك أن تضعه في آداة أو في صفحة

تعتمد الإضافة على خط الأيقونات Fontawesome فيجب أن يكون مضاف في قالبك

<style>

#follow-cnmu{background-color:#2d4c67;padding:20px;text-align:center;color:#fff;border-radius:4px;margin-bottom:20px;}

#follow-cnmu > strong{font-size:120%;text-shadow:1px 1px #000;margin-bottom:20px;display:block;}

.follow-icons{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(80px,1fr));}

.follow-icons a{color:#fff;display:flex;align-items:center;justify-content:center;gap:5px;flex-direction:column;background-color:rgba(255,255,255,.1);padding:10px!important;border-radius:2px;transition:background-color .4s;}

.follow-icons a:hover{background-color:rgba(0,0,0,.3);}

.follow-icons a i{order:-1;font-size:24px;}

.follow-icons a span {white-space: nowrap;}

/*الوان الأزرار*/

.follow-icons a:nth-child(1):hover {background-color: #3A589B;}

</style>


<div id="follow-cnmu">

<strong>تابعنا على المواقع الإجتماعية</strong>

<div class='follow-icons'>

<!--بداية رابط-->

<a href="#" target="_blank" rel="noopener noreferrer">

<i class="fa-brands fa-facebook-f"></i>

<span>Facebook</span>

</a>

<!--نهاية رابط-->


</div>

</div>

كرر كود الرابط من البداية للنهاية لتحصل على أيقونة جديدة

استبدل رمز # برابط الموقع الإجتماعي

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

استبدل الكلمة الخضراء بإسم الأيقونة

الكود المعلم باللون الوردي هو لون الأيقونة عند تمرير الماوس

كرره مع كل أيقونة تكررها عدل كود اللون فيه وعدل الرقم 1 الى رقم 2 الخ بحسبب عدد الأيقونات لديك أو ازله لتعتمد على لون موحد عند التمرير

معاينة للإضافة


تابعنا على المواقع الإجتماعية

4تعليقات

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

  1. السلام عليكم
    مبارك عليكم الشهر الفضيل مدربنا الغالي🌙
    الله يحفظك ويبارك فيك على كل ما تقوم به 🤲

    ردحذف
    الردود
    1. وعليكم السلام ورحمة الله وبركاته
      حبيبي الغالي أخي منير , كل عام وانت بخير وبصحة وعافية
      تسلم يا غالي رمضان مبارك ❤️

      حذف
  2. شكرا كل عام وانت بخير

    ردحذف