روح الله بلوردی هستم متولد 1357  ، فعالیت خود را در زمینه طراحی از دوره دبیرستان و با هنر نقاشی ، خوشنویسی و گرافیک شروع کردم بعد از آمدن به تهران در سال 76 و آشنایی با دوستان موسسه سبوح به گرافیک رایانه ای علاقه مند شدم و از سال 78 اولین آثار خود را با نرم افزار کورل فتو پینت و کورل دراو شروع کردم. هم اکنون نیز در رشته گرافیک در دانشگاه علمی کاربردی بندرعباس مشغول به تحصیل گرافیک هستم.

r.balvardi@gmail.com

دریافت نمونه کارها


خیلی از دوستان علاقه مند به طراحی قالب جوملا هستند ، اما وقتی فایل یکی از قالب های جوملا را باز می کنند با یک سری کد های 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> این آدرس ایمیل توسط spambots حفاظت می شود. برای دیدن شما نیاز به جاوا اسکریپت دارید</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" /> کد نمایش محتوا : این کد محتوای صفحه را نمایش می دهد

 

 

 

تماس با ما

در صورت علاقه میتوانید نظرات یا انتقادات و پیشنهادات یا سفارش کار خود را برای من ارسال کنید.

پیام
پیام شما ارسال شد.

قالب های جدید فروشگاه دیما

Template Design:Dima Group