| Blog-Add |
02-20-2014 02:17 PM |
ازار الشبكات الاجتماعية بالكامل - اضافات بلوجر
السلام عليكم ورحمة الله وبركاته
http://www.arabsharing.com/uploads/1392905449531.png
اقدم لكم اليوم اضافة مرت علينا اكثر من مرة ولكن باكثر من شكل اضافة ازارار الشبكات الاجتماعية
ولكي نوفر جميع الاذواق لجميع الاعضاء بنضع اكثر من شكل لكي تختار ما تحبه
الشرح :
اذهب الي صفحة التخطيط واضافة اداة جديدة HTML واضف بها الكود التالي :
كود PHP:
<style>
.socialv3
{width:220px;
}
.socialv3 li
{
list-style-type:none;
margin:2px 0 0 2px;
width:50px;
height:50px;
-webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
-ms-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
line-height:50px;
overflow:hidden;
text-decoration:none;
text-indent:70px;
font-family: segoe ui, verdana, arial, sans-serif;
}
.socialv3 li a
{
text-decoration:none;
color:#fff;
font-size:20px;
font-weight:bold;
}
.socialv3 li:hover
{
width:200px;
border-radius:0px;
}
#fbv3
{
background:#3B5998 url('https://lh3.googleusercontent.com/-9IvUBEkhoOw/USo4EECi7gI/AAAAAAAAAy0/ulz5SUV5Ag0/s509/Facebook-F-Metro.PNG') no-repeat;
background-size:50px;
}
#gplusv3
{
background:#D64136 url('https://lh3.googleusercontent.com/-qeccth90Mt8/USo4MC9P82I/AAAAAAAAA1Y/NpxDl9-ZNGg/s509/Google%2B-Alt-Metro.PNG') no-repeat;
background-size:50px;
}
#bloggerv3
{
background:#F3923C url('https://lh5.googleusercontent.com/-ZRFwzkMbrwA/USo4MSRfuMI/AAAAAAAAA1k/7ZTSe1G54cU/s509/Google-Blogger-Metro.PNG') no-repeat;
background-size:50px;
}
#linkedinv3
{
background:#006699 url('https://lh5.googleusercontent.com/-1Ag2aROYmmI/USo4Zw67C_I/AAAAAAAAA7Y/0BXhnUP1tR0/s509/Linked-In-Alt-Metro.PNG') no-repeat;
background-size:50px;
}
#myspacev3
{
background:#003298 url('https://lh3.googleusercontent.com/-URchh-56o3U/USo4he1FPZI/AAAAAAAAA-E/UyhfhqLZhPg/s509/Myspace-Logo-Metro.PNG') no-repeat;
background-size:50px;
}
#pandorav3
{
background:#336699 url('https://lh3.googleusercontent.com/-TkNYJcMwI4I/USo4mODiuvI/AAAAAAAAA_4/CFId7zS1VhM/s509/Pandora-Alt-Metro.PNG') no-repeat;
background-size:50px;
}
#rssv3
{
background:#FD9F13 url('https://lh6.googleusercontent.com/-d3UlbXq8Ab8/USo4tmwPiwI/AAAAAAAABCY/HSLBi3lp3KI/s509/Rss-Feed-Metro.PNG') no-repeat;
background-size:50px;
}
#tumblrv3
{
background:#304E6C url('https://lh6.googleusercontent.com/-_ESw8OCHca8/USo41Op9RkI/AAAAAAAABEs/pw8nQuDBSmU/s509/Tumblr-T-Metro.PNG') no-repeat;
background-size:50px;
}
#twitterv3
{
background:#19BFE5 url('https://lh6.googleusercontent.com/-muAYdH7kvnQ/USo426vqBhI/AAAAAAAABFM/b1M3XVKYIso/s509/Twitter-Bird-Metro.PNG') no-repeat;
background-size:50px;
}
#vimeov3
{
background:#86C9EF url('https://lh6.googleusercontent.com/-6Sq9enq26Gw/USo48IRlApI/AAAAAAAABG4/xJQsoDMo2jU/s509/Vimeo-Metro.PNG') no-repeat;
background-size:50px;
}
#stumblev3
{
background:#0572A5 url('https://lh4.googleusercontent.com/-OfI4dWYDud4/USo4ybGCB-I/AAAAAAAABDw/-6ZNtkNOl6w/s509/Stumbleupon-Blue-Metro.PNG') no-repeat;
background-size:50px;
}
#wordpressv3
{
background:#454442 url('https://lh5.googleusercontent.com/-JPa81Nmry04/USo5Bd2nTvI/AAAAAAAABIc/ZWfsfNrJUKk/s509/Wordpress-Logo-Metro.PNG') no-repeat;
background-size:50px;
}
</style>
<div class="socialv3">
<li id="fbv3" title="FB"><a href="[COLOR="blue"]بوك فيس [/COLOR]">facebook</a></li>
<li id="gplusv3" title="Google+"><a href="[COLOR="blue"]بلس جوجل[/COLOR]">Google+</a></li>
<li id="bloggerv3" title="blogger"><a href="[COLOR="blue"]بلوجر[/COLOR]">Blogger</a></li>
<li id="linkedinv3" title="Linkedin"><a href="[COLOR="blue"]Linkedin[/COLOR]">Linkedin</a></li>
<li id="pandorav3" title="Pandora"><a href="[COLOR="blue"]pandora[/COLOR]">Pandora</a></li>
<li id="rssv3" title="RSS"><a href="rss_Account_URL">RSS</a></li>
<li id="myspacev3" title="Myspace"><a href="[COLOR="blue"]myspace[/COLOR]">Myspace</a></li>
<li id="tumblrv3" title="Tumblr"><a href="[COLOR="blue"]تمبلر[/COLOR]">Tumblr</a></li>
<li id="twitterv3" title="twitter"><a href="[COLOR="blue"]تويتر[/COLOR]">Twitter</a></li>
<li id="vimeov3" title="vimeo"><a href="[COLOR="blue"]فيمو[/COLOR]L">Vimeo</a></li>
<li id="stumblev3" title="Stumbleupon"><a href="[COLOR="blue"]Stumbleupon[/COLOR]">stumbleupon</a></li>
<li id="wordpressv3" title="Wordpress"><a href="[COLOR="blue"]Wordpress[/COLOR]">wordpress</a></li>
</div>
<script language='Javascript'>
</script>
قم بتعديل واضف روابط صفحاتك ثم احفظ العمل |
