إضافة أداة الشبكات الإجتماعية V4


السلام عليكم اعزائى متابعى دبور فون اليوم نقدم لكم الإصدار الرابع من ايقونات الشبكات الاجتماعية هذه المرة كما عودناكم الاضافة مميزة بانها لها شكل مميز مع اشهر المواقع الاجتماعية الاضافة من تطويرى لمعاينة الإضافة أنظر العمود الجانبى فى مدونتنا  . 


طريقة التركيب:
  1. نتوجه إلى التخطيط
  2. ثم اختيار أداة HTML/JavaScript
  3. ثم قم بوضع هذا الكود

<style>
.social-block {
background-color: #eee;
color: #fff;
text-align: center;
margin-bottom: 5px;
position: relative;
margin-right: 4px;
text-shadow: 1px 1px #000;
}
.social-block .social-title {
padding: 10px 0;
position: relative;
font-size: 120%;
}
.social-block .social-title:after {
content: "";
position: absolute;
left: -5px;
width: 5px;
top: 0;
height: 100%;
}
.social-block .social-title:before {
content: "";
position: absolute;
right: -5px;
width: 5px;
top: 0;
height: 100%;
}
.social-block .social-title i {
}
.social-block p {
padding: 5px;
margin: 0;
text-align: center;
color: white;
}
.social-block .social-message {
}
.social-block span {
}
/* Facebook style */
.facebook.social-block, .facebook.social-block:before {
background-color: #366299;
}
.facebook .social-title, .facebook.social-block .social-title:before {
background: #3b5999;
}
.facebook .social-title, .facebook.social-block .social-title:after {
background-color: #3b5999;
}
/* Twitter style */
.twitter .social-title, .twitter.social-block .social-title:before {
background: #1C80F1;
}
.twitter.social-block, .twitter.social-block:before {
background-color: #4099FF;
}
.twitter .social-title, .twitter.social-block .social-title:after {
background-color: #1C80F1;
}
.twitter .social-message, .twitter {
color: #FFFFFF;
text-shadow: none;
}
/* Youtube style */
.youtube .social-title, .youtube.social-block .social-title:before {
background: #C00020;
}
.youtube.social-block, .youtube.social-block:before {
background-color: #D1252A;
}
.youtube .social-title, .youtube.social-block .social-title:after {
background-color: #c00020;
}
</style>
<div class="left-side">
<div class="facebook social-block">
<div class="social-title">
<i class="fa fa-facebook fa-4x"></i>
</div>
<p>صفحة الموقع على الفيسبوك</p>

<span style="display:inline-block; padding:5px 0"><div class="fb-like fb_iframe_widget" data-href="https://www.facebook.com/dabourphone" data-layout="button_count" data-action="like" data-show-faces="false" data-share="false" fb-xfbml-state="rendered" fb-iframe-plugin-query="action=like&amp;app_id=&amp;container_width=0&amp;href=https%3A%2F%2Fwww.facebook.com%2Fth9procom&amp;layout=button_count&amp;locale=en_US&amp;sdk=joey&amp;share=false&amp;show_faces=false"><span style="vertical-align: bottom; width: 85px; height: 20px;"><iframe name="f3a34a631d52a04" width="1000px" height="1000px" frameborder="0" allowtransparency="true" allowfullscreen="true" scrolling="no" title="fb:like Facebook Social Plugin" src="https://www.facebook.com/plugins/like.php?action=like&amp;app_id=&amp;channel=https%3A%2F%2Fstaticxx.facebook.com%2Fconnect%2Fxd_arbiter.php%3Fversion%3D42%23cb%3Df307da00b79f3b4%26domain%3D9alibmoussa.blogspot.com%26origin%3Dhttps%253A%252F%252F9alibmoussa.blogspot.com%252Ff30203408ee8dac%26relation%3Dparent.parent&amp;container_width=0&amp;href=https%3A%2F%2Fwww.facebook.com%2Fdabourphone&amp;layout=button_count&amp;locale=en_US&amp;sdk=joey&amp;share=false&amp;show_faces=false" style="border: none; visibility: visible; width: 85px; height: 20px;" class=""></iframe></span></div>
</span></div>
</div>

<div class="youtube social-block">
<div class="social-title">
<i class="fa fa-youtube fa-4x"></i>
</div>
<p>قناة الموقع على اليوتوب</p>

<span style="display:inline-block; padding:5px 0">
<script src="https://apis.google.com/js/platform.js" gapi_processed="true"></script>

<script>
function onYtEvent(payload) {
if (payload.eventType == 'subscribe') {
// Add code to handle subscribe event.
} else if (payload.eventType == 'unsubscribe') {
// Add code to handle unsubscribe event.
}
if (window.console) { // for debugging only
window.console.log('YT event: ', payload);
}
}
</script>

<div id="___ytsubscribe_0" style="text-indent: 0px; margin: 0px; padding: 0px; border-style: none; float: none; line-height: normal; font-size: 1px; vertical-align: baseline; display: inline-block; width: 116px; height: 24px; background: transparent;"><iframe frameborder="0" hspace="0" marginheight="0" marginwidth="0" scrolling="no" style="position: static; top: 0px; width: 116px; margin: 0px; border-style: none; left: 0px; visibility: visible; height: 24px;" tabindex="0" vspace="0" width="100%" id="I0_1465850972222" name="I0_1465850972222" src="https://www.youtube.com/subscribe_embed?usegapi=1&channelid=UCjp5mGQezqj99HX7p7Tt3Tw;layout=default&count=default&hl=ar&origin=https%3A%2F%2F9alibmoussa.blogspot.com&gsrc=3p&ic=1&jsh=m%3B%2F_%2Fscs%2Fapps-static%2F_%2Fjs%2Fk%3Doz.gapi.ar.e-arUGrv6ck.O%2Fm%3D__features__%2Fam%3DAQ%2Frt%3Dj%2Fd%3D1%2Frs%3DAGLTcCPbW19kOMG9UmDLVPVZK65Sq4ZU_A#_methods=onPlusOne%2C_ready%2C_close%2C_open%2C_resizeMe%2C_renderstart%2Concircled%2Cdrefresh%2Cerefresh%2Conytevent%2Conload&id=I0_1465850972222&parent=https%3A%2F%2F9dabourphone.blogspot.com&pfname=&rpctoken=28923134" data-gapiattached="true"></iframe></div>
</span>
</div>
<div class="twitter social-block">
<div class="social-title">
<i class="fa fa-twitter fa-4x"></i>
</div>
<p>حساب الموقع على تويتر</p>

<span style="display:inline-block; padding:5px 0">
<iframe id="twitter-widget-0" scrolling="no" frameborder="0" allowtransparency="true" class="twitter-follow-button twitter-follow-button-rendered" title="Twitter Follow Button" src="https://platform.twitter.com/widgets/follow_button.6e778523ecf0a9c9f1c446083d86ede1.en.html#dnt=false&amp;id=twitter-widget-0&amp;lang=en&amp;screen_name=dabourphone&amp;show_count=true&amp;show_screen_name=true&amp;size=l&amp;time=1465851011860" style="position: static; visibility: visible; width: 245px; height: 28px;" data-screen-name="dabourphone"></iframe>
<script>window.twttr=(function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return;js=d.createElement(s);js.id=id;js.src="https://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);t._e=[];t.ready=function(f){t._e.push(f);};return t;}(document,"script","twitter-wjs"));</script>
</span>
</div>


تخصيص الإضافة:
  1. غير https://www.facebook.com/dabourphone برابط الفيسبوك الخاص بك.
  2. غير UCjp5mGQezqj99HX7p7Tt3Tw بمعرف قناتك على اليوتيوب.
  3. غير dabourphone بمعرف حسابك على التويتر.
  • مبروك عليك الإضافة.
  • وهذا كل شئ فى موضوع اليوم اذا واجهتك أي مشكلة فى تركيب الإضافة او تريد التعديل على أي شيء ، فباب التعليقات مفتوح لا تتردد ! وادعمنا بمشاركة التدوينة ليستفيد منها الجميع

دبور فون

M.H.I

هناك تعليقان (2):

نسعد ونتشرف بتعليقاتكم
لكن فى إطار الموضوع وليس خارجه حفاظاً على راحتك الشخصية
لوضع اى اكواد Html فى التعليقات يرجى تحوليها اولاً بمحول الأكواد من هنا
لذلك نرجو منك ان تستعمل كل شىء بطريقته الصحيحة شكراً لتفهمك 😊

أحدث الأخبار

10/recent