4 طرق مختلفة لى اضافة مواقع اجتماعية بلوجر

اقدم لكم موضوع سرع وهو اضافات اجتماعية

طريقة 1 


مثال حي للاضافه

طريقة 2



مثال حي للاضافه

طريقة 3


مثال حي للاضافه
طريقة 4





مثال حي للاضافه



كالعادة قم بالذهاب إلى تصميم > عناصر الصفحة > إضافة أداة Html/JavaScript





1

كود PHP:

<style>
/* Bloggertrix */ .bubblewrap }
.bubblewrap li{ display:inline; width: 60px; height:60px;
}
.bubblewrap li img
margin-right: 4px; /*spacing between each image*/ -webkit-transition:-webkit-transform 0.1s ease-in; /*http://dz-site.blogspot.com/ */ -o-transition:-o-transform 0.1s ease-in; /*animate transform property in Opera */ }
.bubblewrap li img:hover{
-moz-transform:scale(1.8); /*scale up image 1.8x*/ -webkit-transform:scale(1.8);
-o-transform:scale(1.8);
}</style>

<br />
<center>
<br />
<ul class="bubblewrap">
<li><a href="http://www.plus.google.com/*****"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3cGs3FrCAYaQRcSpr60s_dTb4pENN63GtoOUx39OmPRjMH3qbXv48d9M3OtgbxpHpXWdDOFV-vdsyLTmNKrRZRZ2SKRfboRggF25HD1LXtmBcZGE_phPAdG_csRt5jRh2qxJF0EU8S68/s1600/Google.png" title="تابعنا على google+ " /></a></li>
<li><a href="http://www.facebook.com/*****"><img src="****"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1zAJDPZ8soILE8cLl3eIWJOjGRnFW8jDqg0KL6CH_BNDBN6lzjfQlGvUC_F6dqEpn3EWM3vo3uGQwCny-OMAdzcKSVEi8z8Y9AWKpjQ9kJA7KtlbUtn4h_M72AmOonylUgyFY0M4iOKA/s1600/StumbleUpon.png" title=" Digg تابعنا على" /></a></li>
<li><a href="http://www.twitter/*****"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi6bLhSYIgBhaLjeLU2ISzMKsR1X6oYw28foN6iE2qd8V8QsvmOX_svsAq8pNCND6V8o5Adr2oWn9OfOVbu8mVzdyBnQSleWTDMFmpHg5Y0rG06cacfhzraKUV7whqyinDL_KokK-XwOOc/s1600/Twitter.png" title=" Twitterتابعنا على" /></a></li>

<li><a href="http://feeds2.feedburnertitle="RSS Feed تابعنا على" /></a></li>
</ul>
</center>  

2

كود PHP:











<style>  /*--------dz-site.blogspot.com Sharing Widget ------*/  .touchme a {  disx;  float:left;  background:transparent url(https://dz-site.googlecode.com/files/dz-site%20-me.png) no-repeat;  -webkit-transition: ease-in 0.2s all;    
-moz-transition: ease-in 0.2s all;    
-o-transition: ease-in 0.2s all;    
-ms-transition: ease-in 0.2s all;     transition: ease-in 0.2s all;  cursor:pointer;
}

.touchme a.googleplus {  background-position: 0px -58px;
} 
.touchme a.googleplus:hover {  background-position: 0px 0px; 
}

.took:hover {  background-position: 0px -348px;
}

.touchme a.rss {  background-position: 0px -174px;
} 
.touchme a.rss:hover {  background-position: 0px -116px;
}

</style>

<div class='touchme'>
<!--RSS--> 
<a class='rss' href="ربط تغذية " rel='external nofollow' target='_blank'></a>
<!--Google Plus--> 
<a class='googleplus' href="ربط صفحتك على قوقل بلس" rel='external nofollow' target='_blank'></a>
<!--Facebook--> 
<a class='facebook' href="ربط صفحتك على فيس بوك" rel='external nofollow' target='_blank'></a>
<!-- Twitter --> 
<a class='twitter' href="ربط حسابك توتير" rel='external nofollow' target='_blank' ></a>

</div >  

3

كود:

<div class="metro-social">
<li><a class="fb" href="http://www.facebook.com/ضع اسم الضفحه هنا"></a></li>
<li><a class="tw" href="http://twitter.com/ضع اسم حسابك هنا فقط"></a></li>
<li><a class="gp" href="https://plus.google.com/رابط صفحتك هنا"></a></li>
<li><a class="fd" href="http://feeds.feedburner.com/ضع رابط الخلاصات الاسم فقط"></a></li>
</div>
<style>
/*Metro UI Social Profile Widget v2.0 by Tech Prevue Labs
Web link to gadget code: http://dz-site.blogspot.com/2013/03/blog-post_28.html
Distributed under license CC BY-NC-ND 3.0 INT
Please keep license information intact while using this widget*/
.metro-social{width:285px}
.ative;cursor:pointer;pad

4

كود PHP:



<style> /*--------dz-site.blogspot.com Sharing Widget ------*/ 


/*--------dz-site.blogspot.com Sharing Widget ------*/ 
</style><br>
<div id="lh-social">
<ul>
<li id="fb"><a href="https://www.facebook.com/DZ.SITE" rel="nofollow" target="_blank" style="color: rgb(97, 140, 214);">facebook</a></li>
<li id="twit"><a href="http://twitter.com/ya12ine" rel="nofollow"40, 214);">Twitter</a></li>
<li id="g"><a href="https://plus.google.com/103499777490et="_blank" style="color: rgb(97, 140, 214);">DELICIOUS</a></li> </ul>
</div>  

هشام ابرشى

اسمي هشام : من المملكة المغربية , اهتم بتقنيات الموقع ومواكبة كل ماهو جديد في عالم التقنيه , انقل قالبا ما اراه مفيد ومناسب للزوار , وايضا اطرح المواضيع الحصريه والمفيده للكل بأذن الله ..