صناعة آداة متعددة التبويبات بتقنية جي كويري
اضافة مميزة لمدونات بلوجر وهي آداة متعددة التبويبات آداة وليست قسم هناك فرق هذه آداة يمكن ان تضيفها داخل الموضيع أو في آداة HTML/JavaScript في اى مكان بقالبك مفيدة جداً لأصحاب ا لمدونات التي بها انواع متعددة من المواضيع والأقسام وايضاً لمن يستخدمون العديد من الإضافات يمكن ان تجمعها في إضافة واحدة يمكن ان تضيف بها مثلا جميع اضافات المواقع الإجتماعية كثير من الأشياء فقط أحتاج منك قليل من الإنتباه لتنفيذها وهي غاية في السهولة ويمكنك معاينتها في البداية من الرابط التالي
أولا ادخل الى تحرير قالبك وأضف الكود التالي فوق الوسم </head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/themes/base/jquery-ui.css" type="text/css" />
<script>
jQuery(document).ready(function($) {
$("#tabs").tabs();
});
</script>
مع حذف الكود الاحمر ان كانت لديك مكتبة JQuery في قالبك فعلياً
واستبدال الكود الأزرق بكود المظهر الذي يناسبك ستجد في نهاية الموضوع اكواد لعدة مظاهر اختار ما يناسبك
وأضف الكود التالي فوق الوسم ]]></b:skin> إن اردت الازرار من اليمين الى اليسار كما في المعاينة
.ui-tabs .ui-tabs-nav li {float: right !important;}
اما الكود التالي هذا هو كود تشغيل وعمل الإضافة هذا تضيفه في موضوع طبعا بعد تغيير الموضوع من وضع التأليف الى وضع HTML أو في آداة HTML/JavaScript كما تريد
<div id="tabs">
<ul>
<li><a href="#tabs-1">التبويب الاول</a></li>
<li><a href="#tabs-2">التبويب الثاني</a></li>
<li><a href="#tabs-3">التبويب الثالث</a></li>
</ul>
<div id="tabs-1">
محتوى التبويب الأول
</div>
<div id="tabs-2">
محتوى التبويب الثاني
</div>
<div id="tabs-3">
محتوى التبويب الثالث
</div>
</div>
طبعا تستبدل جملة محتوى التبويب بكلمات أو فديو أو كود اضافة اى شئ تريد
وان اردت زيادة عدد التبويبات كرر الأكواد الحمراء مع تغيير الرقم الى 4 ثم 5 او اكثر كل تكرار يساوي تبويب جديد
والتكرار يكون بعده مباشرة
والآن اترككم مع المظاهر اختار مظهر الإضافة الاقرب لألوان قالبك وبالتوفيق مقدماً
 |
 |
 |
|---|---|---|
 |
 |
 |
 |
 |
 |
 |
 |
 |
 |
 |
 |
 |
 |
 |
 |
 |
 |
 |
 |
|
رائع جدا ابداع مميز
ردحذفانا لقيت الأضافة دى فى مدونة قديمة جدا انا بقول فكرتى اكيد دة من فكرك سلمت يداك وابدعت
ردحذفشكراً أخي احمد لم افهم يا طيب هل تقصد ان هناك من عرض اضافة مشابهة لهذه من قبل ؟؟ ان كان كذلك هذا امر طبيعي اخي فهذه احدى الإضافات الرسمية في جي كويري يعني كالقوالب وكباقي الإضافات هناك من يعرضها اكيد لكن طبعا الموضوع كاملا وشرحها وتطوير اجزاء بها كل هذا خاص لمدونتي لا يمكن ان استخدم النقل وان استخدمه يجب ان احفظ حقوق الغير بالإسم والرابط كما احب ان تحفظ حقوقي فما لا ارتضيه لنفسي لا ارتضيه لغيري وشاكر لمرورك
ردحذفاسف اذا كنت اسات فهمى لك واعرف ان مواضيعك حصرية ومنسقة 100%
حذفلا تأسف يا غالي وفي كل الحالات لعل التوضيح مفيد شرفت بمرورك تحياتي =r
حذفالسلام عليكم
ردحذفسبحان الله قبل ايام اردت سؤالك عنها ^_^ ولكني ضننتها دعم فني :) حياك الله ياطيب وشكراً لك..
اريد رأيك بقالب جديد اقوم بتصميمه :) : http://new2001.blogspot.com/
وعليكم السلام ورحمة الله وبركاته
حذف=s الحمد لله اخي محمد الذي ييسر الأمر بالنسبة للقالب اظن انه ما يزال في البداية فلا يمكن الحكم لكنه مبدئياً يحتاج ضبط في المسافات اضافة ان هناك شوائب في الصور ويحتاج لضبط المسافات لكن يا طيب أظن ان حور عبد الله هذه مدونة احذر ان كان هناك نسخ ولو بسيط مع اكتشافه تهدم السمعه ويجب اخذ اذن المصمم وبالتوفيق
اشكرك اخي العزيز ^_^ بالنسبة للنسخ فلا ثم لا لالالالا في هذا القالب اعتمدت على خبرتي فقط :) وبالنسبة للشعار فأنا اخترته كتميز كون الشعار دائري + اعجبني ^_^ اشكرك يا طيب
حذفلم افهمك بشأن المسافات ؟ اي مسافات تقصد ؟
حذفأقصد بالمسافات يا غالي
حذفتلك التي كانت بين النصوص في القوائم الىن ضبطت عندما رأيت القالب اول مرة كانت النصوص خارجة عن اطار خلفية القائمة
ايضاً هنا المسافات بين حدود الصفحة يعني لا تجعل القوائم طالما القوائم حوافها مستديره حاول ان يكون هناك مسافة بين الحافة ونهاية الشاشة والتوفيق يا غالي
وفي انتظار رؤية العمل يا غالي بعد اكتماله
حذفاشكرك اخي العزيز ^_^ وان شاء الله سيكتمل قريباً , بعد الانتهاء سأبحث عن سلايد شو جميل لأضيفه كلمسة جميلة للقالب وكذلك لدي افكار مبدعة سأضعها =a
حذفتمنياتي لك أخي الحبيب بالتوفيق دمت في امان الله =r
حذفابدعت اخى عمرو فى موضوعك
ردحذفوادعمك بكل ثقة ان لديك المزيد لتقديمه =r
ربي يعزك اخي محمود ولدي تلال من الأفكار والإضافات المخزنة خلال فترة دراستي لبلوجر قبل ان افتتح المدونة افكر طبعا في عرضها وتطويرها كون البعض تتطرق لها فيجب ان تكون بها شئ جديد والله المستعان شاكر لمرورك العطر يا طيب =r
حذفقالب مدونتك رائع هل تستطيع تصميم لي قالب مشابهه وبجميع إضافات القالب
ردحذفنعم انا اقوم بتصميم القوالب المدفوعة الأسعار تبدأ من 35 دولار يمكنك التواصل عبر صفحة راسلنا لإعطائك تفاصيل اكثر وشكراً للمرور الكريم
حذفالسلام عليكم ورحمة الله وبركاته
ردحذفأخي الحبيب عمرو ماشاء الله عليك أسأل الله العظيم أن يحميك من كل شر =s
دائما في الوقت المناسب كنت أبحث عن إضافة للمدونة بنفس الفكرة وها أنا أجدها
لديك في المدونة بتنسيقات رائعة =u بارك الله فيك على الإضافة الرائعة والمميزة
وفي إنتظار جديدك الأروع والمميز دمت في أمان الله وحفظه
وعليكم السلام ورحمة الله وبركاته
حذفحبيبي الغالي بدر ربي يعزك يا طيب واحمد الله ان تجد ما ترغب في المدونة
تحياتي لك وبالتوفيق
r= أسأل الله العظيم أن يحميك من كل شر
ردحذفالله آمين وإياكم أخي يوسف تحياتي لك يا طيب =r
حذفدائماً مبدع ،، بالتوفيق لك ولمن يساندك
ردحذفربنا يعزك وأنتم من يساندني بتلك التعليقات والمتابعة فتحية لكل متابعينا المحترمين =r
حذفعاوز اعرف حاجه..هو انا ممكن اصغرها واكبرها؟؟
ردحذفيمكنك ذلك أخي بإضافة الكود الأخير بين هاذين الكودين مع تعديل الرقم 500 بالمقاس الذي تريده
حذف<div style="width:500px;">
اضفه هنا
</div>
كيف استفيد من هذا الكود بحيث يصبح عندي المشاركات الشائعة + التعليقات + ارشيف المدونة
ردحذفبصراحة ما عندي خبرة كبيرة في الاكواد
يا ليت تفيدني
يمكنك ان تستخدمها هكذا وتضيف في كل تبويب كود آداة لكن طبعا الأرشف لن ينفع لانه آداة تابعة لبلوجر وليست آداة HTML/JavaScript
حذفالأرشيف والادوات المستقله لها نظام آخر في مسالة التبويبات
كيف اغير الشك اين اضيف كود الستايل
ردحذفأخي الفاضل راجع الموضوع جيداً مذكور به أسئلتك
حذفموضوع مميز جد اشكرك استاذي عمرو , كيف استطيع تركيب المظاهر ؟
ردحذفذلك مذكور اخي عمر في الموضوع الكود الأزرق الموجود في اول كود تستبدله بكود المظهر الذي تريد كل مظهر تحته كود تنسخ كود المظهر الذي تريد وتستبدله بالأزرق الموجود في الكود الاول في الموضوع
حذفجزاك الله ألف خير وفي ميزان حسناتكم يارب ..
ردحذفأخي العزيز ممكن شرح كيفية تحويل الكلام إلى اليمين .. لأن الكلام يظهر على اليسار
فائق احترامي وتقديري
أضف الكلمات التي تريدها ان تكون تجاه اليمين بين هذين الكودين
حذف<div style="text-align:right;">
هنا
</div>
السلام عليم الاضافة لا تعمل نهائيا اخي اين css الخاص ب tabs
ردحذفبالاضافة الى الاشكال التي وضعت في الاسفل كلها تحمل نفس الرابط وهو رابط لستايل لا علاقة له ب tabs هناك خطأ في الموضوع اخي الفاضل
عندما اضفت كل ما قلته لم تفلح ظهر ك hml فقط بدون ستيال
الرابط الخاص بالستايل الذي قلت اضفوه الى القالب عندما فتحته لم اجد فيه اي معرف لهذه الاضافة
وهذا ايضا لم افهمه اصلا ولا يوجد فيه شيئ
<script>
jQuery(document).ready(function($) {
$("#tabs").tabs();
});
</script>
=
اتمنى الرد وشكرا جزيلا اخي الكريم
وعليكم السلام ورحمة الله وبركاته
حذفكيف لا تعمل الاضافة اخي وهي في المعاينة تعمل كما ترى ؟
واخي كل مظهر له رابط مختلف كيف يحملون نفس الرابط ؟
طبق الشرح اخي الكريم وستعمل معك او جرب على قاب مختلف عن الذي تستخدمه ربما المشكله منه