الجمعة، 18 يوليو 2014

إضافة قائمة منسدلة جانبية للصفحات الإجتماعية

بقلم: BR MED يوم الجمعة، 18 يوليو 2014 القسم : 0 التعليقات
 السلام عليكم ورحمة الله وبركاته
كلنا نعرف أهمية المواقع الإجتماعية في كسب الزوار و المتتابعين ، و رأينا طرق مختلفة لعرض لصفحاتنا الإجتماعية على المدونة قصد الحصول على متتبعين و معجبين , و اليوم معنا طريقة جديدة وحصرية لعرض هذه الصفحات  مع الإقتصاد في مساحة المدونة
هذه الإضافة تكون على الهامش وما يظهر منها هو أيقونة بها إسم الموقع الإجتماعي ولكن عند نمرير الماوس ينبثق صندوق الإعجابات أو المتابعات حسب الموقع كي لا إطيل عليكم ننتقل لشرح التركيب
أولا ندهب للوحة التحكم بلوجر > ثم التخطيط > ثم إضافة آداة
نختار أدآة html java script
ثم نلصق الكود الثالي داخل الإطار و نقوم بالحفظ
<script src="http://code.jquery.com/jquery-latest.js"></script>  <script src="http://apis.google.com/js/plusone.js" type="text/javascript"></script>  <link rel="stylesheet" type="text/css" href="https://dl.dropboxusercontent.com/s/m4krejz6tw6sxlf/3%20in%201%20StyleSheet.css" />  <script src="https://dl.dropboxusercontent.com/s/e5p8j4qnfvgda8p/3%20in%201%20Widget.js"></script>    <div id="on">
<div id="facebook_right" style="top: 12%;">
<div id="facebook_div">
<img alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMlPHb4F-ELXTD_CYbzCawQTAwJ2gvmTdQwMRxrJKgBEu0Hm3fcLkAclHM2Xua2WD9cH71vC05wb4XbbU29C4nbNPT50YY9TgA8S3JTvUUG1VHJ8_yxe-wgeI-BCbHi4Zd8ktR4y9uKJou/s1600/NBTfacebook_right.png" />        <iframe allowtransparency="true" frameborder="0" scrolling="no" src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fmagriblook&width=200&height=346&colorscheme=light&show_faces=true&border_color&stream=false&header=false"        style="border: none; height: 346px; overflow: hidden; width: 200px;"></iframe>      </div>
</div>
</div>
<div id="on">
<div id="twitter_right" style="top: 28%;">
<div id="twitter_div">
<img id="twitter_right_img" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgsMXNvbrLU1k3qzduataxpMn6iQCq9xPSMR-RLPH-i4qaQb6RHRlnf68gGKW0qE1xpaF7x7AcIZejWmvKEVDg_TxBJb4CoNMStGrgSNavAMLyhmtG5hcA2bM2XaWq35daMQC1FsYxRYdce/s1600/NBTtwitter_right.png" />  <div style="width:248px;font-size:8px;text-align:right;">
<script type="text/javascript">  document.write(unescape("%3Cscript src='http://twitterforweb.com/twitterbox.js?username=mohtofbix&settings=0,1,2,248,279,ffffff,0,c4c4c4,101010,1,1,336699' type='text/javascript'%3E%3C/script%3E"));</script><a href="http://add-b.blogspot.com" target="_blank"></a></div>
</div>
</div>
</div>
<div id="on">
<div id="google_plus_right" style="top: 45%;">
<div id="google_plus_div">
<img id=/UTHxwZv6O_I/AAAAAAAAACo/IIkUjVUrtus/s1600/NBTgoogle_plus_right.png" />          <div style="float: left; margin: 10px 10px 10px 0;">
<a href='http://add-b.blogspot.com'>              <img alt='Tips Tricks And Tutorials' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQQ6sm2fSM-M4W8G3PL6slsLSCVueeQnVmZPU6mRGs1Mg7T4M-Xq3zfwKIEmPt5qfjqY7lKWAYOWjUZeOhrQvcuRBmF42WTvQaTHeQ0LB5PjlxqFxZK0e0lbaZfWihdaJ41XawVtLiKH52/s1600/best+blogger+tips.png' />            </a>            <div class="g-plus" data-action="followers" data-height="250" data-href="https://plus.google.com/104753369012716009644" data-source="blogger:blog:followers" data-width="270">
</div>
<script type="text/javascript">            (function () {              window.___gcfg = {                'lang': 'en'              };              var po = document.createElement('script');              po.type = 'text/javascript';              po.async = true;              po.src = 'https://apis.google.com/js/plusone.js';              var s = document.getElementsByTagName('script')[0];              s.parentNode.insertBefore(po, s);            })();            </script>          </div>
</div>
</div>
</div>
غير المعلومات  التي كتبت بالأحمر
صفحتي على الفيس بوك : magriblook
حسابي على تويتر : mohtofbix
حسابي على جوجل بلس : 104753369012716009644
هذا كل شيء إلى موضوع أخر، وفقكم الله

ليست هناك تعليقات:

إرسال تعليق

يسعدنا تفاعلكم بالتعليق , أما لو لديك سؤال خارج الموضوع يرجى استخدام ركن الأسئلة ولإضافة كود قم بتحويله أولابمحول الأكواد , ويمكنك ان تستخدم الإبتسامات بالوقوف عليها لمعرفة الكود
=q =w =s =d =f =g =h =t =y =u =z =x =c =v =b =n =m =a =e =r