در این بخش از آموزش طراحی پوسته برای وردپرس ، از فایل های مجزا برای ساخت قسمت های مختلف پوسته استفاده می کنیم، فایل های header.php ، footer.php و sidebar.php را ایجاد کرده و در صفحات پوسته آنها را فراخوانی می کنیم.
در مثال های قبلی برای فایل index.php از طرح زیر برای صفحه استفاده کردیم:
| هدر صفحه | |
| ستون کناری | بدنه صفحه |
| فوتر صفحه | |
همان طور که دیده می شود صفحه دارای چند بخش جداگانه است: عنوان سایت ، ستون کناری، بدنه صفحه و فوتر صفحه . از طرفی می دانیم در طراحی صفحات وب سعی می شود، تمام صفحات دارای چیدمان و ظاهر مشابه و یکنواخت باشند. وتنها بدنه صفحه متفاوت است درحالی که دیگر قسمت های صفحه ثابت و بدون تغییر می ماند.
در طراحی اکثر وب سایت ها و همچنین وردپرس قسمت های ثابت صفحات را در فایل های جداگانه طراحی کرده و برای نمایش هر صفحه این قسمت ها را مثل قطعات یک پازل، کنارهم قرار می دهند تا صفحه کامل شود.
در وردپرس برای این کار استانداردی تعیین شده که باید فایل های زیر را استفاده کنیم:
- فایل header.php حاوی طراحی قسمت هدر صفحه
- فایل footer.php حاوی طراحی قسمت فوتر صفحه
- فایل sidebar.php حاوی طراحی بخش ستون کاری صفحه
و برای طراحی صفحه از فایل هایی با اسامی تعیین شده بصورت زیر استفاده می کنیم:
| header.php | |
| sidebar.php | بدنه صفحه |
| footer.php | |
برای استفاده از این تقسیم بندی، سه فایل خالی با اسامی فوق ایجاد کرده و فایل index.php طراحی شده در جلسات قبل را بصورت زیر تقسیم می کنیم:
محتوای فایل header.php :
<html>
<head>
<meta charset="utf-8" />
<title>Untitled Document</title>
<style>
th , td{
direction:rtl;
font-family:tahoma;
vertical-align:top;
}
</style>
</head>
<body>
<table width="1000" align="center" border="1" dir="rtl">
<tr>
<td colspan="2">
<h1> <?php bloginfo('name'); ?> </h1>
<h4> <?php bloginfo('description'); ?> </h4>
</td>
</tr>
محتوای فایل sidebar.php :
<?php wp_list_categories('title_li=&sort_column=menu_order'); ?>
محتوای فایل footer.php :
<td colspan=”2″>
طراحی شده توسط webaca.ir
</td>
</tr>
</table>
<?php wp_footer(); ?>
</body>
</html>
تابع wp_footer باعث می شود تا در صورت ورود به پانل مدیریتی ورد پرس در بالای صفحات سایت نوار مشکی رنگ مدیریت را نماش دهد.
با داشتن فایل های فوق طراحی فایل index.php بصورت زیر درخواهد آمد:
<?php get_header(); ?>
<tr>
<td width="200">
<?php get_sidebar(); ?>
</td>
<td >
<?php while ( have_posts() ) : the_post(); ?>
<h2>
<a href=" <?php the_permalink(); ?>">
<?php the_title(); ?>
</a>
</h2>
<p> <?php the_excerpt(); ?></p>
<?php endwhile; ?>
</td>
</tr>
<?php get_footer(); ?>
- تابع get_header برای ضمیمه کردن فایل php استفاده می شود.
- تابع get_sidebar برای ضمیمه کردن فایل php استفاده می شود.
- تابع get_footer برای ضمیمه کردن فایل php استفاده می شود.
استفاده از فایل های مجزا برای طراحی قسمت های مختلف صفحات باعث می شود تا اولاً یکبار این سه فایل را طراحی می کنیم و به دفعات در صفحات مختلف پوسته استفاده خواهیم کرد. ثانیاً با تغییر هر کدام از این سه فایل ، تغییرات آناً در تمام صفحات پوسته دیده خواهند شد، بعنوان مثال برای طراحی صفحه single.php از این توابع استفاده خواهیم کرد.