طراحی قالب وردپرس – قسمت دوم
یک قالب وردپرس از صفحات زیر تشکیل شده :
Index.php : قالب صفحه اصلی
Header.php : کدهای سرصفحه در این فایل قرار می گیرند.
Footer.php : کدهای پاصفحه در این فایل قرار می گیرند.
Sidebar.php : کدهای ستون کناری در این فایل قرار می گیرند.
single.php : قالب مطالب.
Comments.php : قالب نظرات.
Search.php : قالب صفحه نتایج جستجو.
Functions.php : توابع پوسته، دراصل با استفاده از این فایل می توان امکانات بیشتری برای پوسته ایجاد کرد. که پر استفاده ترین امکان نیز ، پشتیبانی از ابزارک هاست.
404.php : قالب صفحه خطای 404
حال باید از قالب index.php کد های هر بخش را برداشته و فایل های فوق را ایجاد و در آنها قرار دهیم.
مثلا کد زیر مربوط به فایل header.php هست که باید از فایل index .php برداشته میشود و به جای کد
<!doctype html>
<html >
<head>
<meta charset="UTF-8">
<title> </title>
<meta name="description" content="">
<meta name="author" content="">
<!-- Mobile Specific Meta -->
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<!-- Stylesheets -->
<link rel="stylesheet" href="<?php bloginfo('template_directory');?>/assets/css/bootstrap.min.css" media="screen">
<link rel="stylesheet" href="<?php bloginfo('template_directory');?>/assets/css/bootstrap-responsive.min.css" media="screen">
<link rel="stylesheet" href="<?php bloginfo('template_directory');?>/assets/css/style.css" >
</head>
<body>
<div class="container ">
<header>
<div class="row ">
<div class="span12">
<div class="header"> </div>
<div class="breadcrump">
<nav>
</nav>
</div>
</div>
</div>
</header>
<!-- site head end -->
کد زیر را قرار میدهیم ( این کد در واقع فایل header.php را به index.php لینک میکند )
<?php get_header(); ?>
برای بخش footer.php و sidebar.php همین کار را میکنیم.
و از دو تابع
<?php get_sidebar(); ?>
<?php get_footer(); ?>
استفاده میکنیم .
تا اینجای پروژه را از لینک زیر دانلود کنید
—————————————-
نکته : به کمک دستور زیر مسیر فایل های css و jquery و .. را به رودپرس میدهیم.
<?php bloginfo('template_directory');?>