نقدم لكم اليوم اضافة مميزة لمدونات بلوجروهي اضافة تابعنا علي المواقع الاجتماعية بشكل مميز كما في الصور السابقة
الاضافة تابعة لموقع Mashable
قمنا باضافة لها بعض التعديلات.. الاضافة تشمل جوجل بلس , فيس بوك , تويتر , يوتيوب , الاشتراك عن طريق الايميل
لاضافة الاداة الي مدونتك اضف اداة
HTML / Javascript
بعدها انسخ اليها هذا الكود التالي
ثم قم باستبدال الرابط الذي باللون الاحمر بصفحتك جوجل بلس
والرابط الذي باللون اللبني بصفحتك علي فيس بوك
والرابط الذي باللون الازرق برابط قناتك علي اليوتيوب
والرابط الذي بالون الفوشيا برابط حسابك علي تويتر
واخير الرابط الذي باللون الاخضر برابط حسابك علي feedburner
ثم قم باستبدال الرابط الذي باللون الاحمر بصفحتك جوجل بلس
والرابط الذي باللون اللبني بصفحتك علي فيس بوك
والرابط الذي باللون الازرق برابط قناتك علي اليوتيوب
والرابط الذي بالون الفوشيا برابط حسابك علي تويتر
واخير الرابط الذي باللون الاخضر برابط حسابك علي feedburner
<style type="text/css">
/*<!CDATA[*/
#w2b-mashable{width:285px;margin:0px 0px 0px 0px;padding:0;}
.w2b-googleplus {height:100px; align: center;}
.w2b-facebook {background:#FFFFFF;border: 1px solid #D8E6EB;margin-top: 15px;padding: 5px 0px;height: 40px;}
.w2b-youtube {background:#FFFFFF;border: 0px solid #D8E6EB;height: 105px; align: center;}
.w2b-twitter {background-color: #EEF9FD;border: 1px solid #D8E6EB;border-top: 0;}
.w2b-twitter a.twitter-follow-button {display: block;}
.w2b-twitter iframe {margin: 9px 11px;}
.w2b-emailbox {background-color:#D8E6EB;border: 1px solid #D8E6EB;border-top: 1px solid #eff5f7;padding: 12px 16px;overflow: hidden;}
.w2b-emailbox form{width:100%;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;-ms-box-sizing: border-box;box-sizing: border-box;border: 0;}
.w2b-emailbox input.emailu {float:left;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;-ms-box-sizing: border-box;box-sizing: border-box;border: 0;color: #999;padding: 7px 10px 8px;width: 100%;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;font-size: 13px;}
.w2b-emailbox input.emailu:focus {color: #333;}
.w2b-emailbox input.submitu {-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;color: white;padding: 7px 14px;font-weight: bold;font-size: 12px;float: right;cursor: pointer;}
.w2b-emailbox input.submitu:hover {text-decoration: none;}
.w2bDefault {border: 1px solid #cc7c00;text-shadow: #d08d00 1px 1px 0;background-color: #ff9b00;background: -webkit-gradient(linear,left top,left bottom,color-stop(0,#ffca00),color-stop(1,#ff9b00));background: -webkit-linear-gradient(center top,#ffca00 0,#ff9b00 100%);background: -moz-linear-gradient(center top,#ffca00 0,#ff9b00 100%);background: -o-linear-gradient(center top,#ffca00 0,#ff9b00 100%);background: -ms-linear-gradient(center top,#ffca00 0,#ff9b00 100%);background: linear-gradient(center top,#ffca00 0,#ff9b00 100%);}
.w2bDefault:hover {background-color: #ff9b00;background: -webkit-gradient(linear,left top,left bottom,color-stop(0,#ffe480),color-stop(1,#ff9b00));background: -webkit-linear-gradient(center top,#ffe480 0,#ff9b00 100%);background: -moz-linear-gradient(center top,#ffe480 0,#ff9b00 100%);background: -o-linear-gradient(center top,#ffe480 0,#ff9b00 100%);background: -ms-linear-gradient(center top,#ffe480 0,#ff9b00 100%);background: linear-gradient(center top,#ffe480 0,#ff9b00 100%);}.w2b-moresubs {background: none repeat scroll 0 0 #EBEBEB;border-style: solid;border-width: 1px;border-color: #fff #ccc #ccc;padding: 3px 8px 3px 3px;text-align: right;font-size: 7px;letter-spacing: 1px;}
.w2b-moresubs a {display: inline-block;font-weight: bold;color: #1E598E;text-decoration: none;text-shadow: 1px 1px 1px #fff;}
/*]]>*/
</style>
<div id="btz-mashable">
<div class="w2b-googleplus">
<g:plus href="https://plus.google.com/106165242971518859840" width="283" height="135" theme="light"></g:plus>
</div>
<div id="w2b-mashable">
<div class="w2b-facebook">
<iframe src="//www.facebook.com/plugins/like.php?href=http://www.facebook.com/N4t.s4curity&send=false&layout=standard&width=280&show_faces=true&action=like&colorscheme=light&font=arial&height=80" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:280px; height:33px;" allowtransparency="true"></iframe>
</div>
<div class="w2b-youtube">
<iframe src="http://www.youtube.com/subscribe_widget?p=N4tSecurity"scrolling="no" frameborder="none"style="overflow:hidden; height: 105px; width: 284px; border: none;" scrolling="no" allowtransparency="true"> </iframe></div>
<div class="w2b-twitter">
<a href="https://twitter.com/a7med_3ly" class="twitter-follow-button" data-show-count="true">Follow @a7med_3ly</a>
<script type="text/javascript">/*<![CDATA[*/!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");/*]]>*/</script>
</div>
<div class="w2b-emailbox">
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" onsubmit="window.open('http://feeds.feedburner.com/s3curity', 'popupwindow', 'scrollbars=yes,width=550,height=520'); return true" target="popupwindow">
<table width="100%">
<tr>
<td>
<input class="emailu" name="email" placeholder="ادخل ايميلك هنا لاشتراك معنا"text"/>
</td>
<td width="64px">
<input class="submitu w2bDefault" type="submit" value="اشتراك"/>
</td>
</tr>
</table>
<input name="uri" type="hidden" value="S3curity"/>
<input name="loc" type="hidden" value="en_US"/>
</form>
</div></div></div>
1 التعليقات:
devwebarab.tk
إرسال تعليق