ایجاد فایل index.php

صفحه index.php قالب‌های جوملا صفحه اصلی قالب‌های جوملاست . در صورتی که شما مسلط به HTML باشید می‌توانید این صفحه را همانند یک صفحه HTML معمولی ایجاد کنید فقط باید در بعضی از قسمت‌های آن یکسری کدهای PHP اضافه کنید. که در این مقاله به تفضیل به آنها خواهیم پرداخت.

صفحه ساختار ساده (بدون استایل) قالب جوملا می‌باشد.

صفحه index.php جوملا ۱٫۵ با کدهای php زیر شروع میشود.

<?php defined( ‘_JEXEC’ ) or die( ‘Restricted access’ );?>
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN”
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”
xml:lang=”<?php echo $this->language; ?>” lang=”<?php echo $this->language; ?>” >

کد خط اول برای مسائل امنیتی جوملا ست و برای جلوی گیری از دسترسی غیر مجاز است.

خط بعدی Document Type Declaration(DOCTYPE) که اطلاعاتی راجع به این صفحه وب به Web Crawlerها(خزنده‌های موتورهای جستجو) ارائه می‌کند.

خط سوم هم به صفحه index.php قالب می‌گوید که مدیر سایت چه زبانی را برای نمایش سایت (در جوملا اصطلاحا front-end میگوییم) مشخص کرده است.

همانطور که میدانید یک صفحه HTML به دو قست تقسیم میشود (head و body) بخش head شامل اطلاعاتی درخصوص منابعی که در این قالب جوملا می‌خواهیم از آن استفاده کنیم است در واقع از این قسمت باید آن منابع را به قالب لینک کنیم.

بخش body شامل کدهای لایه مختلف ساختار قسمت‌های مختلف قالب است .
کد php مربوط بخش head صفحه index.php قالب

برای قالب‌هایی که از یک زبان استفاده میکنند (فارسی یا انگلیسی) از این کد استفاده می‌کنیم.

<head>
<jdoc:include type=”head” />
<link rel=”stylesheet” href=”<?php echo $this->baseurl ?>/templates/system/css/system.css” type=”text/css” />
<link rel=”stylesheet” href=”<?php echo $this->baseurl ?>/templates/system/css/general.css” type=”text/css” />
<link rel=”stylesheet” href=”<?php echo $this->baseurl ?>/templates/<?php echo $this->template; ?>/css/template.css” type=”text/css” />
</head>

برای قالب‌های که از ۲ زبان مختلف که یکی از آنها از راست به چپ است مثل فارسی ودیگری از چپ به راست است مثل انگلیسی (RTL یا LTR) استفاده می‌کنند این کد را می‌نویسیم:

نکته: دقت کنید زبان فارسی و عربی چون هردو RTL هستند از نوع اول استفاده می‌کنیم.

<head>
<jdoc:include type=”head” />
<link rel=”stylesheet” href=”<?php echo $this->baseurl ?>/templates/system/css/system.css” type=”text/css” />
<link rel=”stylesheet” href=”<?php echo $this->baseurl ?>/templates/system/css/general.css” type=”text/css” />
<?php if($this->direction == ‘rtl’) : ?>
<link href=”<?php echo $this->baseurl ?>/templates/<?php echo $this->template; ?>/css/template_rtl.css” rel=”stylesheet” type=”text/css” />
<?php else: ?>
<link rel=”stylesheet” href=”<?php echo $this->baseurl ?>/templates/<?php echo $this->template; ?>/css/template.css” type=”text/css” />
<?php endif; ?>
</head>

خط

<jdoc:include type=”head” />

اطلاعات مربوط به header را در قالب‌های جوملا قرار می‌دهد شامل اطلاعات متا و عنوان صفحه و …

کدهای

<link rel=”stylesheet” href=”<?php echo $this->baseurl ?>/templates/system/css/system.css” type=”text/css” />
<link rel=”stylesheet” href=”<?php echo $this->baseurl ?>/templates/system/css/general.css” type=”text/css” />

برای اضافه کردن ۲تا فایل css ای که تمام قالب‌های جوملا ۱٫۵ از آنها استفاده میکنند.
کدهای php برای قسمت body فایل index.phpقالب

<body>
<jdoc:include type=”modules” name=”top” />
<jdoc:include type=”component” />
<jdoc:include type=”modules” name=”bottom” />
</body>
در این حالت ما ۲ position به نام‌های top و bottom داریم و یک موقعیت برای نمایش مطالب و سایر componentها داریم.

دستور jdoc به جوملا می‌گوید که از سیستم مدیریت محتوا جوملا یکسری منابع را فراخوانی (include) کند. Type مشخص کننده نوع آن منابع است دقت کنید که در اینجا type هم modules و هم component استفاده شده است. جهت کسب اطلاعات بیشتر در این زمینه به مقاله ‏دستورات jdoc مراجعه فرمایید.

وقتی در یک قسمت از فایل index.php می‌نویسیم:

<jdoc:include type=”modules” name=”top” />

یعنی در آن قسمت از قالب یک position به نام top ایجاد کن. به جای top هر اسم دیگری می‌تواند باشد ولی به این نکته توجه داشته باشید که قبلا این نام را در فایل templateDetails.xml به عنوان position مشخص کرده باشیم.

هنگامی در یک قسمت از فایل index.php قالب می‌نویسیم:

<jdoc:include type=”component” />

یعنی آن قسمت مکان کلیه مطالب (مقاله‌ها و مطالبی که در مدیریت مطالب ایجاد می‌شوند.) و کامپوننت‌های جوملا است. نوشتن این کد برای فایل index.php خیلی مهم است. شما می‌توانید ماژول‌های بیشتری در templateDetails.xml معرفی کرده و در صفحه index.php ایجاد نمایید. و در نهایت بستن تگ html به این صورت

</html>

انجام می‌شود.

در نهایت کد صفحه index.php قالب جوملا ۱٫۵ ما به این صورت شد:

<?php defined( ‘_JEXEC’ ) or die( ‘Restricted access’ );?>
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN”
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”
xml:lang=”<?php echo $this->language; ?>” lang=”<?php echo $this->language; ?>” >
<head>
<jdoc:include type=”head” />
<link rel=”stylesheet” href=”<?php echo $this->baseurl ?>/templates/mynewtemplate/css/template.css” type=”text/css” />
</head>
<body>
<jdoc:include type=”modules” name=”top” />
<jdoc:include type=”component” />
<jdoc:include type=”modules” name=”bottom” />
</body>
</html>

در جوملا ۱٫۵ ما می‌توانیم کل پوشه mynewtemplate با تمام فایل‌ها و ساب فولدرها در پوشه templates جوملا آپلود کنیم یا آن را zip کنیم و از مدیریت جوملا در قسمت نصب و حذف اقدام به نصب این قالب کنیم.

بعد از نصب یا آپلود قالب باید به قسمت مدیریت قالب‌ها برویم قالب mynewtemplate بر پیش فرض قرار دهیم.