إضافة المواقع الإجتماعية لمدونات بلوجر بتأثير جديد وحصري

الآن : كيفية تركيب الأداة في المدونة 

<!-- Don't Change The Code -->

<!-- Social Icons by Mohammad Khader -->

<style>

.memo-socials {

  width:230px;

  margin: 5px;

  padding: 0px;

  overflow: hidden;

    list-style: none outside none;   

}

.memo-socials a {

display: block;

margin: 0px 10px 0px 0px;

color: #FFF;

animation-duration: 2s;

animation-fill-mode: both;   

}

.memo-socials li {

list-style:none outside none;

    width: 39px;

height: 35px;

display: inline-block;

font-size: 26px;

float: left;

padding:8px 0px 0px 4px;

margin: 0px 0px 0px 1px;

transition: all 0.4s ease-in-out 0s;

}

.memo-socials li:hover {

transition: all 0.4s ease-in-out 0s;

}

#fb {

    background:url(http://goo.gl/y16yje) center center #000;

border-radius: 20px 5px;

    }

    #tw {

    background:url(http://goo.gl/6P5H0x) center center #000;

border-radius: 20px 5px;

    }

    #rss {

    background:url(http://goo.gl/oyfMfa) center center #000;

border-radius: 5px 20px;

    }

    #pg {

    background:url(http://goo.gl/eWMHFa) center center #000;

border-radius:4px;

    }

    #ut {

    background:url(http://goo.gl/RRMUAh)center center #000;

border-radius: 5px 20px;

}

#fb:hover {

    background:url(http://goo.gl/BeyC2j) center center #3B5998;

    transform:rotate(-360deg);

border-radius: 5px 20px;

    }

    #tw:hover {

background:url(http://goo.gl/CX0uoA) center center #00a0d1;

    transform:rotate(-360deg);

border-radius: 5px 20px;

    }

    #rss:hover {

 background:url(http://goo.gl/4olTZw) center center #f70;

    transform:rotate(360deg);

border-radius: 20px 5px;

    }

    #pg:hover {

background:url(http://goo.gl/D9btiG) center center #000;

    border-radius:50px;

transform:rotate(360deg);

    }

    #ut:hover {

background:url(http://goo.gl/YjYb6K) center center #C4302B;

    transform:rotate(360deg);

border-radius: 20px 5px;

}

.social {

  background: none;

  margin: 0 auto;

  width: 231px;

text-align: center;

}

</style>

<center>

<div class="social">

<ul class="memo-socials">

<a href="#facebook"><li id="fb"></li></a>

<a href="#twitter"><li id="tw"></li></a>

<a href="#plus-google"><li id="pg"></li></a>

<a href="#rss"><li id="rss"></li></a>

<a href="#youtube"><li id="ut"></li></a>

</ul>

</div>

</center>

<!-- Don't Change The Code -->

أمور لابد من تعديلها

و أخيراً وليس آخراً إضغط حفظ والف مبرووووك عليك الإضافة . 

رجاءاً جداً بعدم حذف حقوق التصميم ليحفظك الله