[Blog-Add]

السلام عليكم ورحمة الله وبركاته



اقدم لكم اليوم اضافة مرت علينا اكثر من مرة ولكن باكثر من شكل اضافة ازارار الشبكات الاجتماعية

ولكي نوفر جميع الاذواق لجميع الاعضاء بنضع اكثر من شكل لكي تختار ما تحبه

الشرح :

اذهب الي صفحة التخطيط واضافة اداة جديدة 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> 


قم بتعديل واضف روابط صفحاتك ثم احفظ العمل