هنگام نوشتن یک کامپوننت برای جوملا، بسیار اتفاق می افتد که نیاز داشته باشیم فایل css نیز به پروژه اضافه کنیم. البته می توان کدهای css را در فایل css قالب نیز نوشت ولی اگر ظاهر خاصی را برای اینترفیس کامپوننت در نظر گرفته باشیم و بخواهیم با تغییر قالب اصلی جوملا مشکلی در ظاهر برنامه ما ایجاد نشود باید بتوانیم کدهای css را در یک فایل ذخیره کرده و به کامپوننت اضافه کنیم تا هنگام اجرا روی قالب های مختلف، ظاهر برنامه ما حفظ شود. البته پس از تغییر قالب یک  سایت جوملایی، اصلاح css هر چند در موارد جزئی برای کامپوننت ها و ماژول های مختلف نصب شده روی سایت، امری اجتناب ناپذیر است.

کدهای css مورد نظرمان را در یک فایل با عنوان stylesheet.css قرار داده و آن را در مسیر زیر ذخیره می کنیم.

[joomla_root_directory]/media/[com_example]/css/stylesheet.css

[joomla_root_directory] = مسیر نصب جوملا (مثلا: c:\wamp\www\joomla)

[com_example] = نام کامپوننت ما

یک روش معمول برای افزودن فایل stylesheet.css به کامپوننت، نوشتن متد مورد نظر در فایل helper و سپس صدا زدن آن در فایل اصلی کامپوننت (یعنی فایل enterance) است. به این ترتیب فایل css در تمام صفحات کامپوننت بارگذاری خواهد شد. ما فایل stylesheet.css را در مسیر media جوملا ذخیره کردیم تا به راحتی کد مربوط به فراخوانی متد مذکور را بتوانیم هم در سمت backend و هم frontend استفاده کنیم و فایل استایل شیت ما در هر دو سمت بارگذاری شود. 

ویرایش فایل helper موجود در مسیر زیر:

[joomla_root_directory]/administrator/components/[com_example]/helpers/example.php

 

example.php

<?php
defined('_JEXEC') or die;
class ExampleHelper
{
	// todo other codes here
	public static function addStyleSheet()
	{
		$document = JFactory::getDocument();
		$document->addStyleSheet(JUri::root() . 'media/com_example/css/stylesheet.css');
	}
	// todo other codes here
}

در کد فوق ابتدا شیئ JDocument را در یک متغیر ذخیره کرده ایم سپس متد addStyleSheet شیئ JDocument را فراخوانی کرده ایم. و مسیر فایل استایل شیت را به عنوان پارامتر به این متد ارسال کرده ایم. 

عبارت JUri::root() ، متد استاتیک root() از کلاس JUri را اجرا می کند که خروجی آن رشته ای است که مسیر وب سایت جوملایی ما را نشان می دهد. یعنی:

http://sitename.com/joomla_directory/

حالا باید متد addStyleSheet را در جایی از کامپوننت com_example فراخوانی کنیم که در تمام صفحات ما اجرا شود بهترین جا برای فراخوانی آن فایل enterance است زیرا این فایل همانطور که از نام آن پیداست، در تمام صفحات کامپوننت ما اجرا می شود. فایل enterance همان فایل ورودی کامپوننت است که هم نام با نام کامپوننت ولی بدون پیشوند com_ در پوشه اصلی کامپوننت قرار می گیرد.

به عنوان مثال فایل enterance کامپوننت فرضی com_example در مسیرهای زیر است:

Backend:

[joomla_root_directory]/administrator/components/[com_example]/example.php

Frontend:

[joomla_root_directory]/components/[com_example]/example.php

 

ویرایش فایل enterance سمت Frontend :

[joomla_root_directory]/components/[com_example]/example.php

example.php

<?php
defined('_JEXEC') or die;
// todo other codes here
JLoader::register('ExampleHelper', JPATH_ADMINISTRATOR . '/components/com_example/helpers/example.php');
ExampleHelper::addStyleSheet();
$controller = JControllerLegacy::getInstance('Example');
$controller->execute(JFactory::getApplication()->input->getCmd('task'));
// todo other codes here
// Redirect by the controller
$controller->redirect();

کد هایلایت شده فوق را می توانیم در فایل ورودی کامپوننت در سمت Backend نیز قرار دهیم تا فایل استایل شیت در سمت Backend نیز بارگذاری شود.

خب حالا لازم است تست کنیم تا مطمئن شویم فایل css مورد نظر ما بارگذاری می شود.

فرض کنیم کامپوننت com_example را روی یک سایت جوملایی در لوکال هاست در آدرس زیر نصب کرده ایم:

http://localhost/joomla

 

برای تست، آدرس زیر را در نوار آدرس مرورگر کروم تایپ کنید:

Frontend:

http://localhost/joomla/index.php?option=com_example

 

Backend:

http://localhost/joomla/administrator/index.php?option=com_example

 

در مرورگر کروم ، گزینه View Page Source را از منوی کلیک سمت راست انتخاب کنید و یا از کلیدهای میانبر Ctrl + U استفاده کنید.

جایی بین دو تگ باز و بسته شدن <head></head> باید عبارت زیر را مشاهده کنید:

<html>
<head>
...
<link rel="stylesheet" href="http://localhost/joomla/media/com_example/css/stylesheet.css" 
type="text/css" />
...
</head>
<body>
...
</body>
</html>

 

اگر این اتفاق نیافتاد، یک بار دیگر با دقت مطلب فوق را مطالعه کرده و انجام دهید.

نوشتن دیدگاه

دوست عزیزم، سوالاتی که فینگلیش تایپ شود، شاید منتشر شود ولی پاسخ داده نخواهد شد!


تصویر امنیتی
تصویر امنیتی جدید

  • عابدینی 1394-10-03 19:21
    عالی بود سپاس

    ادامه مطلب ...

     
  • هادی پورعباس 1394-06-29 20:44
    شروین عزیز، کدی که گذاشتی خیلی مختصر هست به طوری که من اصلا متوجه نشدم مشکلت چی هست. درسته که وردپرس با پی اچ پی نوشته شده ولی برای خودش فریموورکی داره ...

    ادامه مطلب ...

     
  • shervin 1394-06-29 20:05
    سلام برای اینکه بتونم دسترسی اسان تری به یوزرهای خودم بدم از توابع php در فانکشن وردپرس استفاده کردم و در دسترسی و فراخوانی متن ها کاملا" موفق بودم ...

    ادامه مطلب ...

     
  • هادی پورعباس 1393-11-07 15:39
    جناب رادپور، قسمت 2 آموزش php رو در سایت قرار دادم. آموزش php - قسمت 2 - راه اندازی وب سرور ...

    ادامه مطلب ...

     
  • هادی پورعباس 1393-11-07 13:29
    با سلام به شما. خانم سرمدی، سوالی پرسیدید که جواب دقیقی نداره. افراد از هوش و علاقه و استعداد متفاوتی برخوردارند من نمی تونم بگم چقدر طول میکشه شما php ...

    ادامه مطلب ...

کد نام کالا قیمت (تومان)
مجموع 0