آخر الأخبار

الأحد، 27 يوليو 2014

إضافة المواقع الإجتماعية بنمط جديد مترو


زوار ومتابعي مدونة الخبراء للبرامج

أقدم لكم اليوم إضافة جديد طازة من الفرن

مقدمة من مدونة الخبراء للبرامج

الشكل الأول











  • Follow

  • - طريقة تركيب الإضافة :
     1- ادخل إلى مدونتك | واختر تخطيط | ثم إضافة أداة .
     2- اللصق الكود التالي في صندوق الإضافة | ثم إحفظ .

    الكود


      <div class="metro-social metro-height" style="width:350px;">
                    <li class="metro-facebook"><iframe class="fbhover" src="//www.facebook.com/plugins/like.php?href=https%3A%2F%2Fwww.facebook.com%2FChristiaUnion&amp;send=false&amp;layout=box_count&amp;width=450&amp;show_faces=false&amp;font&amp;colorscheme=light&amp;action=like&amp;height=21&amp;appId=408184442589211" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:75px; height:65px;" allowTransparency="true"></iframe></li>
                    <li class="pinterest-one"><div class="pinteresthover"><a data-pin-do="buttonFollow" href="http://pinterest.com/hanna98141">Follow</a><script type="text/javascript">
    (function(d){
      var f = d.getElementsByTagName('SCRIPT')[0], p = d.createElement('SCRIPT');
      p.type = 'text/javascript';
      p.async = true;
      p.src = '//assets.pinterest.com/js/pinit.js';
      f.parentNode.insertBefore(p, f);
    }(document));
    </script></div></li>
                    <li class="metro-googleplus"><div class="googlehover">
    <div class="g-follow" data-annotation="vertical-bubble" data-height="15" data-href="//plus.google.com/111639037193968470844
    " data-rel="publisher"></div></div><script type="text/javascript">
      (function() {
        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></li>
           <li class="metro-linkedin"><a  target="_blank" title="Connect to Linkedin profile" alt="Connect to Linkedin profile" href="http://www.linkedin.com/profile/view?id=111111"></a></li>
                    <li class="twitter-one"><a href="https://twitter.com/hanna98141" class="twitter-follow-button twitterhover" data-show-count="true" data-show-screen-name="false">Follow @digitalhubinc</a><script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script></li>
                    <li><a class="metro-rss" target="_blank" href="http://feedburner.google.com/fb/a/mailverify?uri=expertsprogram/xQVO"></a></li>
                    <li class="youtube-one"><div class="googlehover"><div class="g-ytsubscribe" data-channel="UCTUlr_Ro7-SPYY0LQWsF-6g" data-layout="default"></div></div></li>
     
            </div>
    <style type="text/css">.metro-social {
            padding-top:10px;
            padding-bottom:10px;
            }
    .metro-height-extend {
            height:145px;
            }
    .metro-height {
            height:212px;
            }
    .metro-social li {
            position:relative;
            cursor:pointer;
            list-style:none;
            margin:1px;
            }
    .metro-social .metro-facebook,.metro-twitter,.metro-googleplus,.metro-pinterest,.metro-linkedin,.metro-youtube,.metro-rss,.rss-feed,.googleplus-one,.twitter-one,.linkedin-one,.pinterest-one,.twitter-one-extend,.pinterest-one-extend,.youtube-one,.twitter-extend-one {
            float:left;
            margin:1px;
            position:relative;
            display:block;
            }
    .metro-social .metro-facebook {
        background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjs01dUw6m21ge_Aw7dvQ-OW-akPYo0GuU6oKUAGh31iODZFUA3J9lds2_Ek9m9qowAP0dpk4TPG-Hvnvj3E8hyTQFbLpeiwxMfN901nN0D8S__uJ5FchRY8uRvius8r-5lYSnGfjDTJRk/h120/facebook_128.png) no-repeat center center #1f69b3;
            width:47%;
            height:140px;
            padding:0;
            }
    .metro-social .metro-twitter {
            background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYDW-DwhOgT6139XmfDg2fS62ReSdveOM0t-HC_aAaozQxQqlr50Ni11DW0RElzRG8UfgW72Ql56MZcr1Z4CoBf4mzN-zAzGHg_v8CVwHm8C2vFmuosDufiyru8-ppAEL6w5Ed32zdE9w/h120/twitter_60.png) no-repeat center center #43b3e5;
            width:23%;
            height:69px;
            padding:0;
            }
    .metro-social .metro-googleplus {
            background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_66m6jdHQ9o-zut4EF31ETbLjmW3MN_CGhlPbZZgl1lM8noICuZkGCHzsezGpkKi9jq6Ori3rt4KvjYk0szAWIYkDPnt0MdCY9Jv-4HPwp9P4R0e30jnkGzkhGmqmjMXkrkitgBlsX6U/h120/googleplus_60.png) no-repeat center center #da4a38;
            width:23.3%;
            height:69px;
            padding:0;
            }
    .metro-social .metro-pinterest {
            background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhuHX-hGDmuXOZm9iIGhcnrN06-hpn_x0hSR0u0VnIV8Jpd4Z7LPH85gFa10kMmS3jOTMNnTVoCIPW0mK7a1ynb7V_Y__e4tFRMZ3vgyVQbxl8a9SH8xzCynIVk_gEW4KFrfaVpxj4pvsw/h120/pinterest_60.png) no-repeat center center #d73532;
            width:23.2%;
            height:69px;
            padding:0;
            }
    .metro-social .metro-linkedin {
            background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEic1zknbEIpp1_2BPCdcHbYlncxWxZLFvT5TB8qbHKG4kf7e2XA64HQFtfOgNV-vrzZZJIVdLbMIe_I5qnhIZqcTSfRvYD0o3QGsNExeJIT8WZJvt4606aXdRQy8eY1Rel_i5daXUE1tto/h120/linkedin_60.png) no-repeat center center #0097bd;
            width:23%;
            height:69px;
            padding:0;
            }
    .metro-social .metro-youtube { background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfGgHG1I5QXyeemh7PQECm56Gl8-t9ISISKhKUiD7lQdHJx_NH92S3_peYIvHcCrYJrKL2jkJKdmWSIzNDLVIvn29tfBaRkbGFc38K2Pdgp3bw-iq6Pogq-9r44KiVkDRJ4ahCPrikJTE/h120/youtube_60.png) no-repeat center center #e64a41; width:47%; height:69px; padding:0; }
    .metro-social .metro-rss {
            background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjBTYMIoI2IopCQJ02dLXwaqaB8kokm52ZwTDGYrH6iNHbsAslpFwhFsaSCn6tqYmjpbptfCW9usd8lCMAnnpv7k4WZEmHgGMS1jEzd9666BlvrbRutD7n51Jmid94ze9uouA8wjNdn6I0/h120/rss_60.png) no-repeat center center #e9a01c;
            width:47%;
            height:69px;
            padding:0;
            }
    .metro-social .rss-feed {
            background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjBTYMIoI2IopCQJ02dLXwaqaB8kokm52ZwTDGYrH6iNHbsAslpFwhFsaSCn6tqYmjpbptfCW9usd8lCMAnnpv7k4WZEmHgGMS1jEzd9666BlvrbRutD7n51Jmid94ze9uouA8wjNdn6I0/h120/rss_60.png) no-repeat center center #e9a01c;
            width:95%;
            height:69px;
            padding:0;
            }
    .metro-social .youtube-one { background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfGgHG1I5QXyeemh7PQECm56Gl8-t9ISISKhKUiD7lQdHJx_NH92S3_peYIvHcCrYJrKL2jkJKdmWSIzNDLVIvn29tfBaRkbGFc38K2Pdgp3bw-iq6Pogq-9r44KiVkDRJ4ahCPrikJTE/h120/youtube_60.png) no-repeat center center #e64a41; width:94.4%; height:69px; padding:0; }dding:0; }
    .metro-social .googleplus-one { background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_66m6jdHQ9o-zut4EF31ETbLjmW3MN_CGhlPbZZgl1lM8noICuZkGCHzsezGpkKi9jq6Ori3rt4KvjYk0szAWIYkDPnt0MdCY9Jv-4HPwp9P4R0e30jnkGzkhGmqmjMXkrkitgBlsX6U/h120/googleplus_60.png) no-repeat center center #da4a38; width:47%; height:69px; padding:0; }

    .metro-social .twitter-one {
            background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYDW-DwhOgT6139XmfDg2fS62ReSdveOM0t-HC_aAaozQxQqlr50Ni11DW0RElzRG8UfgW72Ql56MZcr1Z4CoBf4mzN-zAzGHg_v8CVwHm8C2vFmuosDufiyru8-ppAEL6w5Ed32zdE9w/h120/twitter_60.png) no-repeat center center #43b3e5;
            width:47%;
            height:69px;
            padding:0;
            }
    .metro-social .twitter-one-extend {
            background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYDW-DwhOgT6139XmfDg2fS62ReSdveOM0t-HC_aAaozQxQqlr50Ni11DW0RElzRG8UfgW72Ql56MZcr1Z4CoBf4mzN-zAzGHg_v8CVwHm8C2vFmuosDufiyru8-ppAEL6w5Ed32zdE9w/h120/twitter_60.png) no-repeat center center #43b3e5;
            width:47%;
            height:140px;
            padding:0;
            }
    .metro-social .twitter-extend-one {
            background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYDW-DwhOgT6139XmfDg2fS62ReSdveOM0t-HC_aAaozQxQqlr50Ni11DW0RElzRG8UfgW72Ql56MZcr1Z4CoBf4mzN-zAzGHg_v8CVwHm8C2vFmuosDufiyru8-ppAEL6w5Ed32zdE9w/h120/twitter_60.png) no-repeat center center #43b3e5;
            width:95%;
            height:69px;
            padding:0;
            }
    .metro-social .linkedin-one {
            background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEic1zknbEIpp1_2BPCdcHbYlncxWxZLFvT5TB8qbHKG4kf7e2XA64HQFtfOgNV-vrzZZJIVdLbMIe_I5qnhIZqcTSfRvYD0o3QGsNExeJIT8WZJvt4606aXdRQy8eY1Rel_i5daXUE1tto/h120/linkedin_60.png) no-repeat center center #0097bd;
            width:47%;
            height:69px;
            padding:0;
            }
    .metro-social .pinterest-one {
            background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhuHX-hGDmuXOZm9iIGhcnrN06-hpn_x0hSR0u0VnIV8Jpd4Z7LPH85gFa10kMmS3jOTMNnTVoCIPW0mK7a1ynb7V_Y__e4tFRMZ3vgyVQbxl8a9SH8xzCynIVk_gEW4KFrfaVpxj4pvsw/h120/pinterest_60.png) no-repeat center center #d73532;
            width:47%;
            height:69px;
            padding:0;
            }
    .metro-social .pinterest-one-extend {
            background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhuHX-hGDmuXOZm9iIGhcnrN06-hpn_x0hSR0u0VnIV8Jpd4Z7LPH85gFa10kMmS3jOTMNnTVoCIPW0mK7a1ynb7V_Y__e4tFRMZ3vgyVQbxl8a9SH8xzCynIVk_gEW4KFrfaVpxj4pvsw/h120/pinterest_60.png) no-repeat center center #d73532;
            width:95%;
            height:69px;
            padding:0;
            }
    .metro-social li:hover {
            -webkit-opacity: 0.9;
            -moz-opacity: 0.9;
            opacity: 0.9;
            }
    .metro-social .fbhover, .twitterhover, .googlehover, .linkedinhover, .pinteresthover{
            visibility:hidden;
            opacity:0;
            transition:visibility 2.5s linear 0.5s,opacity 0.5s linear;
            }
    .metro-facebook:hover .fbhover{
            opacity:1;
            transition-delay:0s;
            visibility: visible;
            }
    .metro-twitter:hover .twitterhover{
            opacity:1;
            transition-delay:0s;
            visibility: visible;
            }
    .twitter-one-extend:hover .twitterhover{
            opacity:1;
            transition-delay:0s;
            visibility: visible;
            }
    .metro-googleplus:hover .googlehover{
            opacity:1;
            transition-delay:0s;
            visibility: visible;
            }
    .metro-youtube:hover .googlehover{
            opacity:1;
            transition-delay:0s;
            visibility: visible;
            }
    .youtube-one:hover .googlehover{
            opacity:1;
            transition-delay:0s;
            visibility: visible;
            }
    .googleplus-one:hover .googlehover{
            opacity:1;
            transition-delay:0s;
            visibility: visible;
            }
    .twitter-one:hover .twitterhover{
            opacity:1;
            transition-delay:0s;
            visibility: visible;
            }
    .twitter-extend-one:hover .twitterhover{
            opacity:1;
            transition-delay:0s;
            visibility: visible;
            }
    .metro-linkedin:hover .linkedinhover{
            opacity:1;
            transition-delay:0s;
            visibility: visible;
            }
    .linkedin-one:hover .linkedinhover{
            opacity:1;
            transition-delay:0s;
            visibility: visible;
            }
    .metro-pinterest:hover .pinteresthover{
            opacity:1;
            transition-delay:0s;
            visibility: visible;
            }
    .pinterest-one:hover .pinteresthover{
            opacity:1;
            transition-delay:0s;
            visibility: visible;
            }
    .pinterest-one-extend:hover .pinteresthover{
            opacity:1;
            transition-delay:0s;
            visibility: visible;
            }</style>

    3- التعديلات :
    - عدل ماهو باللون الأحمر بخاصيتك على المواقع الإجتماعية .


    " الشكل الثاني  "
    __________



  • Follow
  • - طريقة تركيب الإضافة :

    1- ادخل إلى مدونتك | ثم أختر تخطيط | ثم إضافة أداة .

    2- اللصق الكود التالي في صندوق الإضافة |ثم إحفظ .

    الكود


    <div class="metro-social metro-height" style="width:350px;">
                    <li class="metro-facebook"><iframe class="fbhover" src="//www.facebook.com/plugins/like.php?href=https%3A%2F%2Fwww.facebook.com%2FChristiaUnion&amp;send=false&amp;layout=box_count&amp;width=450&amp;show_faces=false&amp;font&amp;colorscheme=light&amp;action=like&amp;height=21&amp;appId=408184442589211" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:75px; height:65px;" allowTransparency="true"></iframe></li>
                    <li class="pinterest-one"><div class="pinteresthover"><a data-pin-do="buttonFollow" href="http://pinterest.com/hanna98141">Follow</a><script type="text/javascript">
    (function(d){
      var f = d.getElementsByTagName('SCRIPT')[0], p = d.createElement('SCRIPT');
      p.type = 'text/javascript';
      p.async = true;
      p.src = '//assets.pinterest.com/js/pinit.js';
      f.parentNode.insertBefore(p, f);
    }(document));
    </script></div></li>
                    <li class="metro-googleplus"><div class="googlehover">
    <div class="g-follow" data-annotation="vertical-bubble" data-height="15" data-href="//plus.google.com/111639037193968470844" data-rel="publisher"></div></div><script type="text/javascript">
      (function() {
        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></li>
                    <li class="metro-twitter"><a href="https://twitter.com/hanna98141" class="twitter-follow-button twitterhover" data-show-count="false" data-show-screen-name="false">Follow @digitalhubinc</a><script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script></li>
                    <li><a class="metro-rss" target="_blank" href="http://feedburner.google.com/fb/a/mailverify?uri=expertsprogram/xQVO"></a></li>
                    <li class="metro-youtube"><div class="googlehover"><div class="g-ytsubscribe" data-channel="UCTUlr_Ro7-SPYY0LQWsF-6g
    " data-layout="default"></div></div></li>
            </div>
    <style type="text/css">.metro-social {
            padding-top:10px;
            padding-bottom:10px;
            }
    .metro-height-extend {
            height:145px;
            }
    .metro-height {
            height:212px;
            }
    .metro-social li {
            position:relative;
            cursor:pointer;
            list-style:none;
            margin:1px;
            }
    .metro-social .metro-facebook,.metro-twitter,.metro-googleplus,.metro-pinterest,.metro-linkedin,.metro-youtube,.metro-rss,.rss-feed,.googleplus-one,.twitter-one,.linkedin-one,.pinterest-one,.twitter-one-extend,.pinterest-one-extend,.youtube-one,.twitter-extend-one {
            float:left;
            margin:1px;
            position:relative;
            display:block;
            }
    .metro-social .metro-facebook {
        background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjs01dUw6m21ge_Aw7dvQ-OW-akPYo0GuU6oKUAGh31iODZFUA3J9lds2_Ek9m9qowAP0dpk4TPG-Hvnvj3E8hyTQFbLpeiwxMfN901nN0D8S__uJ5FchRY8uRvius8r-5lYSnGfjDTJRk/h120/facebook_128.png) no-repeat center center #1f69b3;
            width:47%;
            height:140px;
            padding:0;
            }
    .metro-social .metro-twitter {
            background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYDW-DwhOgT6139XmfDg2fS62ReSdveOM0t-HC_aAaozQxQqlr50Ni11DW0RElzRG8UfgW72Ql56MZcr1Z4CoBf4mzN-zAzGHg_v8CVwHm8C2vFmuosDufiyru8-ppAEL6w5Ed32zdE9w/h120/twitter_60.png) no-repeat center center #43b3e5;
            width:23%;
            height:69px;
            padding:0;
            }
    .metro-social .metro-googleplus {
            background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_66m6jdHQ9o-zut4EF31ETbLjmW3MN_CGhlPbZZgl1lM8noICuZkGCHzsezGpkKi9jq6Ori3rt4KvjYk0szAWIYkDPnt0MdCY9Jv-4HPwp9P4R0e30jnkGzkhGmqmjMXkrkitgBlsX6U/h120/googleplus_60.png) no-repeat center center #da4a38;
            width:23.3%;
            height:69px;
            padding:0;
            }
    .metro-social .metro-pinterest {
            background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhuHX-hGDmuXOZm9iIGhcnrN06-hpn_x0hSR0u0VnIV8Jpd4Z7LPH85gFa10kMmS3jOTMNnTVoCIPW0mK7a1ynb7V_Y__e4tFRMZ3vgyVQbxl8a9SH8xzCynIVk_gEW4KFrfaVpxj4pvsw/h120/pinterest_60.png) no-repeat center center #d73532;
            width:23.2%;
            height:69px;
            padding:0;
            }
    .metro-social .metro-linkedin {
            background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEic1zknbEIpp1_2BPCdcHbYlncxWxZLFvT5TB8qbHKG4kf7e2XA64HQFtfOgNV-vrzZZJIVdLbMIe_I5qnhIZqcTSfRvYD0o3QGsNExeJIT8WZJvt4606aXdRQy8eY1Rel_i5daXUE1tto/h120/linkedin_60.png) no-repeat center center #0097bd;
            width:23%;
            height:69px;
            padding:0;
            }
    .metro-social .metro-youtube { background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfGgHG1I5QXyeemh7PQECm56Gl8-t9ISISKhKUiD7lQdHJx_NH92S3_peYIvHcCrYJrKL2jkJKdmWSIzNDLVIvn29tfBaRkbGFc38K2Pdgp3bw-iq6Pogq-9r44KiVkDRJ4ahCPrikJTE/h120/youtube_60.png) no-repeat center center #e64a41; width:47%; height:69px; padding:0; }
    .metro-social .metro-rss {
            background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjBTYMIoI2IopCQJ02dLXwaqaB8kokm52ZwTDGYrH6iNHbsAslpFwhFsaSCn6tqYmjpbptfCW9usd8lCMAnnpv7k4WZEmHgGMS1jEzd9666BlvrbRutD7n51Jmid94ze9uouA8wjNdn6I0/h120/rss_60.png) no-repeat center center #e9a01c;
            width:47%;
            height:69px;
            padding:0;
            }
    .metro-social .rss-feed {
            background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjBTYMIoI2IopCQJ02dLXwaqaB8kokm52ZwTDGYrH6iNHbsAslpFwhFsaSCn6tqYmjpbptfCW9usd8lCMAnnpv7k4WZEmHgGMS1jEzd9666BlvrbRutD7n51Jmid94ze9uouA8wjNdn6I0/h120/rss_60.png) no-repeat center center #e9a01c;
            width:95%;
            height:69px;
            padding:0;
            }
    .metro-social .youtube-one { background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfGgHG1I5QXyeemh7PQECm56Gl8-t9ISISKhKUiD7lQdHJx_NH92S3_peYIvHcCrYJrKL2jkJKdmWSIzNDLVIvn29tfBaRkbGFc38K2Pdgp3bw-iq6Pogq-9r44KiVkDRJ4ahCPrikJTE/h120/youtube_60.png) no-repeat center center #e64a41; width:94.4%; height:69px; padding:0; }dding:0; }
    .metro-social .googleplus-one { background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_66m6jdHQ9o-zut4EF31ETbLjmW3MN_CGhlPbZZgl1lM8noICuZkGCHzsezGpkKi9jq6Ori3rt4KvjYk0szAWIYkDPnt0MdCY9Jv-4HPwp9P4R0e30jnkGzkhGmqmjMXkrkitgBlsX6U/h120/googleplus_60.png) no-repeat center center #da4a38; width:47%; height:69px; padding:0; }

    .metro-social .twitter-one {
            background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYDW-DwhOgT6139XmfDg2fS62ReSdveOM0t-HC_aAaozQxQqlr50Ni11DW0RElzRG8UfgW72Ql56MZcr1Z4CoBf4mzN-zAzGHg_v8CVwHm8C2vFmuosDufiyru8-ppAEL6w5Ed32zdE9w/h120/twitter_60.png) no-repeat center center #43b3e5;
            width:47%;
            height:69px;
            padding:0;
            }
    .metro-social .twitter-one-extend {
            background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYDW-DwhOgT6139XmfDg2fS62ReSdveOM0t-HC_aAaozQxQqlr50Ni11DW0RElzRG8UfgW72Ql56MZcr1Z4CoBf4mzN-zAzGHg_v8CVwHm8C2vFmuosDufiyru8-ppAEL6w5Ed32zdE9w/h120/twitter_60.png) no-repeat center center #43b3e5;
            width:47%;
            height:140px;
            padding:0;
            }
    .metro-social .twitter-extend-one {
            background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYDW-DwhOgT6139XmfDg2fS62ReSdveOM0t-HC_aAaozQxQqlr50Ni11DW0RElzRG8UfgW72Ql56MZcr1Z4CoBf4mzN-zAzGHg_v8CVwHm8C2vFmuosDufiyru8-ppAEL6w5Ed32zdE9w/h120/twitter_60.png) no-repeat center center #43b3e5;
            width:95%;
            height:69px;
            padding:0;
            }
    .metro-social .linkedin-one {
            background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEic1zknbEIpp1_2BPCdcHbYlncxWxZLFvT5TB8qbHKG4kf7e2XA64HQFtfOgNV-vrzZZJIVdLbMIe_I5qnhIZqcTSfRvYD0o3QGsNExeJIT8WZJvt4606aXdRQy8eY1Rel_i5daXUE1tto/h120/linkedin_60.png) no-repeat center center #0097bd;
            width:47%;
            height:69px;
            padding:0;
            }
    .metro-social .pinterest-one {
            background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhuHX-hGDmuXOZm9iIGhcnrN06-hpn_x0hSR0u0VnIV8Jpd4Z7LPH85gFa10kMmS3jOTMNnTVoCIPW0mK7a1ynb7V_Y__e4tFRMZ3vgyVQbxl8a9SH8xzCynIVk_gEW4KFrfaVpxj4pvsw/h120/pinterest_60.png) no-repeat center center #d73532;
            width:47%;
            height:69px;
            padding:0;
            }
    .metro-social .pinterest-one-extend {
            background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhuHX-hGDmuXOZm9iIGhcnrN06-hpn_x0hSR0u0VnIV8Jpd4Z7LPH85gFa10kMmS3jOTMNnTVoCIPW0mK7a1ynb7V_Y__e4tFRMZ3vgyVQbxl8a9SH8xzCynIVk_gEW4KFrfaVpxj4pvsw/h120/pinterest_60.png) no-repeat center center #d73532;
            width:95%;
            height:69px;
            padding:0;
            }
    .metro-social li:hover {
            -webkit-opacity: 0.9;
            -moz-opacity: 0.9;
            opacity: 0.9;
            }
    .metro-social .fbhover, .twitterhover, .googlehover, .linkedinhover, .pinteresthover{
            visibility:hidden;
            opacity:0;
            transition:visibility 2.5s linear 0.5s,opacity 0.5s linear;
            }
    .metro-facebook:hover .fbhover{
            opacity:1;
            transition-delay:0s;
            visibility: visible;
            }
    .metro-twitter:hover .twitterhover{
            opacity:1;
            transition-delay:0s;
            visibility: visible;
            }
    .twitter-one-extend:hover .twitterhover{
            opacity:1;
            transition-delay:0s;
            visibility: visible;
            }
    .metro-googleplus:hover .googlehover{
            opacity:1;
            transition-delay:0s;
            visibility: visible;
            }
    .metro-youtube:hover .googlehover{
            opacity:1;
            transition-delay:0s;
            visibility: visible;
            }
    .youtube-one:hover .googlehover{
            opacity:1;
            transition-delay:0s;
            visibility: visible;
            }
    .googleplus-one:hover .googlehover{
            opacity:1;
            transition-delay:0s;
            visibility: visible;
            }
    .twitter-one:hover .twitterhover{
            opacity:1;
            transition-delay:0s;
            visibility: visible;
            }
    .twitter-extend-one:hover .twitterhover{
            opacity:1;
            transition-delay:0s;
            visibility: visible;
            }
    .metro-linkedin:hover .linkedinhover{
            opacity:1;
            transition-delay:0s;
            visibility: visible;
            }
    .linkedin-one:hover .linkedinhover{
            opacity:1;
            transition-delay:0s;
            visibility: visible;
            }
    .metro-pinterest:hover .pinteresthover{
            opacity:1;
            transition-delay:0s;
            visibility: visible;
            }
    .pinterest-one:hover .pinteresthover{
            opacity:1;
            transition-delay:0s;
            visibility: visible;
            }
    .pinterest-one-extend:hover .pinteresthover{
            opacity:1;
            transition-delay:0s;
            visibility: visible;
            }</style>
    - عدل ماهو باللون الأحمر .

    no image
    موضوع المشاركة: إضافة المواقع الإجتماعية بنمط جديد مترو 9 من خلال 10 وعلى أساس 10 تصنيف. 9 تعليقات المستخدمين.
    • تعليقات بلوجر
    • تعليقات الفيس بوك

    0 Comments:

    رسالة تنبيه
      يسعدنا تفاعلكم بالتعليق لكن يرجى مراعاة الشروط التالية لضمان نشر التعليق :
      أن لا تضع أي روابط خارجية
      أي سؤال خارج محتوى التدوينة يرجى استخدام صفحة الدعم الفني
      صفحة الدعم الفني
    • أن يكون التعليق خاص بمحتوى التدوينة إضافة المواقع الإجتماعية بنمط جديد مترو
    • لإضافة كود حوله أولا بمحول الأكواد
    انقرهنا لتحويل الكود

    إرسال تعليق

    Item Reviewed: إضافة المواقع الإجتماعية بنمط جديد مترو Description: إضافة المواقع الإجتماعية بنمط جديد مترو Rating: 5 Reviewed By: home blogger