شرح:طريقة أضافة صندوق الاعجاب بالفيس بوك كما بالمدونة

شرح:طريقة أضافة صندوق الاعجاب بالفيس بوك كما بالمدونة

بسم الله الرحمن الرحيم

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

وهو

طريقة أضافة صندوق الاعجاب بالفيس بوك كما بالمدونة

نبدأ مع الشرح

لإضافة هذا الصندوق إلى مدونتك المرجو تتبع الخطوات التالية :

• اذهب إلى لوحة التحكم الخاصة بمدونتك ثم تصميم بعد ذلك اضغط على إضافة أداة HTML/Javascript
• الآن انسخ الكود التالي و ضعه داخل الأداة

<center><style>.helperbloggerFB {
width: 300px;
height: 150px;
border-radius: 3px;
position: relative;
background-color:#f4f4f4;
padding:5px 10px 15px 0;
}
.helperbloggerFB, .helperbloggerFB:before, .helperbloggerFB:after {
background: #f4f4f4;
border: 1px solid #ccc;
}
.helperbloggerFB:before, .helperbloggerFB:after {
content: "";
position: absolute;
bottom: -3px;
left: 2px;
right: 2px;
height: 1px;
border-top: none;
}
.helperbloggerFB:after {
left: 4px;
right: 4px;
bottom: -5px;
box-shadow: 0 0 2px #ccc;
}
</style>

<div class="helperbloggerFB">
<div style="height:155px;overflow:hidden">
<fb:like-box href="https://www.facebook.com/waseet" data-width="300" data-height="179" data-show-faces="true" data-border-color="#f4f4f4" data-stream="false" data-header="false" class=" fb_iframe_widget "><span><iframe id="f5741c08" name="fdd6ca2ec" scrolling="no" style="border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; border-width: initial; border-color: initial; border-image: initial; overflow-x: hidden; overflow-y: hidden; height: 179px; width: 300px; " class="fb_ltr" src="http://www.facebook.com/plugins/likebox.php?border_color=%23f4f4f4&amp;channel=https%3A%2F%2Fs-static.ak.fbcdn.net%2Fconnect%2Fxd_proxy.php%23cb%3Df2babfba84%26origin%3Dhttp%253A%252F%252Fwww.btsnts.com%252Ff1ae6f85bc%26relation%3Dparent.parent%26transport%3Dpostmessage&amp;colorscheme=light&amp;header=false&amp;height=179&amp;href=https%3A%2F%2Fwww.facebook.com%2Fwaseet&amp;locale=en_US&amp;sdk=joey&amp;show_faces=true&amp;stream=false&amp;width=300"></iframe></span></fb:like-box>
</div>
</div>
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script></center>

المصدر: http://alwaseet-mediator.blogspot.com/

صورة لللاضافة

 

تصنيف : دروس و شروحات Blogger