السلام عليكم اعزائى متابعى مدونة برو ويب اليوم نقدم لكم اضافة تابعنا عبر المواقع الإجتماعية هذه الاضافة مميزة بانها لها شكل مميز مع اشهر المواقع الاجتماعية , لها الوان احترافية وتتميز بشكلها الانيق , هذه الاضافه تستعملها اشهر المواقع والمدونات نظرا لجمالها والوانها الاحترافية , كي لا اطيل عليكم , سوف نتوجة الى طريقة التركيب .
شرح طريقة التركيب
اذهب الى التخطيط > ثم اضافة اداة html/javascript
وضع فيها الكود التالي
اذهب الى التخطيط > ثم اضافة اداة html/javascript
وضع فيها الكود التالي
الكود
<div id="facetwittplus"><div class="socialDabourPhoneWidget" id="socialDabourPhoneWidget"><a class="facebook-box" href="https://www.facebook.com/Pro7web" id="sc-facebook" target="_blank"><span class="fa fa-facebook"></span><span class="title">تابعنا على الفيس بوك</span><span class="count">لتصلك أخر التحديثات على الفيس بوك</span> </a></div><div class="socialDabourPhoneWidget" id="socialDabourPhoneWidget"><a class="twitter-box" href="https://twitter.com/karimalielsayed" id="sc-twitter" target="_blank"><span class="fa fa-twitter"></span><span class="title">تابعنا على تويتر</span><span class="count">لتصلك أخر التحديثات على تويتر</span></a></div><div class="socialDabourPhoneWidget" id="socialDabourPhoneWidget"><a class="googleplus-box" href="https://plus.google.com/u/0/100567905522377932767" id="sc-googleplus" target="_blank"><span class="fa fa-google"></span><span class="title">تابعنا على جوجل بلس</span><span class="count">لتصلك أخر التحديثات على جوجل بلس</span></a></div></div><style>#socialDabourPhoneWidget span.fa {width: 47px;height: 47px;color:white;vertical-align: top;padding: 10px;font-size: 26px;right: 0;text-align: center;background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwLjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMSUiIHN0b3AtY29sb3I9IiNmZmZmZmYiIHN0b3Atb3BhY2l0eT0iMC4xIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZmZmZmYiIHN0b3Atb3BhY2l0eT0iMC4xIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);background: -moz-linear-gradient(top, rgba(255,255,255,0.1) 0%, rgba(255,255,255,0.1) 1%, rgba(255,255,255,0.1) 100%);background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0.1)), color-stop(1%,rgba(255,255,255,0.1)), color-stop(100%,rgba(255,255,255,0.1)));background: -webkit-linear-gradient(top, rgba(255,255,255,0.1) 0%,rgba(255,255,255,0.1) 1%,rgba(255,255,255,0.1) 100%);background: -o-linear-gradient(top, rgba(255,255,255,0.1) 0%,rgba(255,255,255,0.1) 1%,rgba(255,255,255,0.1) 100%);background: -ms-linear-gradient(top, rgba(255,255,255,0.1) 0%,rgba(255,255,255,0.1) 1%,rgba(255,255,255,0.1) 100%);background: linear-gradient(to bottom, rgba(255,255,255,0.1) 0%,rgba(255,255,255,0.1) 1%,rgba(255,255,255,0.1) 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1affffff', endColorstr='#1affffff',GradientType=0 );}#socialDabourPhoneWidget > a {display: block;width: 100%;height: 47px;position: relative;cursor: pointer;}a.facebook-box {background-color: #506ba7;}a.twitter-box {background-color: #56A4C6;}a.googleplus-box {background-color: #BC4B37;}#socialDabourPhoneWidget > a.facebook-box:hover {box-shadow:inset 0px 0px 80px 44px #25448A;}#socialDabourPhoneWidget > a.twitter-box:hover {box-shadow:inset 0px 0px 80px 44px #25779A;}#socialDabourPhoneWidget > a.googleplus-box:hover {box-shadow:inset 0px 0px 80px 44px #963F30;}#socialDabourPhoneWidget span {display: block;position: absolute;color: #FFFFFF;right: 70px;font-size: 12px;}#socialDabourPhoneWidget .title {top: 3px;}#socialDabourPhoneWidget .count {top: 20px;}.author-social {margin-top: -8px;margin-left: -7px;}</style
>
> غير المحدد باللون # برابط صفحتك على الفيسبوك
> غير المحدد باللون # برابط حسابك على تويتر
> غير المحدد باللون # برابط حسابك على جوجل بلس
لا تنسا ان تكن من أعضاء المدونة من هنا , إذا واجهتك اي مشكلة لا تترد فى ترك تعليق