إضافة المواقع الأجتماعية بتأثير رائع

بسم الله الرحمن الرحيم في هذه التدوينة سنعمل علي وضع إضافة المواقع الأجتماعية بتأثير رائع بطريقة في غاية السهولة الآن دعوني أريكم طريقة الإضافة للأداة قبل أن أبدأ..

• توجه للوحة التحكم/ثم إلي التخطيط/اختر إضافة أداة/Html/Javascript
• ثم ادخل الكود التالي:

<div id="th3skill-social-hover">
<div class="tota2">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzGHYazDx9koOGwJEUTQbS83Gy5V4lxW7zBABvMdUidLL1M-2Z_nWXq6Y-nRsx2CWs07f8wrkV7Q5byH5jKyNW_8599nZC51QHvT90N_nCPMN4zlJLTnrJzfS3PrTd-3WwNUmQU4PW5OA/s1600/SUB-BAN.png" /></div>
<div id="links">
<a class="twitter" href="http://twitter.com/mybloggerlab" target="_blank" title="Twitter"></a><br />
<div class="tota">
<a class="twitter" href="http://twitter.com/mybloggerlab" target="_blank" title="Twitter"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwXK7xOuC6pxFvBriyy-SFIW_R6dcGrXfQ_H1tk0rdEufRCOmg_otXC5rPN8nZYq4CwWu01B9FlxpukmEsfMrYaiDUyF_cnPXZOXIpHkx2sZgHUHCPw9KgHxfeeUL0QCCcD9CnO9vFxoA/s1600/twitter.png" /></a></div>
<a class="facebook" href="http://www.facebook.com/mybloggerlab" target="_blank" title="Facebook"></a><br />
<div class="tota">
<a class="facebook" href="http://www.facebook.com/mybloggerlab" target="_blank" title="Facebook"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjI1ltSFo3OF-27NlRVdOhORf40xYhqcvpnkVyWBBS09Vz7znORh2uVcpnzPH7NCRy8ItveonhC5iZMm8vmypV_hh1YzeULQ0z02rlNLgKKu8psat2uC9PKkItbA7zfM2K3W292I513bzE/s1600/FB.png" /></a></div>
<a class="facebook" href="http://www.facebook.com/mybloggerlab" target="_blank" title="Facebook">
</a>
<a class="google" href="https://plus.google.com/u/0/106374439082237286396" target="_blank" title="Google Plus"></a><br />
<div class="tota">
<a class="google" href="https://plus.google.com/u/0/106374439082237286396" target="_blank" title="Google Plus"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhszA8KoBxUycVfaJtBQ-3w5w2Ob1e4SCN4bK0eMT22OsokcM6egctrdjDmEVINrj2FYA7vni8R8L7jWaFoa7SsXCiXtYcgKE8DuZ_lHmud0eq9Wy51Jol4f0XBLaYvZWWGyhFUNi7I28U/s1600/google.png" /></a></div>
<a class="google" href="https://plus.google.com/u/0/106374439082237286396" target="_blank" title="Google Plus">
</a>
<a class="pinterest" href="http://pinterest.com/fosterzone/" target="_blank" title="Pinterest"></a><br />
<div class="tota">
<a class="pinterest" href="http://pinterest.com/fosterzone/" target="_blank" title="Pinterest"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhP3oaXyNBH_RDzOOwx9EFBQaG77lUh5GnJ-0a8vzZmVvN85mygYOkmmlYGlunDy294EL5dnv9vtjmFwgCiA8Oh-_-YrBFl2hIELwDe2cGfLXeZyRETmdBJhEB8A3t8p_OuSdku8jYR_yw/s1600/pin.png" /></a></div>
<a class="pinterest" href="http://pinterest.com/fosterzone/" target="_blank" title="Pinterest">
</a>
<a class="rss" href="http://feeds.feedburner.com/mybloggerlab" target="_blank" title="Feedburner"><div class="tota">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjN29nbMecLYMA9Gsy1r5JXMgxI8UNPAi2jYbib73dkhlNxyredAz7YhGDWJsi2HMOCWl-aNQlpYFEjhJGNW91ZK8M3LDWP4tIylg5TZgR5fBnq_EMj6Pvw7XaYzZyPlNw5pV7StPFDf5k/s1600/rss.png" /></div>
</a>
</div>
</div>
<style>.tota2 { margin-left:15px; margin-top:10px;}.tota { margin-top:7px; }#th3skill-social-hover{position:relative;width:240px;height:400px;background:#554e4c url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0W9ZaD_XPENSMk_m58jY5E5tnchcDea8TlkOdZ5uHe4IdlmaK4yYTVg3o4DpbviBum-P6WA25H03iZN9LEQUlZjQYcdAJmYMdqq6GVWMBe-Ip8FP2sC-EmrlzF60cfuatjFOrorYCSNI/s1600/vintage.png");}#th3skill-social-hover #title{font-family:'Open sans';font-size:28px;color:#fff;font-weight:600;margin:30px 20px 0;text-align:center;line-height:1.1em;text-shadow:1px 1px 1px rgba(0,0,0,0.3);}#th3skill-social-hover #title span{display:block;font-size:14px;line-height:1.5em;margin-top:10px;font-weight:400;}#th3skill-social-hover #links{position:absolute;bottom:0;width:100%;}#th3skill-social-hover a{display:block;padding:0 20px;height:42px;line-height:42px;color:#fff;font-size:12px;background:rgba(0,0,0,0.08);border-top:1px solid #4c4644;border-top:1px solid rgba(0,0,0,0.1);-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;}#th3skill-social-hover a:hover{background:rgba(0,0,0,0.15);text-decoration:none;}#th3skill-social-hover a.twitter:hover{background:#79dbff;}#th3skill-social-hover a.facebook:hover{background:#6e9bee;}#th3skill-social-hover a.google:hover{background:#00be00;}#th3skill-social-hover a.pinterest:hover{background:#cb2027;}#th3skill-social-hover a.rss:hover{background:#ffae42;}#th3skill-social-hover a span{height:15px;line-height:15px;width:15px;text-align:center;margin-right:20px;font-size:13px;padding:5px;border-radius:99px;background:rgba(0,0,0,0.1);}#home-tagline{text-align:center;font-size:32px;color:#000;font-weight:300;margin:60px 0 40px;}#home-tagline strong{color:#ff5421;font-weight:300;}#home-highlights{margin-bottom:40px;}.home-highlight{float:left;width:142px;padding:30px 0;margin-right:21px;text-align:center;font-size:13px;display:block;opacity:0.9;color:#796f6c;font-size:40px;background:#e2e0df;background:rgba(0,0,0,0.04);-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;}.home-highlight p{margin:0;}.home-highlight:hover{color:#3a3534;text-decoration:none;background:rgba(0,0,0,0.1);}.home-highlight-title{font-size:13px;margin:7px 0 0;text-align:center;color:#796f6c;cursor:pointer;font-weight:900;-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;}.home-highlight:hover .home-highlight-title{color:#3a3534;}#home-featured{min-height:400px;margin-bottom:37px;}#home-featured .home-divider{margin-top:0;}#home-featured h2{text-align:center;font-size:32px;color:#161414;font-weight:300;margin:0 0 40px;}#home-featured h2:after{display:block;content:"";width:342px;margin:0 auto;height:1px;background:#161414;margin-top:5px;}.featured-theme-entry-content{font-size:16px;float:left;width:430px;font-weight:300;}.featured-theme-entry-content h3{font-size:21px;line-height:1.4em;margin:0;font-weight:400;}.featured-theme-entry-content .button{margin-top:15px;}.featured-theme-entry-content .button:hover{background:#f5634a;opacity:1;}.featured-theme-entry-img{display:block;float:right;margin-right:5px;}.featured-theme-entry-img a{display:block;padding:6px;background:#fff;border-radius:2px;}#featured-theme-slider .flex-control-nav{position:absolute;top:-20px;left:-54px;}#featured-theme-slider .flex-direction-nav{margin:0;}#featured-theme-slider .flex-direction-nav li a{background:#312d2c;cursor:pointer;display:block;height:70px;line-height:70px;width:30px;color:#fff;text-align:center;margin:-30px 0 0;position:absolute;top:50%;-moz-transition:background 0.3s ease-in-out 0s;opacity:0.15;border-radius:4px;}#featured-theme-slider .flex-direction-nav li .flex-prev{left:-90px;}#featured-theme-slider</style></div>

ثم اضغط علي حفظ..إذا واجهتك أي مشكلة يمكنك تركها في التعليقات وسيتم الرد عليك بعدها.