الموضوع
اقرأ ايضًا
التعليقات
عن الكاتب
تعليمات
من أفضل وأحسن السكربتات المنظمة التي ستجدونها متوفرة منها سكربت عرض المواضيع حسب التسميات، حقا إضافة جد مفيدة لأصحاب كثرة الأقسام بموقعهم يتميز بعرض المواضيع على شكل شبكة (GRID) كما يحتوي على عنوان وأيضا يمكن تخصيص كل قسم على حسب عدد المواضيع التي تريد إظهارها به.
قد لا يناسب موقعك من حيث شكله لذا وجب اختيار له مكان مناسب وكذلك أن تكون على دراية بالتعديل على الأكواد الخاصة بالستايل، سأقدم شرح التركيب ومفهومه والبقية منوط بكم
شرح طريقة التركيب
1. ابحث عن ]]></b:skin> وضع الكود التالي فوقه أو ضعه بين <style> </style> فوق </head>
<li><a href='#tab7'><script>document.write(Title7);</script></a></li>
وتبقى مرحلة آخيرة وهي تكرار الكود تحت أخيه المحدد باللون البرتقالي هكذا :
قد لا يناسب موقعك من حيث شكله لذا وجب اختيار له مكان مناسب وكذلك أن تكون على دراية بالتعديل على الأكواد الخاصة بالستايل، سأقدم شرح التركيب ومفهومه والبقية منوط بكم
1. ابحث عن ]]></b:skin> وضع الكود التالي فوقه أو ضعه بين <style> </style> فوق </head>
#tabber-wrapper {width: 96%;float: right;overflow: hidden;margin: 13px;border: 1px solid #EAEAEA;background: #fff;margin-right: 10px;}
.tabber .column_img:hover {margin-bottom: 12px;opacity: .9;}
ul.tab-view{float:right;list-style:none;height:25px;width:99%;margin:0;padding:5px 5px 6px;font-family: droid arabic kufi;font-size: 12px;background:#444444}
ul.tab-view li{float:right;height:26px;line-height:26px;overflow:hidden;position:relative;margin:0;padding:0; margin-left:9px;}
ul.tab-view li a{text-decoration:none;color:#fff;display:block;outline:none;font-weight:400;padding:0 15px;}
html ul.tab-view li.active,html ul.tab-view li.active a,html ul.tab-view li.active a:hover{color:#fff;background:#FC4F3F;border-radius:2px;text-shadow:none}
.tab-wrapper{overflow:hidden;clear:both;float:right;width:100%;margin-bottom:10px;}.tabber{padding:5px 0 0}
.tabber .column{ float: right;display: inline;width: auto;height: 150px;margin-right: 13px;padding: 2px 2px 5px;}
.tabber .column_img{background: #fff;padding: 0px;width: 200px;height: 150px;margin: 5px 0px 0px;border: 1px solid #DBDBDB;}
.tabber h2{line-height: 16px;text-align: center;background: #FC4F3F;padding: 10px 0 10px 21px;width: 179px;position: relative;bottom: 50px;opacity: .9;font-family: cursive;font-size: 12px;margin-left: 1px;}.tabber h2 a{color:#FFF;}.tabber h2 a:hover{color:#FFF;text-decoration:none;}
* المحدد بالأحمر هو عرض الصندوق 96%
2. إبحث عن </head> وضع الكود التالي فوقه<script type='text/javascript'>
//<![CDATA[
imgr = new Array();
imgr[0] = "http://i.imgur.com/7WK8lcQ.png";
showRandomImg = true;
aBold = true;
summaryPost = 100;
summaryPost1 = 200;
numposts = 9;
numposts1 = 9;
numposts2 = 9;
numposts6 = 9;
Title1 = "عنوان 1";
Title2 = "عنوان 2";
Title3 = "عنوان 3";
Title4 = "عنوان 4";
Title5 = "عنوان 5";
Title6 = "عنوان 6";
//]]></script>
<script src='https://ar1web-com.googlecode.com/svn/trunk/flexcroll.js'/>
* المحدد بالأحمر ضع عناوين
* الأرقام المحددة بالبرتقالي هي عدد ظهور المواضيع في كل قسم يمكنك تغييرها حسب ما تريد
* إذا أردت إضافة قسم آخر فأضف هذا الكود تحت إخوته : Title7 = "عنوان 7";
3. الكود التالي ضعه بالمكان الذي تراه مناسب* الأرقام المحددة بالبرتقالي هي عدد ظهور المواضيع في كل قسم يمكنك تغييرها حسب ما تريد
* إذا أردت إضافة قسم آخر فأضف هذا الكود تحت إخوته : Title7 = "عنوان 7";
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static"'>
<div class='cf' id='tabber-wrapper'>
<ul class='tab-view'>
<li><a href='#tab1'><script>document.write(Title1);</script></a></li>
<li><a href='#tab2'><script>document.write(Title2);</script></a></li>
<li><a href='#tab3'><script>document.write(Title3);</script></a></li>
<li><a href='#tab4'><script>document.write(Title4);</script></a></li>
<li><a href='#tab5'><script>document.write(Title5);</script></a></li>
<li><a href='#tab6'><script>document.write(Title6);</script></a></li>
</ul><div class='clear'/>
<div class='tab-wrapper'>
<div class='tabber' id='tab1'>
<script>
document.write(" <script src=\"/feeds/posts/default/-/قسم 1?max-results="+numposts2+"&orderby=published&alt=json-in-script&callback=showrecentposts1\"><\/script>");
</script></div>
<div class='tabber' id='tab2'>
<script>
document.write(" <script src=\"/feeds/posts/default/-/قسم 2?max-results="+numposts2+"&orderby=published&alt=json-in-script&callback=showrecentposts1\"><\/script>");
</script></div>
<div class='tabber' id='tab3'>
<script>
document.write(" <script src=\"/feeds/posts/default/-/قسم 3?max-results="+numposts2+"&orderby=published&alt=json-in-script&callback=showrecentposts1\"><\/script>");
</script></div>
<div class='tabber' id='tab4'>
<script>
document.write(" <script src=\"/feeds/posts/default/-/قسم 4?max-results="+numposts2+"&orderby=published&alt=json-in-script&callback=showrecentposts1\"><\/script>");
</script></div>
<div class='tabber' id='tab5'>
<script>
document.write(" <script src=\"/feeds/posts/default/-/قسم 5?max-results="+numposts2+"&orderby=published&alt=json-in-script&callback=showrecentposts1\"><\/script>");
</script></div>
<div class='tabber' id='tab6'>
<script>
document.write(" <script src=\"/feeds/posts/default/-/قسم 6?max-results="+numposts2+"&orderby=published&alt=json-in-script&callback=showrecentposts1\"><\/script>");
</script></div>
<div class='clear'/>
</div></div>
</b:if> </b:if>
<script type='text/javascript'>
//<![CDATA[
var _0x3c49=["\x68\x69\x64\x65","\x2E\x74\x61\x62\x62\x65\x72","\x73\x68\x6F\x77","\x61\x63\x74\x69\x76\x65","\x61\x64\x64\x43\x6C\x61\x73\x73","\x75\x6C\x2E\x74\x61\x62\x2D\x76\x69\x65\x77\x20\x6C\x69\x3A\x66\x69\x72\x73\x74","\x2E\x74\x61\x62\x62\x65\x72\x3A\x66\x69\x72\x73\x74","\x72\x65\x6D\x6F\x76\x65\x43\x6C\x61\x73\x73","\x75\x6C\x2E\x74\x61\x62\x2D\x76\x69\x65\x77\x20\x6C\x69","\x68\x72\x65\x66","\x61\x74\x74\x72","\x61","\x66\x69\x6E\x64","\x66\x61\x64\x65\x49\x6E","\x63\x6C\x69\x63\x6B","\x72\x65\x61\x64\x79"];jQuery(document)[_0x3c49[15]](function (){$(_0x3c49[1])[_0x3c49[0]]();$(_0x3c49[5])[_0x3c49[4]](_0x3c49[3])[_0x3c49[2]]();$(_0x3c49[6])[_0x3c49[2]]();$(_0x3c49[8])[_0x3c49[14]](function (){$(_0x3c49[8])[_0x3c49[7]](_0x3c49[3]);$(this)[_0x3c49[4]](_0x3c49[3]);$(_0x3c49[1])[_0x3c49[0]]();var _0x88b3x1=$(this)[_0x3c49[12]](_0x3c49[11])[_0x3c49[10]](_0x3c49[9]);$(_0x88b3x1)[_0x3c49[13]]();return false;} );} );
//]]>
</script>
* هذه العملية هي التممة إذا أردت إضافة قسم آخر فعليك إضافة العنوان والذي ذكرته سابقاً كما ترى المحدد باللون الأخضر يوجد بهم ستة أكواد أضف السابع تحت السادس هكذا يكون الكود :<li><a href='#tab7'><script>document.write(Title7);</script></a></li>
وتبقى مرحلة آخيرة وهي تكرار الكود تحت أخيه المحدد باللون البرتقالي هكذا :
<div class='tabber' id='tab7'>
<script>
document.write(" <script src=\"/feeds/posts/default/-/مجانيات?max-results="+numposts2+"&orderby=published&alt=json-in-script&callback=showrecentposts1\"><\/script>");
</script></div>
* لا تنسى تغيير التسميات : قسم 1, قسم 2, قسم 3, قسم 4,قسم 5,قسم 6
يمكنك حفظ القالب ومبروك عليك الإضافة، لأي استفسار خاص بالتدوينه فضعه بالتعليق.
ملحوظة:
يسعدنا تفاعلكم بالتعليق، لكن يرجى مراعاة الشروط التالية لضمان نشر التعليق
1أن يكون التعليق خاص بمحتوى التدوينة
2أن لا تضع أي روابط خارجية
3لإضافة كود حوله أولاً بمحول الأكواد
4أي سؤال خارج محتوى التدوينة يرجى استخدام ركن الأسئلة
5😊😉😀😁😎😍😜😑😇💖😯😱😭👍❓🍻
إرشادات
- موقع : Mediafire
- موقع :file-upload
- باسوورد فك الضغط للملفات المضغوطة : Ar1web2014
- تجدون روابط التحميل في القوالب والملحقات بجانب التدوينة أي بالسيدبار
- كل ملحق أو قالب يوجد بالمدونة هو للإستعمال الشخصي فقط
- إن تواجد رابط معطوب فالمرجو التبليغ عنه هنا، شكرا.
تحميل الملفات
أين تجدنا؟
كلمة الختام
أخر تعديل كان في يوم السبت 20 يونيو من سنة 2020 ، هذه الصفحة قابلة للتعديل وقت اللزوم
شكرا لك ولكن كنت اريد السكربت بتاع قالب عرب ويب السابق وشكرا لك على المجهود
ردحذفهذا نفس السكربت
حذفاوك شكرا لك
حذفمشكور اخي حسام
ردحذفبعد تغير صورتك نورت المدونة كثيرا
لكن اخي لدي مدونة من انشر يضهر لي العنوان موجود والوصف قليل جدا
والمشكلة الثانية عندما ادخل على التدوينه يضهر لي العنوان في المتصفح للاعلى يضهر رابط لم يضهر العنوان
ارجو الرد :(
إما يكون خطأ في التعريب أو كود خاص بالمظهر تم تغييره توجه للقالب الأصلي وانظر إذا به نفس المشكل إذا لم يكن فستجد كود بالسطور الأولى للقالب شبيه بهذا غيره بالكامل https://www.blogger.com/static/v1
حذففي المرة القادمة ضع تعليقك بالمكان المناسب :
http://www.ar1web.com/2015/03/do-you-have-problem-in-blogger.html
هل القالب مجاني !!
ردحذفاقصد هذا القالب http://wejhat-v2.blogspot.com/
اذا كان مجاني هل يمكنك ارساله الى بريدي الالكتروني mapali20000@gmail.com
واذا كان مدفوع كم سعره - ارسل لي معلومات البيع عبر البريد وشكرا
مجاني ستجده بقسم "قوالب بلوجر" أو إبحث عنه بمربع البحث "قالب وجهات"
حذفستجد رابط التحميل بالقائمة الجانبية
الف شكرا لكم و لخدمتكم المميزة تحياتي الكم
حذفالعفو، تسعدنا خدمتك
حذفيا ريت شرح كيفية وضع التدوينات متل قالب وجهاتْ النسخة الاولى وشكرااا
ردحذففي المسقبل القريب بإذن الله
حذفشكرا
حذفكفية وضعها اسفل المشاركات
ردحذفضعها فوق <div id="footer-wrapper">
حذفرائع كالعادة هل لي بطلب صغير
ردحذفاريد نسخة من التدوينات التي تستخدمها في عرض قوالب واجهات ولك جزيل الشكر
ليست إضافة أخي، إن شاء الله قد يكون شرح لكن بشكل مختلف
حذفاخي اقصد نسخة المشاركات اي ان تقوم بتصدير مدونة الكترونية من قالب واجهات بصيغة xml , وترسلها لي لا اقصد اي اضافة
حذفللآسف ليست للمشاركة أخي
حذفسؤال فني
ردحذفبالنسبة للكود التالي font-weight:500; طبعا القيمة 500 تتغير بحسب المزاج لدي ._. انا لا احد الخط السميك غالبا ما استخدمها حتى في العناوين الرئيسية h1 , h2 هل يؤثر ذالك على ارشفة المدونة وهل ااستخدام الكلمات المفتاحية للمواضيع مرهون بـfont weight; ام ليس لها علاقة
وشكرا ^_^
لا علاقة له بتاتا بالأرشفة أو غيرها هو لتوضيح العناوين فقط
حذفرائع اخي
ردحذفاتمنى لو تقوم بعمل دورة تكويد قالب بلوجر
اتوقع سوف يكون لها صدى واعجاب كبيير نظرا لاسلوبك في طرح الشروحات ♥
ياريت اخى حسام تعمل دورة تكويد ممكن تشرحلى كيفية استخدام after,before فى css فى عمل border
حذفلو سمحت اخي انا اصمم قالب ولكن واجهتني مشكلة اضيف هوفر ولا يظهر طبعاً اشاهد شرح ابو علي على اليوتيوب و عملت نفسه بالضبت ارجوا الحل بسرعه ...
ردحذفكيف تضيفه؟ ولأي شيء تستخدمه؟
حذفأترك مثال
أخي أورد تكبير العرض ليناسب شكل القالب
ردحذفستجد في الشرح بأول الكود الرقم 96% غيره بالعرض المناسب لك
حذفشكرا أخي أوريد أن تظهلر المواضيع في الوسط لتناسب إطلة العرض
ردحذفإبحث عن .tabber .column ستجد بالسطر margin-right: 13px غيره بهذا margin: 20px 16px
حذفشكرا جزيلا لك
ردحذفأخي الكريم أوريد مساعدة منك لديك مشكلة في مدونتي
الاضافة مش شغلة اخي iHus sam
ردحذفلا تظهر أم ماذا؟
حذفنرجو من سيادتم كتابة حل للمشكلة لان السكربت غير ظاهر مش شغال علي مدونتي
ردحذفضع رابط للمعاينة تكون مدونة تجريبية فقط
حذفمش شغال خالص بيظهر اول قسم بس وباقى الاقسام مش بتظهر ليها حاجة خالص وكمان لما بتضغط على القسم بيحولك لصفحة القسم كلها
ردحذفحاول تجرته بقالب آخر للتتأكد
حذفأخي حسام احييك على ه\ه الأعمال الإحترافية الرائعة ..
ردحذفانا لدي في القالب نقس السكريبت واريد ازالته ما الحل ؟
مشكور مسبقاً
بما أنك تمتلك مثله ما عليك إلا البحث عن الكود الأول بقالبك ثم احذفهم كما هو في هذه التدوينة هل فهمت قصدي؟
حذفشكرا على الشرح أخي حسام
ردحذفشكرا على هذه الإضافة الرائعة اخي حسام
ردحذفتم التركيب بنجاح كما ان هذه الإضافة تناسبت بشكل كبير القالب الجديد تواصل. شكرا مرة اخرى ودمت في خدمة الجميع
السلام عليكم اخي حسام اتمنى ان تكون في تمام الصحة والعافية ومعذرة مرة اخرى على الإزعاج. سبق وان قلت لك بأن الإضافة نصبت بنجاح لكني بعد تركيبها في قالب تواصل وفي مدونة تجريبة ظهر مشكلين.
ردحذف1- السلايدر الموجود في السيدبار تغير شكله
2- البوستات الموجودة اسفل رسائل المدونة تشوهت هي الأخرى في حين الإضافة تشتغل بشكل عادي ليتك خي تساعدني او تركب لي الإضافة وسأرسل لك القالب مرة اخرى. ومعذرة معذرة معذرة مرة اخرى
عليكم السلام، كود السكربت لا يتوافق مع الإضافات الأخرى كأن هناك تطابق في الأكواد وليس هناك حل بهذا الخصوص... لكن سبق وركبتها على نفس القالب ونجحت صحيح؟ أم جربتها على قالب آخر؟
حذفيمكنك تصفح المشاكل من هنا http://temsamanee.blogspot.com/
ردحذفلا أخي ركبتها على قالب تواصل ولم اكن اعتقد انها هي التي تسببت فيها الا بعد تركيبها في الموقع الرسمي. على العموم شكرا لك على اهتمامك بارك الله فيك.
ردحذفالعفو، لربما يلائمك قالب اخباري به بوستات كثيرة ستجده منشور بصفحتنا
حذفاخى اين اضع الكود الاخير
ردحذفانا اتبعت جميع الخطوات لكن الكود الاخير لا اعرف اين اضعه
ابحث عن كود ترقيم الصفحات وضعه أسفله
حذفشكرااا على شروحاتك المتميز وننتضر المزيد
ردحذفالسلام عليكم أخي الكريم هذا السكريب أصبح لا يحمل فجأة وأصبح شكل مدونتي غير جيد هل من حل
ردحذفتم تركيب السكريبت بنجاح شكرا جزيلا .. لكن المشكلة ظهور صور المواضيع بحجم كبير وتحت بعض غير مرتبين ايه المشكلة ؟
ردحذفركبت كل شيء وتابعت الخطوات لكن للاسف لم يظهر لي شيء ممكن تركوبه لي
ردحذف