منتديات تقنيات
يسعدنا تسجيلكم بالمنتدى اهلا بكم
لقد نسيت كلمة السر
منتديات تقنيات
1 / 4
تقنيات حصرية
2 / 4
اطلب استايلك مجانا
3 / 4
استايلات تومبلايت جديدة
4 / 4
دروس اشهار الموقع



كود أزرار التواصل الإجتماعي الجانبية احترافي



استعرض الموضوع السابق استعرض الموضوع التالي اذهب الى الأسفل

كود أزرار التواصل الإجتماعي الجانبية احترافي

مُساهمة  في 13/07/16, 12:37 pm

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

أهلا بيكم أعضاء وزوار منتدى تقنيات الكرام

اليوم بقدملك كود رائع لأزوار التواصل الإجتماعي

كود إحترافي يبحث عنه الكثيرون

صورة للكود



الكود يتم تركيبة في العناصر المستقلة

لوحة الإدارة \ عناصر إضافية \ إدارو العناصر المستقلة على المنتدى
أظهار العناصر المستقلة : نعم
وقم بإنشاء عنصر جديد وضعه على يسار المنتدى
وضع بداخله هذا الكود


الرمز:
 <style type="text/css">
/*<![CDATA[*/
@charset "utf-8";
/* CSS Document */
/* ---------- ENTYPO ---------- */
@import url(http://weloveiconfonts.com/api/?family=entypo);
[class*="entypo-"]:before {
 font-family: 'entypo', sans-serif;
}
/* ---------- GENERAL ---------- */
#social-sidebar a { text-decoration: none; }
#social-sidebar ul {
 list-style: none;
 margin: 0;
 padding: 0;
}
/* ---------- Social Sidebar ---------- */
#social-sidebar {
 left: 0;
 margin-top: -75px; /* (li * a:width) / -2 */
 position: fixed;
 top: 50%;
}
#social-sidebar ul li:first-child a { border-radius: 0 5px 0 0; }
#social-sidebar ul li:last-child a { border-radius: 0 0 5px 0; }
#social-sidebar ul li a {
 background: #121212;
 color: #fff;
 display: block;
 height: 50px;
 font-size: 18px;
 line-height: 50px;
 position: relative;
 text-align: center;
 width: 50px;
}
#social-sidebar ul li a:hover span {
 left: 130%;
 opacity: 1;
}
#social-sidebar ul li a span {
 border-radius: 3px;
 line-height: 24px;
 left: -100%;
 margin-top: -16px;
 -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
 filter: alpha(opacity=0);
 opacity: 0;
 padding: 4px 8px;
 position: absolute;
 -webkit-transition: opacity .3s, left .4s;
 -moz-transition: opacity .3s, left .4s;
 -ms-transition: opacity .3s, left .4s;
 -o-transition: opacity .3s, left .4s;
 transition: opacity .3s, left .4s;
 top: 50%;
 z-index: -1;
}
#social-sidebar ul li a span:before {
 content: "";
 display: block;
 height: 8px;
 left: -4px;
 margin-top: -4px;
 position: absolute;
 top: 50%;
 -webkit-transform: rotate(45deg);
 -moz-transform: rotate(45deg);
 -ms-transform: rotate(45deg);
 -o-transform: rotate(45deg);
 transform: rotate(45deg);
 width: 8px;
 z-index: -2;
}
#social-sidebar ul li a[class*="twitter"]:hover,
#social-sidebar ul li a[class*="twitter"] span,
#social-sidebar ul li a[class*="twitter"] span:before { background: #6CDFEA; }
#social-sidebar ul li a[class*="gplus"]:hover,
#social-sidebar ul li a[class*="gplus"] span,
#social-sidebar ul li a[class*="gplus"] span:before { background: #E34429; }
#social-sidebar ul li a[class*="tumblr"]:hover,
#social-sidebar ul li a[class*="tumblr"] span,
#social-sidebar ul li a[class*="tumblr"] span:before { background: #1769ff; }
#social-sidebar ul li a[class*="facebook"]:hover,
#social-sidebar ul li a[class*="facebook"] span,
#social-sidebar ul li a[class*="facebook"] span:before { background: #234999; }
#social-sidebar ul li a[class*="rss"]:hover,
#social-sidebar ul li a[class*="rss"] span,
#social-sidebar ul li a[class*="rss"] span:before { background: #f57b05; }
/*]]>*/</style>
<div id="social-sidebar">
                             
   <ul>
                                  
      <li>
                          <a target="_blank" href="https://twitter.com/
" class="entypo-twitter">      <span>Twitter</span>     </a>                
      </li>
                                  
      <li>
                          <a target="_blank" href="http://plus.google.com/
" class="entypo-gplus">      <span>google+</span>     </a>                
      </li>
                                  
      <li>
                          <a target="_blank" href="http://www.tumblr.net/
" class="entypo-tumblr">      <span>tumblr</span>     </a>                
      </li>
                            
      <li>
                          <a target="_blank" href="https://www.facebook.com/
" class="entypo-facebook">      <span>facebook</span>     </a>                
      </li>
                                      
      <li>
                          <a target="_blank" href="http://feeds.feedburner.com/
" class="entypo-rss">      <span>feedburner</span>     </a>                
      </li>
                                
   </ul>
                             
</div>


قم بالبحث عن :


https://twitter.com/


http://plus.google.com/


http://www.tumblr.net/


https://www.facebook.com/


http://feeds.feedburner.com/

وبدلها بروابطك الخاصة وهكدا يكون قد تم بأذن الله


Ahmedamer
عضو جديد


الجنس : ذكر
عدد المساهمات : 8
التقييم : 12
تاريخ التسجيل : 14/03/2016

معاينة صفحة البيانات الشخصي للعضو

الرجوع الى أعلى الصفحة اذهب الى الأسفل

رد: كود أزرار التواصل الإجتماعي الجانبية احترافي

مُساهمة  في 13/07/16, 12:41 pm

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



JAR7
ادارة المنتدى


الجنس : انثى
عدد المساهمات : 2496
التقييم : 324
تاريخ التسجيل : 05/01/2016
اوسمتي : :10:10:10

معاينة صفحة البيانات الشخصي للعضو https://www.t3qnyiat.com

الرجوع الى أعلى الصفحة اذهب الى الأسفل

رد: كود أزرار التواصل الإجتماعي الجانبية احترافي

مُساهمة  في 13/07/16, 11:31 pm

شكرا لك



وهبة الساحر
القلوب المكسورة كالزجاج المكسور خطرة و مؤذية لا تحتاج للحب بقدر ما تحتاج للوحدة حتى يتم شفاؤها . . !!
     


وهبة الساحر
ادارة المنتدى


الجنس : ذكر
عدد المساهمات : 347
التقييم : 64
تاريخ التسجيل : 07/03/2016
اوسمتي : :10:10:10

معاينة صفحة البيانات الشخصي للعضو

الرجوع الى أعلى الصفحة اذهب الى الأسفل

رد: كود أزرار التواصل الإجتماعي الجانبية احترافي

مُساهمة  في 14/07/16, 03:05 am

يعطيك ربى الف عاااافيه على الطرح المفيد
طرح جميل وممميز
لروحك

البراق
تقني ذهبي

الجنس : ذكر
عدد المساهمات : 161
التقييم : 36
تاريخ التسجيل : 14/04/2016
اوسمتي : :3:4:3

معاينة صفحة البيانات الشخصي للعضو

الرجوع الى أعلى الصفحة اذهب الى الأسفل

رد: كود أزرار التواصل الإجتماعي الجانبية احترافي

مُساهمة  في 19/07/16, 07:36 am

السلام عليكم ورحمة الله وبركاته
ألف شكر لكَ على هذا الموضوع المميز و المعلومات القيمة
إنـجاز أكثر رائــــــع
لكن أرجو منكَ عدم التوقف عند هذا الحد
مـنتظرين ابداعتــــــك
دمتـ ودام تألقـك
تحياتــي

Judy
ادارة المنتدى


الجنس : انثى
عدد المساهمات : 667
التقييم : 24
تاريخ التسجيل : 23/04/2016

معاينة صفحة البيانات الشخصي للعضو

الرجوع الى أعلى الصفحة اذهب الى الأسفل

استعرض الموضوع السابق استعرض الموضوع التالي الرجوع الى أعلى الصفحة

إنشاء حساب أو تسجيل الدخول لتستطيع الرد

تحتاج إلى أن يكون عضوا لتستطيع الرد.

انشئ حساب

يمكنك الانضمام لمنتديات تقنيات فعملية التسجيل سهله !


انشاء حساب جديد

تسجيل الدخول

اذا كنت مسجل معنا فيمكنك الدخول بالضغط هنا


تسجيل الدخول

 
صلاحيات هذا المنتدى:
لاتستطيع الرد على المواضيع في هذا المنتدى