كود جديد لإضافة عدة تبويبات لصفحتك الإجتماعية

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

لإضافة كود التبويبات لصفحتك الإجتماعية على موقع الفيس بوك اذهب إلى صفحتك الإجتماعية ثم اضغط على زر "تعديل الصفحة"

ثم رابط "التطبيقات"

اذهب إلى تطبيق محرر ثم اضغط على "الذهاب إلى التطبيق" لإضافة الكود في محرر صفحتك.

انسخ كود التبويب مع وضع كودات FBML بداخله ليظهر التبويب بالشكل المطلوب.

<style type="text/css"> .menu { background:#FFFFFF none repeat scroll 0 0; border:1px dashed #BDC7D8; padding:5px; font-family:"lucida grande",tahoma,verdana,arial,sans-serif; font-size:11px; width: 507px; margin-left:0%; margin-right:0%; } .menu h3 { margin-bottom:10px; padding:5px 0 0 5px; font-size:13px; } .menu ul { color:#3B5998; padding:0 10px 5px; } .menu li { font-weight:bold; list-style-image:none; list-style-position:inside; list-style-type:square; padding:0 0 5px; } .menu .descrip { color:#444444; font-weight:normal; padding:3px 0 0 15px; border:thick; } h3 {color:#3b5998;} <!– a:link {color: #3b5998; text-decoration: none; } a:active {color: #3b5998; text-decoration: none; } a:visited {color: #3b5998; text-decoration: none; } a:hover {color: #3b5998; text-decoration: none; } –> </style> <div style="display:none"><fb:tabs> <fb:tab_item href="myphotos.php" title="My Photos" /> </fb:tabs> </div> <div class="tabs clearfix"><center><div class="left_tabs"><ul class="toggle_tabs clearfix" id="toggle_tabs_unused"><li class="pen"><a href="#" class="" clicktohide="2,3,4" clicktoshow="1">التبويبة 1</a></li> <li class="alm"><a href="#" class="" clicktohide="1,3,4" clicktoshow="2">التويبية 2</a></li> <li class="bcn"><a href="#" class="" clicktohide="1,2,4" clicktoshow="3">التبويبة 3</a></li> <li class="vlc"><a href="#" class="" clicktohide="1,2,3" clicktoshow="4">التبويبة 4</a></li> </ul></div></center></div> <div id="1" style=""><div class="menu" > ضع الكود الأول </div></tr> </table> </div> <div id="2" style="display:none"><div class="menu" > ضع الكود الثاني </div></tr> </table></div> <div id="3" style="display:none"><div class="menu" > ضع الكود الثالث </div></tr> </table> </div> <div id="4" style="display:none"><div class="menu" > ضع الكود الرابع </div></tr> </table> </div>

الصق الكود في المكان المحدد له ثم احفظ التغييرات

عند الحفظ اذهب إلى صفحتك الاجتماعية لترى النتيجة - اضغط لمشاهدة مثال حي

للإستفادة من خدمات أخرى خاصة بالصفحات الإجتماعية اضغط هنا

تنبيه : لا يسمح بنسخ محتويات هذه المدونة أو إعادة نشرها أو تحميلها أو بثها أو نقلها أو توزيعها بأي طريقة بدون إذن كتابي مسبق من صاحبها