السلام عليكم
هل شاهدت من قبل أحد المدونات تدمج أكثر من أداة فى مكان واحد بحيث يتم الانتقال بين الأداة والأخرى عن طريق الضغط على التبويب الخاص بكل أداة. تستخدم تلك الميزة لتوفير مكان داخل مدونتك فان كنت بحاجة الى تنسيق وترتيب إضافات وأدوات مدونتك وتقليل حجم الصفحة لسرعة تحميلها فانت حتما فى المكان الصحيح حيث يمكنك استخدام شرحنا لأكواد تستطيع بها دمج ثلاث أدوات وأكثر فى مكان واحد.
الخطوة الأولى: أخذ نسخة إحتياطية من قالبك لتفادى حدوث أى أخطاء وارد حدوثها.
الخطوة الثانية: اذهب الى قالب ثم تحرير HTML وقم بالبحث عن ]]></b:skin> واضافة الكود التالى قبله أو فوقه وهو كود CSS
/* Tab Widget */.tabviewsection {background: #f8f8f8;text-transform: uppercase;border-bottom: 5px solid #f34246;border-bottom-left-radius: 6px;border-bottom-right-radius: 6px;float: left;width: 100%;}.tabs-widget {list-style: none;list-style-type: none;margin: 0 0 10px 0;padding: 0;}.tabs-widget li {list-style: none;list-style-type: none;padding: 0;float: left;border-right: 2px solid #fff;}.tabs-widget li a {color: #fff;display: block;padding-right: 16.5px;padding-left: 16px;font-size: 13px;padding-top: 15px;padding-bottom: 15px;text-decoration: none;border-top-left-radius: 5px;border-top-right-radius: 5px;}.tabs-widget-content {}.tabviewsection {margin-top: 10px;margin-bottom: 10px;}.tags_tab {width: 80px;text-align: center;}.about_tab {width: 96px;text-align: center;}li.laster {border: 0px;width: 120px;text-align: center;}.blog-mobile-link {display: none;}.tabs-widget li a {padding-right: 20px;padding-left: 20px;}.tabs-widget {height: 51px;}.tw-authors {width: 570px;}.tabviewsection h2 {display: none;}.tabs-widget li a.tabs-widget-current {padding-bottom: 20px;margin-top: -10px;background: #f8f8f8;color: #444;text-decoration: none;border-top: 5px solid #f34246;font-size: 14px;text-transform: capitalize;}.tabs-widget li a {background: #f34246;}
الخطوة الثالثة: هى البحث عن <div id=’sidebar-wrapper’> واذا لم تجد ابحث عن <aside> وضع اسفل منه أو بعده الكود التالى
<!– Tab Widget [start] –><div class=’tabviewsection’><script type=’text/javascript’>jQuery(document).ready(function($){$(“.tabs-widget-content-widget-themater_tabs-1432447472-id”).hide();$(“ul.tabs-widget-widget-themater_tabs-1432447472-id li:first a”).addClass(“tabs-widget-current”).show();$(“.tabs-widget-content-widget-themater_tabs-1432447472-id:first”).show();$(“ul.tabs-widget-widget-themater_tabs-1432447472-id li a”).click(function() {$(“ul.tabs-widget-widget-themater_tabs-1432447472-id li a”).removeClass(“tabs-widget-current a”);$(this).addClass(“tabs-widget-current”);$(“.tabs-widget-content-widget-themater_tabs-1432447472-id”).hide();var activeTab = $(this).attr(“href”);$(activeTab).fadeIn();return false;});});</script><ul class=’tabs-widget tabs-widget-widget-themater_tabs-1432447472-id’><li class=’about_tab’><a href=’#widget-themater_tabs-1432447472-id1′>About</a></li><li class=’tags_tab’><a href=’#widget-themater_tabs-1432447472-id2′>Tags</a></li><li class=’laster’><a href=’#widget-themater_tabs-1432447472-id3′>Popular</a></li></ul><!– Tab Widget 1 –><div class=’tabs-widget-content tabs-widget-content-widget-themater_tabs-1432447472-id’ id=’widget-themater_tabs-1432447472-id1′><b:section class=’sidebar’ id=’sidebartab1′ preferred=’yes’></b:section></div><!– Tab Widget 2 –><div class=’tabs-widget-content tabs-widget-content-widget-themater_tabs-1432447472-id’ id=’widget-themater_tabs-1432447472-id2′><b:section class=’sidebar’ id=’sidebartab2′ preferred=’yes’></b:section></div><div class=’tabs-widget-content tabs-widget-content-widget-themater_tabs-1432447472-id’ id=’widget-themater_tabs-1432447472-id3′><!– Tab Widget 3 –><b:section class=’sidebar’ id=’sidebartab3′ preferred=’yes’></b:section></div></div><!– Tab Widget [endt] –>
الخطوة الرابعة :هى حفظ القالب.
الخطوة الخامسة :هى التوجه الى تخطيط مدونتك Layout لتنفيذ بعض الخطوات الهامة وستجد أنك قد قمت بانشاء 3 أماكن جديدة تمكنك من إضافة أدوات. ستقوم بإضافة أداة واحدة لكل مكان. ليكون العدد 3 أدوات وليكن كما بالصورة التالية
قد قمنا باضافة أداة واحدة أسفل كل مكان جديد قمنا بإنشائه من الخطوات السابقة. قم بعد ذلك بمعاينة مدونتك وستجد أن النتيجة إيجابية إن شاء الله وهى دمج الثلاث أدوات فى شكل تبويبات بجانب بعضها وبالتالى قد قمنا بتجميع 3 أدوات فى مكان واحد وتوفير أماكن أخرى بالمدونة لأى أداة أخرى.
