كيف تغير شكل صفحات موقعك , التعامل مع القوالب

Admin عدد المساهمات : 424 تاريخ التسجيل : 23/07/2012

ما هي القوالب ؟
القوالب هي عبارة عن ملفات html تتحكم في تصميم عرض كل صفحة من صفحات الموقع , التعديل علي القوالب يمكننا من تغيير شكل اي صفحة من صفحات الموقع ما دمنا نعرف ملف القالب الخاص بها...

اين توجد القوالب ؟
نجد ملفات القوالب داخل مجلدات البرامج في المجلد templates
ايضا هناك نسخة منها في قاعدة البيانات .

لكن بما ان هناك نسختين ,,, اي منهما يتم استخدامها في عرض الصفحات ؟
الاجابة عن هذا السؤال ,,, اعتقد انك يمكنك ان تحدد ايهما يتم استخدامه من لوحة التحكم >> التعديلات العامة>>تحديث مجلد الثيمات بشكل تلقائي ؟ (( هذه المعلومة انا مش متأكد منها بالظبط ))
اختر نعم و سيتم اعتماد الشكل طبقا لملف القالب , اختر لا و سيتم اعتماد الشكل من القالب المخزن في قاعدة البيانات

لم افهم , تحديدا اين توجد القوالب التي تتحكم في تصميم الصفحات ؟؟
لو افترضنا انك تريد التعديل علي شكل الصفحة الرئيسية للمنتديات , ادخل الي المسار التالي
www/modules/newbb/templates/
ستجد ملفات قوالب html ,,, الملف newbb_index.html هو الملف الذي يتحكم في الصفحة الرئيسية
ايضا مثال اخر , الملف newbb_item.html يتحكم مثلا في شكل الموضوع الواحد .....و هكذا
هذه القوالب كتبها مبرمجوا البرنامج , و كان من الممكن اختيار اي اسماء لكن يتم الاتفاق عادة علي اختيار اسماء معبرة للتسهيل فيما بعد ...
ملحوظة : تم اعتماد اسلوب جديد في القوالب , بالاضافة لمجلد templates يمكنك ان تضع القوالب التي تم التعديل عليها في مجلد الثيم المستخدم.
مثال , القالب السابق بعد التعديل عليه ستضعه في الرابط التالي
www/themes/theme_name/modules/newbb/newbb_index.html
......

المكان الثاني الذي يتم وضع القوالب به هو قاعدة البيانات و للوصول لهذه القوالب ادخل الي لوحة التحكم >> قائمة البرامج>>لوحة التحكم العامة>>القوالب
و قد تم شرح هذا الموضوع في درس سابق في عرب زووبس بواسطة اخونا فوقا

ماذا احتاج لاستطيع التعديل علي القوالب وتغيير شكل احد الصفحات؟
1- تحتاج لخبرة بلغة html و لغة css , خبرة جيدة جدا , وان تكون ممارس جيد لها.
2- الصبر.و صفاء الزهن.
3- خبرة بسيطة بلغة smarty .
4- برنامج محرر نصوص , انصحك بشدة بالمحررات الاحترافية اليدوية مثل notepad++ حيث النوتة العادية لن تنفع لكبر احجام الاكواد , محررات صفحات الويب مثل frontpage يفضل الابتعاد عنها.
5- سيرفر محلي مركب عليه زووبس و البرنامج المراد تغيير صفحاته , ويجب ان يكون ممتلئ بالمقالات او المواضيع , انصح بشدة ان تكون واضع نسخة كاملة من موقعك .
6- برامج مساعدة مثل , برنامج صور كالفوتوشوب و برنامج مقارنة كـbeyond compare

فلنبدأ العمل ,,, تابع معي المثال التالي.
عمل تغيير بسيط في تصميم الصفحة الرئيسية للاخبار,
لو افترضنا انك قد استخدمت برنامج news كبرنامج للاخبار في موقعك

لو افترضنا انك تريد ان تغير في تصميم عرض الخبر , مثلا نريد ان نضع سهم بين القسم و الخبر
اخبار عامة >>>>ارتفاع عدد الاصابات.......الخ

اولا نجهز الصور التي نريدها - ان احتاجتها - و نرفعها الي المسار www/modules/news/images/
او اي مسار تريده

ثانيا نفتح المسار www/modules/news/templates/
سنجد قائمة بملفات القوالب
افتح ملف الصفحة الرئيسية و هو هنا news_index.html
و هذا هو الكود
اريد ان اذكرك قبل القراءة ان برنامج المقالات news به خيار يمكنك من تحديد عدد الاعمدة في الصفحة الرئيسية , انظر كيف سيتم تطبيق الخيار علي التصميم

<{if $topic_rssfeed_link != ""}>
<{$topic_rssfeed_link}>

<{/if}>

<{if $displaynav == true}>

<{$topic_select}>

<{/if}>

<{if $topic_description != ''}>

<{$topic_description}>

<{/if}>

<{$pagenav}>

<{section name=i loop=$columns}>

<{/section}>

<{foreach item=story from=$columns[i]}>
<{include file="db:news_item.html" story=$story}>
<{/foreach}>

<{$pagenav}>

<{include file='db:system_notification_select.html'}>

الان فهمنا من الكود السابق ان مربع المقال موجود في الملف news_item
افتح الملف news_item.html

<{$story.topic_title}> >>>> <{$story.news_title}>

<{if $story.files_attached}><{$story.attached_link}> <{/if}><{if $story.poster != ''}><{$lang_postedby}> <{$story.poster}><{/if}> <{$lang_on}> <{$story.posttime}> (<{$story.hits}> <{$lang_reads}>) <{$news_by_the_same_author_link}>

<{$story.imglink}>
<{if $articlePicture != ''}><{/if}>

<{$story.text}>

<{$story.adminlink}>

<{if $rates}><{$lang_ratingc}> <{$story.rating}> (<{$story.votes}>) - <{$lang_ratethisnews}> - <{/if}>
<{$story.morelink}>

من الشرح السابق اتضح ان
بسهولة تم وضع الاسهم >>> كما ترا

» ستايل منتدى أولاددراج الشفاف || مجاناً وبكل القوالب
» أفضل حملة تسويقية يمكن أن يحضى بها منتجك أو موقعك
» أفضل حملة تسويقية يمكن أن يحضى بها منتجك أو موقعك