خیلی از دوستان علاقه مند به طراحی قالب جوملا هستند ، اما وقتی فایل یکی از قالب های جوملا را باز می کنند با یک سری کد های php و html نام مفهوم آشنا می شوند. ما در این مطلب سعی داریم تا شما را با کد های جوملا آشنا کنیم بهمین منظور ابتدا توضیحاتی راجع به فایل ها و سیپس راجع به کد ها برای شما عنوان میکنیم که امیدواریم بدرد شما هم بخورد:
قالب جوملا از چند بخش تشکیل شده است »
1- فایل های php
2- فایل های css
3- فایل های جاوا اسکریپت
4- تصاویر
5- فایل های کمکی ini , xml ,png ,html ,ico
فایل های php که اصلی ترین آن فایل index.php می باشد همان ظاهر کلی را طراحی می کند ، برای جزئیات شما میتوانید فایل مربوط به هر قسمت را در پوشه html بارگذاری کنید ، نمونه این فایلها به همراه برنامه های جوملا در پوشه های component و modules قرار دارند که می توان برای هر قالب سفارشی نمود ، البته اگر پوشه html خالی باشد جوملا از ظاهر پیش فرض خود استفاده می کند.
فایل های css فایل های چینش و رنگ بندی سایت را تشکیل می دهند اصلی ترین فایل این قسمت template_css.css یا template.css می باشد ، بهتر است تمامی کدهای مربوط به چینش و رنگ بندی در این فایل ها قرار گیرد ، اینطوری دیگر برای یافتن یک کد گیچ نمی شوید.برای صدا زدن فایل css باید از کد زیر در قالب استفاده شود :
| <link href="/<?php echo $this->baseurl ?>/templates/template_name/css/template_css.css" rel="stylesheet" type="text/css" /> |
فایل های جاوا اسکریپت بیشتر برای ایجاد افکت های زیبا در سایت کاربرد دارد ، کتابخانه این فایل ها در جوملا قرار دارد و شما نیازی به فراخوانی مجدد آنها ندارید. برای صدا زدن فایل های javascript باید از کد زیر در قالب استفاده کنید:
| <script type="text/javascript" src="/<?php echo $this->baseurl ?>/templates/template_name/js/java_file_name.js"></script> |
فایل های تصویری زیباترین بخش قالب را به خود اختصاص می دهند ، فرمت این تصاویر باید jpg , gif , png و برای انیمیشن ها swf باشد .برای صدا زدن تصاویر از کد زیر استفاده می شود:
| <img border="0" src="/<?php echo $this->baseurl ?>/templates/template_name/images/image_file_name.png" title="No Image" /> |
فایل های کمکی فایل هایی هستند که برای هسته جوملا استفاده می شود و سیستم برای شناسایی قالب با آنها کار دارد، مثلا params.iniبرای نگهداری اطلاعات ذخیره شده در بخش ویرایش قالب در مدیریت جوملا کاربرد دارد ، شما میتوانید در فایل xml اصلی قالب خود پارامترهایی را صدا بزنید و نتیجه را در فایل params.iniذخیره کنید
فایل templateDetails.xmlفایل نصاب و کنترل کننده جوملا می باشد ، این فایل دارای فرمت زیر است :
| <?xml version="1.0" encoding="utf-8"?> <!DOCTYPE install PUBLIC "-//National CMS 1.5//DTD template 1.0//EN" "http://www.mitra.ir/xml/1.5/template-install.dtd"> <install version="1.5" type="template"> |
این قسمت اطلاعات اولیه برای شناسایی فایل توسط جوملا قرار دارد |
| <name>template_name</name> | نام قالب شما در این بخش می باشد |
| <creationDate>11/20/06</creationDate> <author>R.Balvardi</author> <authorEmail> <authorUrl>http://www.mitratemplate.com</authorUrl> <copyright></copyright> <license>GNU/GPL</license> <version>1.0.2</version> <description>Software company and IT technology template with multi lingual and page direction support</description> |
این بخش به اطلاعات عمومی راجع به قالب شما اختصاص دارد، شامل تاریخ ایجاد ، قوانین دسترسی ، طراح و اطلاعات تماس و ... |
| <files> <filename>index.php</filename> <filename>templateDetails.xml</filename> <filename>template_thumbnail.png</filename> <filename>params.ini</filename> </files> |
این قسمت مربوط به نصاب است ، هر فایل که در اینجا عنوان شود توسط جوملا به سایت هنگام نصب منتقل می شود. |
| <positions> <position>left</position> <position>right</position> <position>top</position> <position>user1</position> <position>user2</position> <position>user3</position> <position>user4</position> <position>banner</position> <position>footer</position> </positions> |
این قسمت موقعیت قرار گیری ماژول ها در قالب عنوان می شود ، جوملا میتواند در هر یک از این موقعیت ها یک یا چند ماژول را قرار دهد. |
| <params> <param type="spacer" default="Template Logo" /> <param name="logoType" type="list" default="image" label="Logo type" description="LOGO TYPE DESCRIPTION"> <option value="image">Image</option> <option value="text">Text</option> </param> <param name="logoText" type="text" default="" size="50" label="Logo text" description="LOGO TEXT DESCRIPTION" /> <param name="sloganText" type="text" default="" size="50" label="Slogan" description="SLOGAN DESCRIPTION" /> </params> |
این قسمت میتوانید پارامترهای قالب را تعریف کنید ، مثلا در قالب های چند رنگی میتوان رنگ را به عنوان پارامتر تعریف کرد. |
| <languages> <language tag="en-GB">en-GB.lang_file.ini</language> </languages> <administration> <languages> <language tag="en-GB">admin/en-GB.lang_file.ini</language> </languages> </administration> |
میتوانید برای اصطلاحات بکار رفته در قالب خود از فایل زبان نیز استفاده کنید تا جوملا بتواند با تغییر زبان این عنوان را نیز تغییر دهد |
| </install> | این کد انتهایی فایل است که فایل را می بندد |
آشنایی با کدهای قرار گرفته در فایل index.php قالب جوملا:
| <?php defined( '_JEXEC' ) or die( 'Restricted access' ); ?> |
کد محافظت در مقابل سوء استفاده هکرها در قالب : این کد جلوی اجرای مستقیم فایل قالب را میگیرد و به هکر ها اجازه رویت محتوای قالب را بصورت مستقیم نمی دهد. |
| <jdoc:include type="head" /> | این کد پیشانی یا معرفی نامه سایت شما را نمایش میدهد. |
| <jdoc:include type="modules" name="left" style="xhtml" /> | آموزش کد های قالب جوملا 1- آشنایی با کد ماژول : کد ماژول کدی است که به شما اجازه نمایش ماژول های نصبی در بخش مدیریت را می دهد ، شما میتوانید با تغییر style ساختار ماژول را عوض کنید استایل های مجاز این ها هستند : none,xhtml,rounded با زدن دستور index.php?tp=1 جلوی هر سایت جوملایی میتوانی این موقعیت ها را ببینید. |
| <?php echo $this->baseurl ?> | کد مسیر سایت : این کد به طراح اجازه میدهد که خروجی قالب سایت را دارای آدرس کند ، به عنوان مثال به جای این شیوه آدرس دهی images/artocle.jpg این آدرس تولید میشود :http://www.yoursitename.com/images/article.jpg |
| <?php if($this->countModules('top')) : ?> <?php else: ?> <?php endif; ?> |
در صورتی که علاقه دارید ماژول های خالی نمایش داده نشوند از کد زیر استفاده کنید : قسمت اول : <?php if($this->countModules('top')) : ?> ، قسمت دوم : <?php endif; ?> هر چه در بین این دو کد قرار گیرد در صورت خالی بودن موقعیت top مخفی میشود ، البته میتوانید از دستور <?php else: ?> ما بین این دو کد نیز استفاده کنید. |
| <?php echo $this->language; ?> | کد تشخیص زبان : برای تشخیص و استفاده از نام زبان در طراحی ، مثال برای دو زبانه کردن یک قالب این کد کاربرد دارد ، میتوانید فایل های هر زبان را در پوشه ای مجزا قرار داده و با این کد صدا برنید. |
| <?php if($this->direction == 'rtl') : ?> <?php endif; ?> |
کد برای زبان فارسی : داخل این 2 تا کد هر چی قرار بگیره وقتی زبان فارسی باشه لود میشه |
| <?php echo JText::_('Powered by') ?> | کد لایسنس برای فوتر : |
| <jdoc:include type="message" /> |
کد نمایش پیغام های سایت : این کد برای نمایش پیغام های جوملا استفاده میشود
|
| <jdoc:include type="component" /> | کد نمایش محتوا : این کد محتوای صفحه را نمایش می دهد |