كنا قد شرحنا سابقا عن طريقة اضافة صندوق صفحة الفيسبوك وطريقة اضافة قناة اليوتيوب الى المدونة و سنشرح اليوم اضافة مواقع التواصل الاجتماعى الهامة وعند إضافة حساباتك على مواقع التواصل الاجتماعى فإن تلك الإضافة تتيح للزوار متابعة كل جديد عن ما تقدمه .
- شرح طريقة التركيب
من لوحة التخطيط عدد المكان المراد وضع الإضافة فيه ثم اختر HTML/JavaScript وضع فيه هذا الكود مع تغيير ما باللون الأحمر
بالروابط الخاصة بك .
<style>
/* Fanpages mmagdym1 */
#HTML7 { background: #EEF3F6; }
#fanpages{padding: 0; position: relative; text-align: center; list-style: none!important; background: #fafafa; border-radius: 4px!important; box-shadow: inset 0 0 0 1px #e8e8e8;}
#fanpages p{list-style:none;padding:0;margin:0 0 5px}
#fanpages a.a-fans{clear:both;background:#39599a;color:#fff;display:inline-block;font-weight:700;width:100%;max-width:100%;font-size:22px;list-style:none;text-align:center;margin:0 auto;padding:30px 0;border-radius:4px 4px 0 0!important;overflow:hidden;font-family: 'Droid Arabic Naskh',sans-serif;}
#fanpages a.a-fans:hover{background:#292929;color:#fff; text-decoration: none!important;}
#fanpages a.a-fans p{color:#f1d657!important;display:inline-block}
#fanpages a.a-fans:hover p{color:#fff!important}
#fanpages a.a-fans span{font-size:13px;font-weight:normal;text-align:center}
#mmagdym1-fbtw,#mmagdym1-fbtw-msg{margin:0 auto;text-align:center;padding:0 5px 5px;position:relative;line-height:1.3em}
#mmagdym1-fbtw-msg:before{content:"تابعنا عبر المواقع الاجتماعية";font-weight:700;display:table;text-align:center;color:#555;font-size:15px;bottom:0;margin:10px auto}
#mmagdym1-fbtw ul{margin:0 auto;padding:0;text-align:center;margin:0 auto;width:100%}
#mmagdym1-fbtw ul li{display:inline-block;margin:20px 0 0;position:relative}
a.mmagdym1-fbtw-you { float: left; background: #444!important; border: 3px solid #676564!important; }
#mmagdym1-fbtw ul li a{display:inline-block;color:#fff;padding:5px 10px;width:auto;font-weight:700;transition:all .3s}
#mmagdym1-fbtw ul li a.mmagdym1-fbtw-gp{float:left;background: #CE3838;
border: 3px solid #e74c3c;}#mmagdym1-fbtw ul li a.mmagdym1-fbtw-tw{float:right;background: #61BBE6; border: 3px solid #5BB0D8;}
a.mmagdym1-fbtw-you:hover {background:#555!important;border-color:#414344!important}
#mmagdym1-fbtw ul li a:hover,a.mmagdym1-fbtw-you:hover{background:#555;border-color:#414344}
</style>
<div id="fanpages">
<a class="a-fans" href="https://www.facebook.com/almmasweb" rel="nofollow" target="_blank" >صفحتنا على <p>الفيسبوك</p><span>https://fb.com/almmasweb/</span></a>
<div class="clear">
</div>
<div id="mmagdym1-fbtw">
<ul>
<li><a class="mmagdym1-fbtw-tw" href="https://twitter.com/almmasweb" rel="nofollow" target="_blank" >Twitter</a></li>
<li><a class="mmagdym1-fbtw-you" href="https://youtube.com/UCnnn9bYJWMsLF5gY_GOltGw" rel="nofollow" target="_blank" >Youtube</a></li>
</ul></div>
<div id="mmagdym1-fbtw-msg">
</div></div>
/* Fanpages mmagdym1 */
#HTML7 { background: #EEF3F6; }
#fanpages{padding: 0; position: relative; text-align: center; list-style: none!important; background: #fafafa; border-radius: 4px!important; box-shadow: inset 0 0 0 1px #e8e8e8;}
#fanpages p{list-style:none;padding:0;margin:0 0 5px}
#fanpages a.a-fans{clear:both;background:#39599a;color:#fff;display:inline-block;font-weight:700;width:100%;max-width:100%;font-size:22px;list-style:none;text-align:center;margin:0 auto;padding:30px 0;border-radius:4px 4px 0 0!important;overflow:hidden;font-family: 'Droid Arabic Naskh',sans-serif;}
#fanpages a.a-fans:hover{background:#292929;color:#fff; text-decoration: none!important;}
#fanpages a.a-fans p{color:#f1d657!important;display:inline-block}
#fanpages a.a-fans:hover p{color:#fff!important}
#fanpages a.a-fans span{font-size:13px;font-weight:normal;text-align:center}
#mmagdym1-fbtw,#mmagdym1-fbtw-msg{margin:0 auto;text-align:center;padding:0 5px 5px;position:relative;line-height:1.3em}
#mmagdym1-fbtw-msg:before{content:"تابعنا عبر المواقع الاجتماعية";font-weight:700;display:table;text-align:center;color:#555;font-size:15px;bottom:0;margin:10px auto}
#mmagdym1-fbtw ul{margin:0 auto;padding:0;text-align:center;margin:0 auto;width:100%}
#mmagdym1-fbtw ul li{display:inline-block;margin:20px 0 0;position:relative}
a.mmagdym1-fbtw-you { float: left; background: #444!important; border: 3px solid #676564!important; }
#mmagdym1-fbtw ul li a{display:inline-block;color:#fff;padding:5px 10px;width:auto;font-weight:700;transition:all .3s}
#mmagdym1-fbtw ul li a.mmagdym1-fbtw-gp{float:left;background: #CE3838;
border: 3px solid #e74c3c;}#mmagdym1-fbtw ul li a.mmagdym1-fbtw-tw{float:right;background: #61BBE6; border: 3px solid #5BB0D8;}
a.mmagdym1-fbtw-you:hover {background:#555!important;border-color:#414344!important}
#mmagdym1-fbtw ul li a:hover,a.mmagdym1-fbtw-you:hover{background:#555;border-color:#414344}
</style>
<div id="fanpages">
<a class="a-fans" href="https://www.facebook.com/almmasweb" rel="nofollow" target="_blank" >صفحتنا على <p>الفيسبوك</p><span>https://fb.com/almmasweb/</span></a>
<div class="clear">
</div>
<div id="mmagdym1-fbtw">
<ul>
<li><a class="mmagdym1-fbtw-tw" href="https://twitter.com/almmasweb" rel="nofollow" target="_blank" >Twitter</a></li>
<li><a class="mmagdym1-fbtw-you" href="https://youtube.com/UCnnn9bYJWMsLF5gY_GOltGw" rel="nofollow" target="_blank" >Youtube</a></li>
</ul></div>
<div id="mmagdym1-fbtw-msg">
</div></div>