حصريا زر شاركه مع أصدقائك

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

نذهب تاى تصميم ثم الى اضافة اداة ثم إضافة اداة جافا سكريبت وقم بلصق هذ الكود :

<style type="text/css">
  #sharedock { position: fixed; bottom: 0; left: 0; width: 100%; height: 90px; z-index: 999; }
  #dock { position: relative; bottom: 0; font: 13px "Trebuchet MS", Verdana, Helvetica, sans-serif; }
  .dock-container { position: relative; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIfg7jwYf92Hhbp0BpZCAorhnJc1Hj46umrUV-Ngc8CXEVvSnrNqLiCwabR9W77vuTgdMI6ZeWUxp69ufqyNK-1H0htuX730LxOLOOmlwJj9Ii1ToVk_UmlU3lIsFMMjxqc2lby2y_FOo/) no-repeat bottom center; height: 50px; padding: 20px 0 20px 0; }
  .dock-container .custom_images a { display: block;  position: absolute; bottom: 0; text-align: center; text-decoration: none; color: #333; cursor: pointer; }
  .dock-container .custom_images span { background: rgba(0,0,0,.75); display: none; padding: 2px 8px; margin-left: 17px; font-size: 11px; color: #fff; -moz-border-radius: 10px; -webkit-border-radius: 10px; }
  .dock-container .custom_images img { border: 0; margin: 5px 0px 10px 0px; width: 100%; }
  </style>

<div id="sharedock">
  <div id="dock">
  <div class="dock-container">

<div class="addthis_toolbox"> 

 <div class="custom_images">

 <a class="addthis_button_facebook"><span>Facebook</span><img src="http://addthis.com/cms-content/images/gallery/aquaticus_facebook.png" alt="Share to Facebook" /></a>
  <a class="addthis_button_twitter"><span>Twitter</span><img src="http://addthis.com/cms-content/images/gallery/aquaticus_twitter.png" alt="Share to Twitter" /></a>
<a class="addthis_button_myspace"><span>MySpace</span><img src="http://addthis.com/cms-content/images/gallery/aquaticus_myspace.png" alt="Share to MySpace" /></a>
<a class="addthis_button_stumbleupon"><span>Stumble</span><img src="http://addthis.com/cms-content/images/gallery/aquaticus_stumbleupon.png" alt="Stumble It" /></a>
<a class="addthis_button_reddit"><span>Reddit</span><img src="http://addthis.com/cms-content/images/gallery/aquaticus_reddit.png" alt="Share to Reddit" /></a>
<a class="addthis_button_delicious"><span>Delicious</span><img src="http://addthis.com/cms-content/images/gallery/aquaticus_delicious.png" alt="Share to Delicious" /></a>
  <a class="addthis_button_more"><span>More...</span><img src="http://addthis.com/cms-content/images/gallery/addthis_64.png" alt="More..." /></a>
  </div>
  </div> 
  </div>
  </div>
  </div>

  <script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js"></script>
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
  <script type="text/javascript" src="http://addthis.com//cms-content/images/gallery/fisheye-iutil.min.js"></script>
  <script type="text/javascript">
  $(function () { 
  // Dock initialize
  $('#dock').Fisheye(
  {
  maxWidth: 30,
  items: 'a',
  itemsText: 'span',
  container: '.dock-container',
  itemWidth: 50,
  proximity: 60,
  alignment : 'left',
  valign: 'bottom',
  halign : 'center'
  }
  );
  });
  </script>