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

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

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

طريقة اضافة الازرار لمدونتك

1- من  لوحة التحكم -> قالب -> تحرير HTML 

2- خذ نسخه احتياطيه لـ قالب المدونه قبل إجراء أية تغييرات 

3- قم بالبحث عن الكود التالي بالإستعانة بلوحة التحكم (CTRL+F)

قم بالبحث عن الكود ]]></b:skin> واضف قبله مباشرا الكود التالي

 .sosmed-kananblogger{ background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrgKQygbvUvkvGsTGobOmZFJ_giafU9DgevSen7_NoYN8N1TGIIIEDwN-l-6Cb0MppEz3ZUfPR6QHH95EIyfiNVn3KD4Ua1AsPxPvT4UJ_3pJurTOQUp7qMm6rrNxggFxj2f7qm9DlMKLE/s1600/FB.png');background-repeat:no-repeat;width:43px;height:43px;position:fixed;right:0px;top:160px; z-index:1000;transition:all 300ms ease-in-out;border-radius:100px}
.sosmed-kananbloggerc{ background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjLRcaK5BuyLOrTK2jhvLTlol5ZrVjiEXDFISbfcq9WFJ-qGidxEtkfD8-DqNgpwWqjHOLwJyfoDpBYN6aV_17fIEMrfuBqiCpUlZMywIMJpb5JcqZf82FH51QcK6kLx8XqKDQys-dp5jfS/s1600/FB-open.png');background-repeat:no-repeat;width:150px;height:43px;position:fixed;right:0px;top:160px; z-index:1100;transition:all 300ms ease-in-out}
.sosmed-isiblogger{margin:0px 0 0 43px}
.sosmed-kanantwitter{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhy0mFH7P7v7xgpLrOykgY_ryaXOgoStioyoAiDLJXezCrtwinIY2G0VDELBHh-hqklxaSSmP6q0V1zo3SWMxtIlKOcrnrz3QYNAKX0rwkypQr0P6LgfvpPQYlHRbIOdLWMbNs8W3-XFOb4/s1600/TW.png');background-repeat:no-repeat;width:43px;height:43px;position:fixed;right:0px;top:205px;z-index:1000;transition:all 300ms ease-in-out;border-radius:100px}
.sosmed-kanantwitterc{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg31HLy5QhPhJiWc-6rTXNpG_IbpqourPAX9Kl4hRCyGMxvwyBKsoFP4bHVGC5dTGKuXkW8XL0rbhB9Ayc5vf7E-tLe9d9F5dUnJ6EDw2IdlZfszu5tQR-yVF_hGruI4UK68YodhimAtBl7/s1600/TW-open.png');background-repeat:no-repeat;width:150px;height:43px;position:fixed;right:0px;top:205px; z-index:1100;transition:all 300ms ease-in-out}
.sosmed-isitwitter{margin:0px 0 0 43px}
.sosmed-kananfacebook{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnzgLv02yzO8z8ci3SSctkCGoXBPH4Y6ufOrNxW6yDmUdpqCA6LZlZAgMtF4yb5D9zBcp-A7H1T-Dxnia46fLl8E1ZcxY-0Manbw6X9DgE9VLkmXLGkfju_rJiMliNxt51nvTaYEJSzdBV/s1600/G+.png');background-repeat:no-repeat;width:43px;height:43px;position:fixed;right:0px;top:250px; z-index:1000;transition:all 300ms ease-in-out;border-radius:100px}
.sosmed-kananfacebookc{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgE9LAW8-D_lVRJcgdzpszbHdeU0nLluOFUizXyjLfrQGm7cUl4NQRTUl9KeREaooYMmdfNGOllQ1WYK9XqB6DvKNzGIOgumltPWDai3cRG43FbIs-dAMs8JWGXTybPgi_4KuAUQ-G6uzO4/s1600/G+-open.png');background-repeat:no-repeat;width:150px;height:43px;position:fixed;right:0px;top:250px; z-index:1100;transition:all 300ms ease-in-out}
.sosmed-isifacebook{margin:0px 0 0 43px} 

4- والان قم بالبحث عن الكود </body> واضف قبله الكود التالي

 <div class='sosmed-kananblogger' onmouseout='this.className=&apos;sosmed-kananblogger&apos;' onmouseover='this.className=&apos;sosmed-kananbloggerc&apos;'>
<div class='sosmed-isiblogger'>
<a href='http://t3own.blogspot.com/' target='_blank'>
<img alt='Like us on Facebook' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVMJOHZWTe2jFMe4-eqMDk-1JhCPZu2KrrZv9ihhg1iIT0SR9t9wYViJH_LfnqO-brOfyVYDe21941m6E7k1WzP8v0QUzyC-ksgIZXovA0sx_Hzd0ymo8VcVPXGHIR8cdW9i391q0gDGtS/s1600/FB-open-new.png' title='Like us on Facebook'/></a><br/>
</div>
</div>
<div class='sosmed-kanantwitter' onmouseout='this.className=&apos;sosmed-kanantwitter&apos;' onmouseover='this.className=&apos;sosmed-kanantwitterc&apos;'>
<div class='sosmed-isitwitter'>
<a href='http://t3own.blogspot.com/' target='_blank'><img alt='Follow us on Twitter' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhARLZ3kedxdetz6F3at3uwyThaTBKs6S_2nrWRck99iw6pR9M21yVB0HpNzegqwYm-MxRl-Uo1yel-_yHC_r59j1YNGzBGPzNX8jHfTCfyLbC8XTWNdX07ShdBsqUijIgiHqQFSkJBn2ZQ/s1600/TW-open-new.png' title='Follow us on Twitter'/></a><br/>
</div>
</div>
<div class='sosmed-kananfacebook' onmouseout='this.className=&apos;sosmed-kananfacebook&apos;' onmouseover='this.className=&apos;sosmed-kananfacebookc&apos;'>
<div class='sosmed-isifacebook'>
<a href='http://t3own.blogspot.com/' target='_blank'><img alt='Recommend us on Google Plus' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhlUPjzXsaeQHfwK7hZ3e5g9r5o4yPcC-YbuEmGistRnO2kLfklSArGm3id0vPW9PYYlhDXfc7YuiDxeXO3uF-BDVORaKrwHzKN9AEV_BwFeLqraORK2ujf0QSbN-X2Kn8qDXIycIp6KP9u/s1600/G+-open-new.png' title='Recommend us on Google Plus'/></a>
</div>
</div> 

قم بتغير رابط المدونة http://t3own.blogspot.com/ الى الحسابات والروابط الخاصة بك في المواقع الاجتماعية

واخيراً قم بالضغط على حفظ ومبروك عليك الاضافة

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

دمتم برعاية الله وحفظه

• غرد
• شاركه
• شاركه
• شاركه
• شاركه

azez mohammed

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