طراحی وب سایت کتابخانه

طراحی وب سایت کتابخانه

۱۲ مطلب با موضوع «جوملا» ثبت شده است

مطالب این قسمت برای نسخه 3.x جوملا نوشته شده است. 

ساختار پلاگین برای نسخه 1.5 جوملا بسیار انعطاف پذیر و قدرتمند بود. پلاگین ها فقط برای این ساخته نشده اند که رخدادهایی که توسط توسعه ها و برنامه های کاربردی هسته موجود در جوملا راه اندازی شده اند را شناسایی کنند و بر اساس آنها کاری را انجام دهند، بلکه از پلاگین ها می توانیم برای این استفاده کنیم که توسعه هایی که توسط یک شخص ثالث ایجاد شده اند را توسعه پذیر تر و قدرتمند تر کنیم. مهم ترین تغییری که در طراحی پلاگین ها در جوملای 2.5/3.x نسبت به جوملای 1.5 بوجود آمده است، تغییراتی است که در مورد نام رخدادها(events) بوجود آمده است.

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

ایجاد یک فایل نصب (Installation File)

مثل بقیه توسعه هایی که در جوملا وجود دارند، پلاگین ها هم به صورت یک فایل زیپ، بسته بندی می شوند تا جوملا بتواند آنها را به راحتی نصب کند. در این بسته باید یک فایل XML وجود داشته باشد که به درستی نیز ساختار دهی شده باشد. به عنوان مثال در زیر فایل XML نصب پلاگین گروه های موضوعی (categories) را مشاهده کنید:

<?xml version="1.0" encoding="utf-8"?>
<extension version="3.1" type="plugin" group="search">
	<name>plg_search_categories</name>
	<author>Joomla! Project</author>
	<creationDate>November 2005</creationDate>
	<copyright>Copyright (C) 2005 - 2013 Open Source Matters. All rights reserved.</copyright>
	<license>GNU General Public License version 2 or later; see LICENSE.txt</license>
	<authorEmail>admin@joomla.org</authorEmail>
	<authorUrl>www.joomla.org</authorUrl>
	<version>3.1.0</version>
	<description>PLG_SEARCH_CATEGORIES_XML_DESCRIPTION</description>
	<files>
		<filename plugin="categories">categories.php</filename>
		<filename>index.html</filename>
	</files>
	<languages>
		<language tag="en-GB">en-GB.plg_search_categories.ini</language>
		<language tag="en-GB">en-GB.plg_search_categories.sys.ini</language>
	</languages>
	<config>
		<fields name="params">

			<fieldset name="basic">
				<field name="search_limit" type="text"
					default="50"
					description="JFIELD_PLG_SEARCH_SEARCHLIMIT_DESC"
					label="JFIELD_PLG_SEARCH_SEARCHLIMIT_LABEL"
					size="5"
				/>

				<field name="search_content" type="radio"
					default="0"
					description="JFIELD_PLG_SEARCH_ALL_DESC"
					label="JFIELD_PLG_SEARCH_ALL_LABEL"
				>
					<option value="0">JOFF</option>
					<option value="1">JON</option>
				</field>

				<field name="search_archived" type="radio"
					default="0"
					description="JFIELD_PLG_SEARCH_ARCHIVED_DESC"
					label="JFIELD_PLG_SEARCH_ARCHIVED_LABEL"
				>
					<option value="0">JOFF</option>
					<option value="1">JON</option>
				</field>
			</fieldset>

		</fields>
	</config>
</extension>
  

همانطور که می بینید، ساختار این فایل XML مثل سایر فایل های نصب جوملا (از نوع XML) است. در تگ extension یک ویژگی با نام group وجود دارد که در این فایل با مقدار search مشخص شده است. در داخل تگ filename نیز یک ویژگی با نام plugin وجود دارد که با categories مقدار دهی شده است. این اطلاعات به جوملا می گوید که محتویات این بسته را در داخل کدام پوشه قرار دهد و مشخص می کند که پلاگین مربوط به کدام گروه است.
اگر شما در حال ایجاد یک پلاگین هستید که به رخدادهای هسته موجود در جوملا پاسخ می دهد، باید ویژگی group را بر اساس نام پوشه پلاگین موجود برای نوع رخداد مقدار دهی کنید. مثلا group="authentication" یا group="user".
در مورد مقدار اول، مشخص می کند که پلاگین در گروه authentication قرار دارد و در مورد مقدرا دوم، مشخص می کند که در گروه user قرار دارد.

در واقع اگر در آدرسی که جوملا را نصب کرده اید (بر روی کامپیوتر محلی یا بر روی سروری که جوملا نصب شده است) پوشه plugins را مشاهده کنید، می توانید رخدادهایی که به صورت پیش فرض در جوملا وجود دارند را ببینید:

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

نکته: اگر شما در تگ extension متد method="upgrade" را قرار دهید، این پلاگین بدون اینکه نسخه قبلی حذف شود، نصب خواهد شد. فقط فایل های جدید بر روی تمام فایل های موجود نوشته می شوند، اما فایل های قدیم پاک نمی شوند.

ایجاد یک پلاگین

در جوملا برای نوشتن یک پلاگین از شیوه شی گرا استفاده می شود. برای این کار باید یک زیر کلاس از کلاس JPlugin ایجاد کنیم. کلاس JPlugin یک کلاس پایه است که ویژگی های پایه مربوط به پلاگین ها را پیاده سازی می کند. شما در این کلاس در متدهای خود، به ویژگی های زیر دسترسی دارید:

  • $this->params:
  • پارامترهایی است که از طرف مدیر برای این پلاگین تعریف شده اند.
  • $this->_name:
  • نام پلاگین.
  • $this->_type:
  • گروه (نوع) مربوط به پلاگین.
  • $this->db:
  • شی db (از نسخه 3.1 به بعد)
  • $this->app:
  • شی برنامه کاربردی (application) (از نسخه 3.1 به بعد)

نکته: برای استفاده از $this->db و $this->app، کلاس JPlugin بررسی می کند که آیا این ویژگی وجود داشته باشد و خصوصی (private) نباشد. اگر تمایل دارید اشیاء پیش فرض استفاده شوند، یک نمونه معرفی نشده از ویژگی را در کلاس پلاگین ایجاد کنید (مثلا در همان محیطی که این خط قرار دارد: protected $autoloadLanguage = true; از اینها protected $db; و protected $app; استفاده کنید). این ویژگی ها تا زمانی که آنها را به وضوح ایجاد نکنید، وجود نخواهند داشت.
در مثال زیر، lt;PluginGroup> مشخص کننده گروه (نوع) در پلاگین است، و <PluginName> نام آن را مشخص می کند. یعنی ابتدا plg را می آوریم، سپس نام گروه (نوع) و بعد از آن نام پلاگین. به این نکته توجه داشته باشد که نام های کلاس ها و توابع، در پی اچ پی نسبت به بزرگی و کوچکی حروف حساس هستند.

()
	 {
		/*
		 * Plugin code goes here.
		 * You can access database and application objects and parameters via $this->db,
		 * $this->app and $this->params respectively
		 */
		return true;
	}
}
?>

استفاده از پلاگین ها در داخل کد

حالا که پلاگین ساده اولیه خودمان را ساختیم، ممکن است بخواهید پلاگین را در داخل کدهای خود فراخوانی کنید. البته می توانید این کار را نکنید: در هسته جوملا تعدادی رخدادهای درونی وجود دارد که ممکن است بخواهید پلاگین شما برای آن رخدادها ثبت شود. در این حالت دیگر لازم نیست شما کارهای زیر را انجام دهید.
اگر بخواهید یک رخداد را آغاز کنید باید کدی مثل کد زیر بنویسید:

$dispatcher = JDispatcher::getInstance();
$results = $dispatcher->trigger( '<EventName>', <ParameterArray> );

باید به این نکته توجه داشته باشید که پارامترها باید به صورت آرایه باشند. تابع پلاگین، خودش پارامترها را به صورت مقادیر مجزا دریافت می کند. مقدار برگشتی شامل آرایه ای از مقادیر برگشتی از پلاگین های مختلف است (بنابراین می تواند شامل آرایه های چند سطحی نیز باشد).
اگر می خواهید یک پلاگین برای یک رخداد جدید که جزء رخدادهای هسته جوملا نیستند ایجاد کنید، حتما پلاگین خود را بعد از نصب کردن فعال کنید. قبل از هر ارجاع به پلاگین جدید خود، از دستور JPluginHelper::importPlugin() استفاده کنید.

۱ نظر موافقین ۲ مخالفین ۰ ۱۹ مرداد ۹۶ ، ۱۲:۳۰
مهرداد یوسفی فرد

پلاگین ها هم یکی دیگر از توسعه های (Extension) جوملا هستند. پلاگین ها توابعی هستند که با رخدادهای خاص مرتبط شده اند. در جوملا به صورت پیش فرض مجموعه ای از رخدادهای پلاگین وجود دارند، اما هر توسعه می تواند باعث ایجاد یک رخداد شخصی شود. هنگامی که یک رخداد خاص اتفاق می افتد، تمام توابع پلاگین که به آن نوع نسبت داده شده است به همان ترتیبی که مشخص شده اند اجرا می شوند. با استفاده از این روش می توانیم عملکرد پلت فرم جوملا را بسیار زیاد توسعه دهیم. پلاگین ها به برنامه نویسان این امکان را می دهند کدهایی بنویسند که به توسعه های دیگر اجازه دهند نسبت به action های پلاگینی که نوشته شده است پاسخ دهند، و با این کار یک توسعه، توسعه پذیر می شود – یعنی می توانیم قابلیت های یک توسعه خاص را با استفاده از پلاگین افزایش دهیم.

از لحاظ فنی، معماری یک پلاگین از الگوی Observer Design Pattern استفاده می کند. کلاسی با نام JPlugin وجود دارد که ابزار لازم را برای ثبت پلاگین شخصی بر اساس رخدادهای شخصی و هسته فراهم می کند.

پلاگین ها را چگونه مدیریت کنیم؟

همانطور که در بالا گفتم، پلاگین یکی از توسعه های جوملا است (ما در جوملا 5نوع توسعه داریم: Component, Module, Plugin, Template, Language). ما از پلاگین ها استفاده می کنیم تا ویژگی های بیشتری را به یک کامپوننت یا ماژول اضافه کنیم. مثلا می توانیم با یک پلاگین یک فرم اضافه را به یک کامپوننت اضافه کنیم (مثل پلاگین Profile)، یا اضافه کردن روش اضافی احراز هویت مثل توانایی ورود با استفاده از اطلاعات کاربری در Facebook.
گفتم که پلاگین ها یکی از توسعه های جوملا است، پس برای نصب و مدیریت آنها باید از منوی افزونه ها (در بالای صفحه مدیریت جوملا)، گزینه پلاگین ها را انتخاب کنیم. با این کار وارد صفحه ای می شویم که فهرستی از پلاگین های موجود را در اختیار ما قرار می دهد. جدولی که پلاگین های موجود را نمایش می دهد دارای 6 ستون است:
  • حالت:
  • مشخص می کند که یک پلاگین فعال است یا غیرفعال.
  • نام پلاگین:
  • همانطور که مشخص است، نام پلاگین را نمایش می دهد.
  • نوع:
  • نوع پلاگین را مشخص می کند: مثلا Authentication, captcha, content …
  • عنصر:
  • نوع عنصر را مشخص می کند: مثلا joomla, cookie, gmail…
  • دسترسی:
  • سطح دسترسی پلاگین را مشخص می کند.
  • شناسه:
  • شناسه پلاگین را در پایگاه اطلاعاتی مشخص می کند.

یک پلاگین را چگونه نصب کنیم؟

در مطالب قبلی در مورد نصب زبان و نصب یک الگو توضیح دادم. از آنجا که پلاگین یکی از 5 توسعه موجود در جوملا است، نحوه نصب آن با یک زبان یا الگو تفاوتی ندارد. در مورد بیشتر توسعه ها (از جمله پلاگین) می توانیم به این شیوه عمل کنیم:

  • توسعه مورد نظر خود را از یک سایت معتبر و مورد تایید دانلود می کنیم و بر روی کامپیوتر محلی خود قرار می دهیم.
  • وارد قسمت مدیریت می شویم و در قسمت مدیریت از منوی بالای صفحه گزینه افزونه ها و سپس گزینه مدیریت را انتخاب می کنیم.
  • بر روی دکمه مربوط به بارگذاری فایل (Browse) کلیک می کنیم و فایل دانلود شده را از محلی که قبلا فایل را در آن قرار داده ایم انتخاب می کنیم.
  • معمولا جوملا به صورت خودکار توسعه را نصب می کند و با پیام نصب موفقیت آمیز روبرو می شویم. ممکن است در برخی از توسعه ها نیز مراحل اضافی برای انجام تنظیمات وجود داشته باشد.
  • توجه داشته باشید که اگر یک ماژول یا پلاگین را نصب می کنید، بعد از نصب باید آن ها را فعال کنید تا بتوانید از آنها استفاده کنید.

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

دسترسی به تنظیمات یک پلاگین

در قسمت مدیریت، زمانی که وارد محیط مدیریت پلاگین ها شدید (افزونه ها/ پلاگین ها)، با کلیک کردن بر روی هر پلاگین می توانید تنظیمات مربوط به آن را مشاهده کنید. در این قسمت توضیحاتی نیز در مورد پلاگین نوشته شده است که می توند به شما کمک کند. بسته به نوع پلاگین، شما باید پلاگین را برای توسعه هدفی که برای آن نوشته شده است، فعال کنید. مثلا پلاگین دادن امتیاز به یک محتوا، برای کامپوننت content نوشته شده و باید علاوه بر فعال کردن پلاگین در لیست پلاگین ها، در قسمت تنظیمات مربوط به محتوا نیز، این پلاگین را فعال کنید تا نمایش داده شود.

۱ نظر موافقین ۱ مخالفین ۰ ۳۰ تیر ۹۶ ، ۱۲:۵۱
مهرداد یوسفی فرد

ماژول ها توسعه هایی سبک و قابل انعطاف هستند که برای ارائه کردن محتوای صفحه استفاده می شوند. این ماژول ها اغلب اوقات جعبه هایی هستند که در یک صفحه در اطراف یک کامپوننت قرار می گیرند. به عنوان مثال می توانیم به ماژول لاگین اشاره کنیم. ماژول ها در جوملا به یک آیتم منو اختصاص داده می شوند، بنابراین می توانیم تعیین کنیم بر اساس اینکه کاربر در چه صفحه ای قرار دارد یک ماژول نمایش داده شود یا پنهان شود؛ بعضی از ماژول ها به یک کامپوننت متصل شده اند: به عنوان مثال ماژول آخرین اخبار، به کامپوننت محتوا مرتبط شده است (com_content) و لینک هایی به جدید ترین محتواهای ایجاد شده را نمایش می دهد. البته حتما هم لازم نیست که یک ماژول به چیزی لینک شود و می تواند فقط یک محتوای ایستای اچ تی ام ال یا متن باشد.

با استفاده از مدیر ماژول (Module Manager) می توانیم در قسمت مدیریت، ماژول ها را مدیریت کنیم (در جوملای فارسی: منوی افزونه ها/ ماژول ها). در این قسمت فهرستی از ماژول های موجود برای شما نمایش داده می شود که می توانید آن ها را مدیریت کنید. آموزش های مربوط به مدیریت ماژول ها در آینده در وب سایت قرار داده خواهد شد.

کمی اطلاعات بیشتر در مورد ماژول ها


محل های مربوط به ماژول ها (Module Positions)

منظور از محل ماژول، یک نگهدارنده محل (placeholder) است که قسمت خاصی را در داخل الگو مشخص می کند. نگهدارنده محل، یک یا تعدادی محل را در داخل الگو مشخص می کند که محتوای ماژول در داخل آن نمایش داده می شود. در واقع این نگهدارنده محل به برنامه کاربردی جوملا می گوید که محتوای ارائه شده توسط ماژول را در قسمت خاصی از الگوی وب سایت نمایش دهد. اگر به عنوان یک طراح الگو فعالیت کنید، می توانید کنترل کاملی بر روی این نگهدارنده های محل داشته باشید و آنها را هرگونه که تمایل دارید مدیریت کنید.

به عنوان مثال یک نگهدارنده محل با نام Left وجود ارد که می توانیم آن را به نوعی تعریف کنیم که در قسمت سمت چپ الگو قرار بگیرد تا یک منو در آن نمایش داده شود. بنابراین اگر یک ماژول را به نگهدارنده محل Left نسبت دهیم، این ماژول در محلی نمایش داده می شود که طراح الگو، نگهدارنده محل مربوط به آن را در آن قسمت قرار داده باشد – مسلما این محل الزاما سمت چپ نخواهد بود.

اگر وارد محیط مدیریت ماژول ها شوید، می توانید مشخص کنید که هر ماژول در چه مکانی از صفحه قرار گیرد. یعنی می توانید مشخص کنید که ماژول در کدام نگهدارنده محل (placeholder) قرار داده شود.
این نکته را در نظر داشته باشید که بسته به نوع الگویی که نصب کرده اید، آن الگو نگهدارنده های محل مختلفی را در اختیار شما قرار می دهد، که این نگهدارنده های محل از طریق منوی پایین افتادنی «موقعیت نمایش ماژول» برای هر الگو، در دسترس قرار دارند.
اگر بخواهیم کمی فنی تر به موضوع نگاه کنیم، می توانیم با استفاده از فایل templateDetails.xml مربوط به هر الگو، بفهمیم که چه مکان هایی و با چه نامی، برای آن الگوی خاص طراحی شده است؛ همانطور که از نام این فایل پیداست، این یک فایل xml است. در داخل این فایل اطلاعات کلی مربوط به الگو قرار داده شده که بیشترین کاربرد آن در هنگام نصب الگو است. در داخل این فایل تگی با نام <position> قرار دارد که محل های نگهداری مربوط به آن الگو را معرفی می کند.
من بر روی سیستم خودم نسخه 3.7 جوملا را نصب کرده ام و الگوی Beez3 به عنوان الگوی پیش فرض سایت تعریف شده است. محتوای تگ <position> برای این الگو به شکل زیر است:
	<positions>
		<position>debug</position>
		<position>position-0</position>
		<position>position-1</position>
		<position>position-2</position>
		<position>position-3</position>
		<position>position-4</position>
		<position>position-5</position>
		<position>position-6</position>
		<position>position-7</position>
		<position>position-8</position>
		<position>position-9</position>
		<position>position-10</position>
		<position>position-11</position>
		<position>position-12</position>
		<position>position-13</position>
		<position>position-14</position>
	</positions>
همانطور که در بالا می بینید، این الگو دارای 15 placeholder با نام های مختلف است که در داخل صفحات الگو از آنها استفاده شده. فعلا با جزئیات فنی دیگر مربوط به این قسمت کاری نداریم.
اگر دوست دارید وارد حوزه برنامه نویسی برای جوملا شوید، ماژول ها بهترین و ساده ترین نقطه باری شروع هستند (ماژول ها مثل ویجت ها در wordpress هستند). شما می توانید ماژول ها را در هر قسمتی از صفحه که تمایل داشته باشید قرار دهید.

ماژول های پیش فرض در جوملا

در جوملا ماژول های زیادی وجود دارند. در اینجا ماژول های استانداردی که در یک نسخه جدید نصب شده از جوملا وجود دارند را معرفی می کنم:

  • ماژول Archived Articles
  • این ماژول فهرستی از ماه های تقویم که شامل مقاله های آرشیوی هستند را نمایش می دهد.
  • ماژول Articles - Newsflash
  • این ماژول تعداد مشخصی از مقالات را از یک گروه موضوعی مشخص نمایش می دهد.
  • ماژول Articles – Related Articles
  • این ماژول، سایر مقالاتی را که از لحاظ موضوعی با مقاله ای که در حال خواندن آن هستید در ارتباط است، نمایش می دهد.
  • ماژول Articles Categories
  • این ماژول گروه های موضوعی مربوط به یک گروه موضوعی مادر را نمایش می دهد.
  • ماژول Article Category
  • این ماژول، فهرستی از مقالات را از یک یا چند گروه موضوعی نمایش می دهد.
  • ماژول Breadcrumbs
  • این ماژول برای این استفاده می شود که محل فعلی شما را در صفحه ای که هستید نمایش دهد.
  • ماژول Custom
  • این ماژول به شما امکان می دهد با استفاده از یک ویرایشگر WYSIWYG ماژول شخصی خود را به صورت یک ماژول اچ تی ام ال ایجاد کنید (یعنی یک متن ساده اچ تی ام ال ایجاد کنید).
  • ماژول Feed Display
  • این ماژول این امکان را به شما می دهد که خوراک های مربوط به محتوا را نمایش دهید (مثل فایل های rss).
  • ماژول Footer
  • این ماژول، اطلاعات مربوط به حق تالیف را نمایش می دهد.
  • ماژول Language Switcher
  • با استفاده از این ماژول، فهرستی از زبان های نصب شده و در دسترس، نمایش داده می شود تا کاربر بتواند زبان مورد نظر خود را انتخاب کند.
  • ماژول Latest News
  • این ماژول فهرستی از مقالاتی که اخیرا منتشر شده اند را نمایش می دهد.
  • Latest Users
  • این ماژول کاربرانی را نمایش می دهد که اخیرا ثبت نام کرده اند.
  • ماژول Login
  • این ماژول یک فرم برای ورود اطلاعات کاربر (نام کاربری و کلمه عبور) نمایش می دهد.
  • ماژول Menu
  • این ماژول در قسمت طرف کاربر، یک منو را نمایش می دهد.
  • ماژول Most Read Content
  • این ماژول فهرست مقالاتی را نشان می دهد که اخیرا منتشر شده اند و بیشترین بازدید را داشته اند.
  • ماژول Popular Tags
  • این ماژول بیشترین تگ هایی را که تاکنون استفاده شده اند نمایش می دهد.
  • ماژول Random Image
  • این ماژول از یک دایرکتوری که شما مشخص می کنید، به صورت تصادفی یک تصویر را انتخاب می کند.
  • ماژول Search
  • این ماژول جعبه جستجو را نمایش می دهد.
  • ماژول Similar Tags
  • این ماژول لینکی به سایر آیتم ها که داری تگ مشابه مطلب فعلی هستند ایجاد می کند.
  • ماژول Smart Search
  • این ماژول به سیستم هوشمند جستجو مربوط می شود.
  • ماژول Statistics
  • این ماژول اطلاعات مربوط به آمار را نمایش می دهد.
  • ماژول Syndicate Feeds
  • این ماژول برای صفحه ای که ماژول در آن قرار دارد یک خوراک آماده می کند.
  • ماژول Weblinks
  • این ماژول با استفاده از گروه موضوعی که در کامپوننت Weblinks تعریف می کنیم، لینک های وب مربوط به آن گروه را نمایش می دهد.
  • ماژول Who’s Online
  • این ماژول تعداد کاربران ناشناخته را نمایش می دهد. مثلا کاربران میهمان.
  • ماژول Wrapper
  • این ماژول برای یک محل مشخص شده، یک پنجره iframe نمایش می دهد.

{نکته: نام ماژول ها که در بالا ذکر شد، نام انگلیسی مربوط به آنها است. اگر زبان فارسی را بر روی جوملا نصب کرده باشید، این نام ها نیز به فارسی ترجمه شده اند.}

۰ نظر موافقین ۱ مخالفین ۰ ۲۹ تیر ۹۶ ، ۱۸:۰۵
مهرداد یوسفی فرد

مطالبی که تا این قسمت در مورد جوملا (نسخه 3) ارائه کردم، همگی مربوط به نسخه زبان انگلیسی جوملا بود. اما همه ما به عنوان یک ایرانی فارسی زبان، تمایل داریم محیط کاربری وب سایتمان با زبان فارسی باشد و همچنین محتوای نوشته شده در وب سایت به صورت راست-به-چپ ارائه شود.
برای این کار فقط کافی است نسخه مربوط به زبان فارسی را نصب کنیم تا زبان فارسی در دسترسمان قرار گیرد. بنابراین اولین قدم این است که بسته مربوط به زبان فارسی را از وب سایت جوملا دانلود کنیم. ابتدا وارد ساید جوملا (www.joomla.org) می شویم (من این کار را در روز 4شنبه به تاریخ 28 تیرماه 1396 انجام داده ام). از منوی بالای سایت، قسمت Download & Extend گزینه Language Packages را انتخاب می کنیم. با این کار به صفحه ترجمه های مربوط به جوملا هدایت می شویم. بر اساس نوع نسخه جوملا که بر روی سیستم خود نصب کرده ایم (1.5 یا 2.5 یا 3.x) بر روی یکی از لینک ها کلیک می کنیم. من بر روی کامپیوتر خودم نسخه 3.7 جوملا را نصب کرده ام پس بسته های مربوط به نسخه 3.x را باید انتخاب کنم. بر روی لینک مورد نظرتان کلیک کنید تا وارد صفحه مربوطه شوید. در این صفحه می توانید بسته زبان فارسی (Persian) را پیدا کنید و نسخه مورد نظر خود را دانلود کنید. فایل دانلود شده با فرمت zip است که باید آن را نصب کنیم. فایل را در جایی قرار دهید تا در مرحله بعد آن را نصب کنیم.

حالا وارد محیط مدیریت جوملا می شویم (yoursite-address/administrator). از منوی بالای صفحه، بر روی گزینه Extension کلیک می کنیم و از منوی باز شده گزینه Manage را انتخاب می کنیم. در قسمت های قبلی نیز گفتم که برای نصب توسعه ها باید به این قسمت بیاییم.

چون قبلا فایل زیپ مربوط به زبان را دانلود کرده ایم برای آپلود کردن فایل مورد نظر بر روی دکمه سبز رنگ که نوشته است Or browse for file کلیک می کنیم و فایل زیپ مربوط به زبان را از این قسمت آپلود می کنیم.

 
پس از چند ثانیه با پیغامی روبرو می شوید که به شما می گوید فارسی ساز جوملا به درستی نصب شده است:
حالا وقت آن رسیده که زبان محیط جوملا را به زبان فارسی تبدیل کنیم. برای اینکار از منوی Extensions گزینه Language(s) را انتخاب می کنیم تا وارد محیط مدیریت زبان(ها) شویم.

 
همانطور که در تصویر بالا مشاهده می کنید، حالا که زبان فارسی را نصب کرده ایم، در لیست علاوه بر زبان انگلیسی، زبان فارسی نیز قابل مشاهده است. در این فهرست، زبانی که به عنوان زبان پیش فرض انتخاب شده است در ستون Default با علامت ستاره زرد رنگ مشخص شده.
در قسمت بالا سمت چپ یک منوی پایین افتادنی نیز وجود دارد که به صورت پیش فرض، گزینه Administrator انتخاب شده است. با استفاده از این منو می توانید زبان مربوط به محیط کاربر (Site) یا زبان مربوط به محیط مدیریت (Administrator) را به صورت جداگانه تنظیم کنید. برای اینکه زبان محیط مدیریت را به فارسی تغییر دهیم، می توانیم به راحتی در ردیف مربوط به زبان فارسی در ستون Default بر روی علامت ستاره کم رنگ کلیک کنیم تا زبان فارسی به عنوان زبان پیش فرض محیط مدیریت تعریف شود. یا اینکه می توانیم دکمه رادیویی کنار زبان فارسی را انتخاب کنیم و در قسمت بالا سمت چپ بر روی دکمه Default کلیک نماییم.

 
برای تنظیم زبان مربوط به محیط کاربر (Site) نیز به همین شکل عمل می کنیم. یعنی از منوی پایین افتادنی گزینه Site را انتخاب می کنیم و سپس از لیست زبان ها، زبان فارسی را انتخاب کرده و آن را به عنوان پیش فرض تعریف می کنیم. با این کار به خودی خود محیط طرف کاربر نیز به صورت راست به چپ تعریف می شود.

همانطور که در شکل زیر می بینید، محیط مدیریت به صورت راست به چپ قابل مشاهده است و تمام متون نیز به زبان فارسی ترجمه شده اند:

موافقین ۱ مخالفین ۰ ۲۸ تیر ۹۶ ، ۱۳:۴۸
مهرداد یوسفی فرد

حتما تا به حال خیلی زیاد اسم کامپوننت (Component) را هنگام کار کردن با جوملا شنیده اید. یکی از ویژگی های مهم در جوملا قابلیت توسعه پذیری آن است. کامپوننت ها یکی از اجزای مهم جوملا هستند که با استفاده از آنها می توانیم کارهایی را که دوست داریم بر روی محتوای مورد نظر خود انجام دهیم. به عنوان مثال برای نوشتن مطالب مورد نظرمان در جوملا، در پشت صحنه از کامپوننت مربوط به محتوا که با نام com_content شناخته می شود استفاده می کنیم. کامپوننت های خیلی زیاد دیگری هم وجود دارند که می توانید از سایت های معتبری که در حوزه حوملا فعالیت می کنند، آنها را دانلود کنید و در وب سایت خود استفاده کنید. اگر هم هیچ کدام از این کامپوننت ها نیاز شما را برطرف نکرد، می توانید خودتان دست به کار شوید و یک کامپوننت برای خودتان یا دیگران بنویسید.
در این قسمت می خواهم توضیحات مختصری در مورد ماهیت کامپوننت ها و نحوه عملکرد آنها ارائه کنم. قبل از هر چیز کمی بیشتر در مورد اصطلاح کامپوننت بحث کنیم:

همانطور که گفتم جوملا یک سیستم مدیریت محتواست که از قابلیت توسعه پذیری بسیار بالایی برخوردار است؛ یعنی شما خودتان می توانید با مهارت های برنامه نویسی خودتان، توسعه های فراوانی (با رعایت استخوان بندی اصلی ارائه شده توسط جوملا) را تهیه کنید و به قابلیت های این سیستم مدیریت محتوا بیفزایید. کامپوننت ها نیز یکی از توسعه های (Extension) موجود در جوملا هستند. اما کامپوننت مهم ترین واحد عملیاتی در جوملا است. شاید طبق گفته وب سایت جوملا، بتوانیم آنها را به عنوان نرم افزار های کوچک کاربردی (Mini-application) بنامیم. شاید بتوانیم بگوییم که جوملا یک سیستم عامل است و کامپوننت ها به عنوان نرم افزارهای کاربردی دسکتاپی عمل می کنند.
بیشتر کامپوننت ها دو بخش دارند، یکی مربوط به قسمت مدیریت (administrator) و دیگری مربوط به قسمت کاربر (site) سایت. همانطور که می توانید حدس بزنید، قسمت مربوط به طرف کاربر، محتوایی را که کاربر درخواست کرده تا مشاهده کند، نمایش می دهد. اما قسمت مربوط به مدیریت یک رابط کاربری در اختیار مدیر(ان) وب سایت قرار می دهد تا جنبه های مختلف آن کامپوننت را پیکربندی و مدیریت کنند و مسلما این قسمت فقط از طریق قسمت مدیریت قابل دسترسی است.
همانطور که در بالا گفتم، به صورت پیش فرض کامپوننت هایی در جوملا وجود دارد، مثل کامپوننت مربوط به محتوا، فرم های تماس یا لینک های وب.

کامپوننت های جوملا از لحاظ فنی چگونه عمل می کنند؟

با استفاده از چهارچوبی که جوملا در اختیال ما قرار می دهد می توانیم کامپوننت ها را به دو صورت طراحی کنیم: یا با استفاده از مدل مسطح (Flat Model)؛ یا با استفاده از مدل MVC (Model-View-Controller) می توانیم این کار را انجام دهیم.

قبل از هر چیز بهتر است در مورد مدل MVC کمی توضیح دهم. اگر مدل MVC را به خوبی بشناسید، به راحتی می توانید همه توسعه های مربوط به جوملا را درک کنید، ویرایش کنید یا از ابتدا یکی برای خودتان بسازید!

مدل MVC چیست؟

مدل MVC در اصل یک مدل طراحی نرم افزار است که به ما این امکان را می دهد منطق مربوط به کدها و کاری که انجام می دهند را از قسمت ارائه اطلاعات جدا کنیم. پیش فرض اولیه مربوط به این مدل برنامه نویسی بر این پایه است که منطق مربوط به کدنویسی را می توانیم در یک گروه دسته بندی کنیم و سپس رابط کاربری و ارتباط با کاربر را نیز می توانیم به صورت جداگانه شخصی سازی کنیم بدون اینکه لازم باشد منطق کدنویسی را تغییر دهیم. به عبارت دیگر پیش فرض ما این است که می توانیم منطق کدنوسی را از فرایند ارائه اطلاعات به کاربر جدا کنیم.

منظور از Model چیست؟

model قسمتی از کامپوننت است که داده های مربوط به برنامه را درون خود قرار می دهد. این قسمت، روال های مورد نیاز برای مدیریت و دستکاری داده ها را با روشی منطقی در اختیار ما قرار می دهد و علاوه بر این روال های مورد نیاز برای بازیابی داده ها از مدل را برای ما فراهم می کند. به عبارت کلی، مهم ترین تکنیک دسترسی به داده ها باید در داخل مدل قرار داده شود. با استفاده از این روش، اگر قرار باشد یک برنامه کاربردی از سیستمی که داده ها را به صورت فایلهای معمولی ذخیره می کند به سیستمی منتقل شود که داده ها را در پایگاه اطلاعاتی ذخیره می کند، فقط لازم است قسمت مدل (Model) تغییر کند و نیازی به اعمال تغیرات در قسمت view یا controller نیست.

منظور از VIEW چیست؟

View در یک کامپوننت داده هایی که از model دریافت می شود را به گونه ای ارائه می کند که برای برقراری تعامل مناسب باشند. در مورد یک برنامه کاربردی تحت وب، view باید این داده ها را به صورت یک صفحه اچ تی ام ال ارائه کند تا بتوانیم آنها را در اختیار کاربر قرار دهیم. View داده ها را از model بیرون می کشد (این داده ها هم از طرف controller برای model ارسال شده است) و آنها را در اختیار الگو (Template) هایی قرار می دهد که اطلاعات را در اختیار کاربر قرار خواهند داد. View هیچ تغییراتی را بر روی داده ها انجام نمی دهد، فقط داده هایی را که از model دریافت کرده است نمایش می دهد.

منظور از controller چیست؟

کنترل کننده (Controller) مسوول این است که مشخص کند به درخواست های کاربر باید چه پاسخی داده شود. در مورد یک برنامه کاربردی تحت وب، معمولا درخواست کاربر مشاهده یک صفحه است. کنترل کننده مشخث می کند که کاربر چه درخواستی را ارائه کرده و مدل (Model) مناسب برای دستکاری صحیح اطلاعات مورد درخواست کاربر را فراخوانی می کند و این مدل، داده ها را برای view می فرستد. کنترل کننده، داده ها را در model نمایش نمی دهد، این قسمت فقط روش هایی را که مدل با استفاده از آنها داده ها را آماده می کند راه اندازی می کند؛ و سپس model را به سمت view مناسب برای نمایش داده ها راهنمایی می کند.

فکر می کنم تا همین حد برای آشنایی با ساختار کامپوننت ها کافی باشد. اگر دوست داشته باشید از لحاظ فنی بیاموزید یک کامپوننت چگونه کار می کند و چگونه می توانیم یک کامپوننت جدید ایجاد کنیم، در آینده آموزش هایی را در این زمینه در اختیار شما قرار خواهم داد.

۰ نظر موافقین ۱ مخالفین ۰ ۲۷ تیر ۹۶ ، ۲۲:۵۱
مهرداد یوسفی فرد

در جوملا برای الگوها ساختار مشخصی برای پوشه ها و فایل ها وجود دارد که البته این ساختار می تواند با توجه به نوع الگو و امکاناتی که آن الگو در اختیار ما قرار می دهد، متفاوت باشد.
همانطور که در مطالب قبلی نیز گفتم، الگوهای مربوط به کاربران وب سایت در داخل پوشه templates قرار دارند. مثلا اگر الگویی که ما طراحی کرده ایم با نام myTemplate مشخص شده باشد، این الگو باید در این مسیر قرار گیرد:

/templates/myTemplate

الگوهایی که مربوط به محیط مدیریت هستند در داخل این مسیر قرار دارند:

/administrator/templates

مثلا اگر ما الگویی را با نام myAdminTemplate بوجود آورده باشیم، این الگو باید در این آدرس قرار گیرد:

/administrator/templates/myAdminTemplate

معمولا ساختار پوشه ها در یک الگوی معمولی جوملا به شکل زیر است:

  • css: تمام فایل های شیوه نامه های آبشاری (css) در این پوشه قرار می گیرند.
  • html: فایلهایی که توسط الگو به جای فایل های از پیش تعیین شده قرار می گیرند (یعنی جایگزین فایل های از پیش تعیین شده می شوند) در داخل این پوشه قرار دارند.
  • images: تمام تصاویری که توسط الگو استفاده می شوند در این پوشه قرار می گیرند.
  • language: فایل های مربوط به زبان های اضافی که توسط الگو استفاده می شوند در این پوشه قرار دارند.
بر اساس میزان پیچیدگی الگویی که در حال مشاهده آن هستید ممکن است یک پوشه دیگر نیز حاوی فایل های جاوااسکریپت وجود داشته باشد:
  • javascript: شامل فایل های جاوااسکریپت است که الگو از آنها استفاده می کند.

یک نمونه از ساختار فایل ها

معمولا مسیر مربوط به یک الگو بر روی سروری که وب سایت خود را نصب کرده اید به این شکل است:

 /public_html/domain-name/template/ 
که معمولا شامل فایلها و پوشه های زیر است:

/css
/html
/images
/javascript
/language
component.php
error.php
favicon.ico
index.php
templateDetails.xml
template_preview.png
template_thumbnail.png 

فایل های موجود در یک الگو

معمولا در یک الگو حداقل فایل های زیر وجود دارند:

  • index.php
  • در این فایل، منطق لازم برای نمایش و محل قرار گیری کامپوننت ها و ماژول ها مشخص می شود.
  • component.php
  • این فایل، منطق لازم برای نمایش صفحه مناسب برای پرینت، لینک مربوط به ارسال ایمیل برای یک دوست و چیزهایی شبیه به این مشخص می شود.
  • error.php
  • شیوه مناسب برای مدیریت کردن خطاهای رخ داده (مثل خطای 404) در این صفحه مشخص می شود.
  • favicon.ico
  • این فایل، آیکون مربوط به الگو است.
  • template.css
  • همانطور که از پسوند (.css) این فایل پیداست، این یک فایل شیوه نامه آبشاری است که جنبه های ظاهری صفحه را مشخص می کنید. در این فایل خصوصیاتی مثل فونت ها، اندازه حاشیه ها، حاشیه های تصاویر، و سایر فرمت دهی های مربوط به ظاهر صفحات مشخص می شوند. البته ممکن است فایل های شیوه نامه آبشاری در داخل پوشه css قرار داشته باشند.
  • templateDetails.xml
  • در داخل این فایل، فراداده هایی (داده در مورد داده) در مورد الگو قرار دارند که این اطلاعات توسط نصب کننده الگو و قسمت مدیریت الگو استفاده می شوند.
  • template_preview.ext
  • منظور از ext فرمت مربوط به تصویر است که این فرمت می تواند .jpg, .png, .gif باشد.
    معمولا یک تصویر با اندازه 600 در 400 پیکسل برای این کار در نظر گرفته می شود. زمانی که کاربر بر روی تصویر بندانگشتی مربوط به الگو کلیک می کند، این تصویر نمایش داده می شود (البته این اتفاق در قسمت Template Manager: Templates رخ می دهد). در این حالت، یک پنجره در سطحی بالاتر از صفحه فعلی باز می شود که پیش نمایشی از الگوی مورد نظر را نشان می دهد تا مدیر بتواند قبل از انتخاب آن الگو، متوجه شود نمایش ظاهری آن الگو چگونه است.
  • template_thumbnail.ext
  • معمولا یک تصویر با اندازه 200 در 150 پیکسل برای این کار در نظر گرفته می شود. هنگامی که در قسمت مدیریت مربوط به الگو ها قرار داریم (Template Manager: Templates) این نمای بند انگشتی در ردیف مربوط به الگو نمایش داده می شود.
۰ نظر موافقین ۱ مخالفین ۰ ۲۶ تیر ۹۶ ، ۰۹:۵۷
مهرداد یوسفی فرد

مطمئنا خیلی وقت ها ممکن است با این مساله روبرو شویم که الگویی را که برای وب سایت خود نصب کرده ایم تمام آن ویژگی هایی را که انتظار داریم، ندارد. در چنین حالتی دوست داریم که بتوانیم الگو را کمی شخصی سازی کنیم. یک روش این است که وب سایت را به صورت محلی بر روی کامپیوتر خود نصب کنیم و مستقیما فایل های مربوط به الگو را در یک نرم افزار ویرایشگر باز کنیم و تغییرات لازم را اعمال کنیم (ساختار فایل ها و پوشه های مربوط به یک الگو را آموزش خواهم داد) و سپس فایل های ویرایش شده را با فایل های اصلی که بر روی سرویس دهنده وب قرار دارند، با یک نرم افزار مناسب – مثل ftp – یا نرم فازار مدیریت سرور، جابجا کنیم.

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


برای رفتن به قسمت شخصی سازی و ویرایش الگو ها از منوی Extensions گزیه Templates را انتخاب می کنیم. به صورت پیش فرض وارد قسمت Styles می شویم.

با استفاده از منویی که در قسمت بالا وجود دارد می توانیم الگوهای قسمت کاربر یا الگوهای قسمت مدیریت را انتخاب کنیم. در ستون Style بر روی نام هر الگو که کلیک کنیم وارد قسمت تنظیمات مربوط به سبک (Style) می شویم. در اصل در این قسمت، پارامترهای مربوط به هر الگو را می توانیم تنظیم کنیم. این پارامترها به این بستگی دارند که طراح الگو چه چیزهایی را برای شما تعریف کرده باشد.


در ستون Template با کلیک کردن بر روی نام هر الگو وارد قسمتی می شویم که ساختار فایل های موجود در الگو را نمایش می دهد و می توانیم با کلیک کردن بر روی هر فایل، محتوای مربوط به آن فایل را مشاهده کنیم و در صورت نیاز این محتوا را ویرایش کرده یا تغییر دهیم. در این قسمت می توانیم به راحتی فایل های اصلی مربوط به هر الگو را ویرایش کنیم و دیگر لازم نیست که از طریق ftp به فایل ها دسترسی پیدا کرده و آنها را تغییر دهیم یا اینکه الگو ها را به صورت محلی تغییر دهیم و بعد فایل های تغییر داده شده را بر روی وب سایت قرار دهیم (البته مسلما باید با ساختار فایلها به صورت کامل آشنایی داشته باشیم تا چیزی را بهم نزنیم!).


برای اینکه بتوانیم ویژگی های مربوط به یک الگو را تغییر دهیم دو روش وجود دارد:

1) در روش اول می توانیم در حالی که در محیط Styles قرار داریم، در ستون Template بر روی نام الگوی مورد نظر خود کلیک کنیم تا به قسمت ویرایش فایل های مربوط به الگو منتقل شویم.
2) در روش دوم می توانیم در حالی که در محیط Templates هستیم، در ستون Template بر روی نام الگو کلیک کنیم تا به قسمت ویرایش فایل های مربوط به الگو منتقل شویم. در زیر نام الگوی یک لینک با نام Preview وجود دارد که اگر بر روی آن کلیک کنیم، نمای ظاهری وب سایت به صورت پیش نمایش برای الگویی که در همان ردیف قرار دارد نمایش داده می شود تا ببینید سایت با این الگو چگونه نمایش داده خواهد شد.


نمای مربوط به شخصی سازی یک الگو

با هر کدام از روش های زیر که بر روی نام یک الگو کلیک کرده باشیم، به قسمت شخصی سازی آن الگو وارد می شویم. در قسمت عنوان این صفحه این چنین نوشته شده است (Templates: Customize (Template Name)).


همانطور که گفته شد، در این قسمت تمام فایل های مربوط به الگو برای شما نمایش داده می شود و به راحتی می توانید بر روی فایل مورد نظر خود کلیک کنید و تغییرات یا ویرایش های لازم را بر روی آن انجام دهید.

۰ نظر موافقین ۱ مخالفین ۰ ۲۶ تیر ۹۶ ، ۰۹:۵۰
مهرداد یوسفی فرد

محتوای این قسمت برای نسخه 3 جوملا نوشته شده است

برای اینکه بتوانیم یک الگوی جدید را در جوملا نصب کنیم، ابتدا باید وارد قسمت مدیریت شویم. برای این کار ابتدا به آدرس مدیریت وب سایت (localhost/joomla3.7/administrator یا بر روی وب: www.my-site.com/administerator/) می رویم.


حالا که وارد قسمت مدیریت شدیم از منوی Extensions گزینه Manage را انتخاب می کنیم.

در این صفحه می توانیم الگو، کامپوننت، ماژول یا یک زبان را نصب کنیم. برای نصب کردن سه راه حل وجود دارد:

  1. بارگذاری کردن یک بسته (Upload package file): یک بسته فایل را از روی کامپیوتر خودمان انتخاب می کنیم و آن را بارگذاری می کنیم تا نصب شود.
  2. نصب کردن از یک پوشه (Install from folder): در این قسمت مسیر را وارد می کنیم که فایل های مورد نظر ما بر روی آن قرار دارند.
  3. دانلود کردن از یک آدرس URL: در این قسمت می توانیم آدرس URL مربوط به توسعه ای که قصد نصب کردن آن را داریم وارد کنیم.

این نکته را در نظر داشته باشید که اگر بخواهید این کار را برای جوملا بر روی محیط وب انجام دهید، باید دسترسی نوشتن بر روی فضای وب سایت شما (پوشه هایی که قرار است الگوی جدید بر روی آنها قرار گیرد) فعال باشد تا بتوانید این کار را انجام دهید.

چطور مطمئن شویم که یک الگو نصب شده است؟

برای اینکه اطمینان پیدا کنیم الگویی را که در مرحله قبلی نصب کرده ایم به درستی نصب شده است، در قسمت مدیریت توسعه ها، بر روی لینک Manage (در منوی سمت چپ در نسخه انگلیسی جوملا) کلیک می کنیم؛ سپس گزینه Search Tools را انتخاب می کنیم و از منوی Select Type گزینه Template را انتخاب می کنیم. در این قسمت می توانیم تمام الگوهایی را که در قسمت کاربر و مدیر نصب شده اند مشاهده کنیم. الگویی که در مرحله قبل نصب کرده ایم باید در این لیست وجود داشته باشد.



انتخاب فیلترها برای نمایش الگوها:



۰ نظر موافقین ۱ مخالفین ۰ ۲۵ تیر ۹۶ ، ۱۱:۱۳
مهرداد یوسفی فرد

محتوای این قسمت برای نسخه 3 جوملا نوشته شده است

تعداد زیادی از افراد، شرکت ها، و سازمان ها خیلی زود احساس می کنند که باید ظاهر وب سایت خود را بازطراحی کنند؛ مسلما آنها به شخصی نیاز دارند که به آنها کمک کند محتوای وب سایتشان را مطابق با نظراتشان مجددا سازمان دهی نماید. در این میان باید در نظر داشته باشید که کاربران وب سایت ها نیز با توجه به تغییرات گسترده ای که با سرعت فراوان در محیط وب رخ می دهد، انتظاراتشان از وب سایت مورد علاقه اشان روز به روز بیشتر می شود و خواهان تنوع و ایجاد تغییر مطابق با تحولات و تکنولوژی های روز هستند.


یکی از اصول مهم در طراحی جوملا (و سایر سیستم های مدیریت محتوا) جداکردن محتوا از شکل ظاهری آن است. در واقع یکی از ویژگی های یک سیستم مدیریت محتوای خوب این است که به کاربران اجازه می دهد بدون داشتن مهارتهای برنامه نویسی، بتوانند وب سایت خود را مدیریت کنند. بنابراین سیستم های مدیریت محتوا سعی می کنند فرایند های برنامه نویسی را به صورت کامل از فرایند های طراحی ظاهری صفحات جدا کنند (جوملا برای این کار از مدل mvc استفاده می کند که در آینده در مورد آن توضیح داده خواهد شد). اگر چه این جدایی کامل و مطلق نیست، اما این جدایی به اندازه ای مشخص است که شخصی سازی سایت را کار آسانی می کند. تغییر ظاهر صفحات وب سایتی که توسط سیستم مدیریت محتوا ایجاد شده است، به سادگی نصب و پیکربندی یک الگوی جدید است. یعنی فقط کافی است یک الگوی جدید انتخاب کنید، آن را دانلود کرده و سپس در سیستم مدیریت محتوای خود نصب کنید.


یک الگو، مجموعه ای از فایل ها است که مشخص می کند وب سایت شما که با جوملا طراحی شده است به چه صورتی نمایش داده شود. الگوها، اطلاعاتی در مورد قالب بندی کلی وب سایت و سایر محتوا را در خود دارند، اطلاعاتی مثل تصاویر، رنگ، عکس های پس زمینه، سرصفحه ها، لوگوها و تایپوگرافی و فوترها(اجزای پایین صفحه). البته هر الگو با الگوی دیگر کمی تفاوت دارد و بسته به چگونگی طراحی آن، گزینه های مختلفی را در اختیار کاربر قرار می دهد تا تقریبا خیلی سریع ظاهر وب سایت را بدون اینکه نیازی به کدنویسی داشته باشند تغییر دهند.


شما می توانید نتیجه جداسازی محتوا از ظاهر را با تغییر دادن الگوی پیش فرض مشاهده کنید (الگوهایی که از قبل بر روی جوملا نصب شده اند). اگر یاد بگیرید که چگونه الگوهای مربوط به سیستم های مدیریت محتوا مانند جوملا را ایجاد کنید، این کار برای شما به عنوان یک طراح، موقعیت های فراوانی را ایجاد می کند.


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


یک الگوی جوملا چیست؟

قبل از هرچیز باید مشخص کنیم منظرمان از الگو(Template) در جوملا چیست؟ همانند الگوهای سنتی اچ تی ام ال، الگوهای جوملا مجموعه ای از فایل ها است که ظاهر دیداری سایت را تعیین می کنند (مجموعه ای از فایل های پی اچ پی، css و جاوااسکریپت). در هر الگو –بسته به نوع طراحی آن- تعداد مختلفی از این فایل ها وجود دارد و نوع این فایل ها نیز متفاوت است، اما هدف کلی آنها یکی است. این فایل ها، محل قرارگیری اجزای صفحه را مشخص می کنند و البته بر روی نحوه ارائه محتوا نیز اثر می گذارند.


یک الگو را به تنهایی نمی توان یک وب سایت نامید. به طور کلی، افراد الگو را به عنوان ظاهر وب سایتشان می شناسند. اما الگو فقط یک ساختار است با فیلدهای فعال(که معمولا رنگ آمیزی شده است). الگو مشخص می کند که اجزای خاص چگونه نمایش داده شوند (مثلا اندازه فونت، رنگ، پسزمینه، سبک و فاصله بندی) و مشخص می کند که این اجزا چگونه مرتب شوند (این مساله شامل محل قرارگیری ماژول ها نیز می شود). در جوملا نمای یک صفحه توسط یک خروجی اچ تی ام ال نمایش داده می شود که این خروجی حاصل محتوای تهیه شده توسط کامپوننت، یک ماژول انتخاب شده و الگو است.


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


بیشتر سیستم های مدیریت محتوا، که جوملا نیز عضو آن است، ساختار ماژولار دارند که به شما اجازه می دهند ظاهر سایت را به آسانی تقویت کنید و ماژولها را در منطقه مناسب نصب و منتشر نمایید.


موتورهای جستجو با طراحی صفحات کاری ندارند، اما این مساله برای بازدیدکنندگان مهم است. اینکه الگوی یک وب سایت چگونه طراحی شده باشد در برداشت اولیه از طراحی وب سایت شما نقش بسیار مهمی ایفا می کند و این طراحی، درکی کلی از سایر صفحات وب سایت شما در ذهن مخاطب ایجاد خواهد کرد.


الگوهای جوملا از چه طریق قابل دسترسی هستند


اول از همه بهتر است بدانیم فایل های مربوط به الگوهای جوملا در کدام پوشه از پوشه های محل نصب جوملا قرار دارند. همانطور که در قسمت های قبل گفتم، ما با استفاده از wamp کامپیوتر محلی خود را به یک سرویس دهنده وب تبدیل کردیم و سپس فایل های مربوط به جوملا را بر روی آن قرار دادیم. در کامپیوتر من این فایلها در این آدرس قرار دارند: c:/wamp/www/joomla3.7

همانطور که در پست قبلی هم اشاره کردم می بنید در داخل آدرس ذکر شده در خط بالا، پوشه ها و فایل های متفاوتی وجود دارد. همانطور که می بینید پوشه ای با نام templates وجود دارد؛


از نام این پوشه نیز بر می آید که فایل های مربوط به الگوهای جوملا در داخل آن قرار دارند. البته محتویات و تعداد پوشه های موجود در پوشه templates بستگی به نوع نسخه ای دارد که شما نصب کرده اید. اگر از قبل یک یا چند الگوی جدید را نصب کرده باشید، این الگو ها نیز در این پوشه قرار گرفته اند.


طبق تصویر زیر مشاهده می کنید که در پوشه templates (جوملایی که من بر روی کامپیوترم نصب کرده ام) سه (3) پوشه مختلف با نام های متفاوت وجود دارد، این مساله بدان معناست که بر روی جوملای نصب شده بر روی این کامپیوتر 3 الگوی متفاوت نصب شده است که شما می توانید از آنها استفاده نمایید (در مورد نحوه تغییر الگوهای موجود، در مراحل بعدی توضیحات کافی ارائه خواهد شد). این ها الگوهایی هستند که در قسمت نمایش سایت (برای کابر) در اختیار شما است.



برای نمونه وارد یکی از این پوشه ها می شویم. پوشه system یکی از الگوهای پیش فرض جوملا است که یک صفحه بندی ساده را در اختیار شما قرار می دهد.



همانطور که مشاهده می کنید در داخل این پوشه چندین پوشه و فایل وجود دارد. البته تعداد این پوشه ها و فایل ها بستگی به ساختار طراحی الگو دارد. اما به طور پیش فرض یک پوشه مربوط به فایل های css است ، یک پوشه با نام html و یک پوشه مربوط به فایلهای تصاویر(images). حتما حداقل یک فایل با نام index.php نیز در این پوشه قرار دارد. معمولا فایلی با عنوان templateDetails.xml نیز در داخل پوشه الگو قرار دارد. این فایل xml یک فایل ضروری است، به خاطر اینکه با استفاده از اطلاعات ذکر شده در این فایل، جوملا می تواند الگوی طراحی شده را شناسایی کرده و اطلاعات لازم را در مورد آن به دست آورد. در قسمت های بعدی توضیحات مفصل تری در مورد ساختار پوشه ها و فایل ها ارائه خواهد شد، در این قسمت فقط قصد داریم نگاهی اجمالی به پوشه ها و محتویات درون آنها بیاندازیم.


دسترسی به الگوها از طریق بخش مدیریت


شما می توانید ساختار ظاهری وب سایت خودتان در قسمت مدیریت را نیز تغییر دهید. در حقیقت قسمت مدیریت سایت، الگوهای مربوط به خود را دارد که این الگوها در این آدرس قرار دارند (البته با توجه به جوملایی که من بر روی کامپیوتر خودم نصب کرده ام):


c:/wamp/www/joomla3.7/administrator/templates

مسلما قسمت c:/wamp این آدرس به محل نصب جوملا بر روی کامپیوتر شما بستگی دارد. در داخل این پوشه نیز بسته به تعداد الگوهای نصب شده در سمت مدیر، تعداد پوشه های متفاوت با ساختار متفاوت وجود خواهد داشت.


حالا که متوجه شدیم فایل های مربوط به الگوهای جوملا از نظر فیزیکی در داخل کدام پوشه ها قرار دارند، قبل از اینکه به سراغ تغییر دادن محتوای آنها یا طراحی الگوها برویم بهتر است بیاموزیم در قسمت مدیریت جوملا، چگونه به این الگوها دسترسی داریم.


با این فرض که WampServer یا هر نرم افزار دیگری که از طریق آن ملزومات لازم برای راه اندازی php را نصب کرده اید، در حال اجرا می باشد، در داخل نوار آدرس مرورگر خود این آدرس را وارد کنید:


http://localhost/joomla3.7/administrator/

همانطور که در شکل بالا می بینید باید ابتدا نام کاربری و کلمه عبور مربوط به مدیر سایت را وارد کنید تا وارد صفحه مدیریت شوید

برای دسترسی به صفحه مدیریت الگو ها از منوی extensions گزینه Templates را انتخاب کنید:


با این کار به صفحه مدیریت الگوها هدایت خواهید شد:

 

در این قسمت می توانیم الگوهای موجود در جوملا را برای قسمت کاربر و مدیریت، سازماندهی کنیم. در نمای پیش فرض، الگوهای نصب شده برای طرف کاربر نمایش داده می شود. در این قسمت، الگویی که به عنوان الگوی پش فرض برای طرف کاربر در نظر گرفته شده است با علامت ستاره مشخص شده است. برای جوملایی که من نصب کرده ام، الگوی Beez3 به عنوان الگوی پیش فرض تعریف شده است.
اگر بخواهیم الگوی protostar را به عنوان الگوی پیش فرض تعریف کنیم، چک باکس کنار نام protostar را تیک می زنیم و در نوار ابزار گزینه Default را کلیک می کنیم.
با این کار، علامت ستاره در کار نام protostar قرار می گیرد. البته برای تغییر دادن الگوی پیش فرض می توانید در ردیف مربوط به یک الگو، بر روی ستاره که با رنگ کم رنگ مشخص شده است کلیک کنید تا آن الگو به عنوان الگوی پیش فرض در نظر گرفته شود.



در منوی بالای این قسمت از فضای مدیریت، دو فیلتر از نوع منوی پایین افتادنی وجود دارد. یکی از فیلتر ها به ما کمک می کند مشخص کنیم الگوهای فضای کاربر (site) یا الگوهای فضای مدیریت (administrator) را انتخاب کنیم و فیلتر دیگر مربوط به جستجوی است که می توانیم با استفاده از این منوی پایین افتادنی مشخص کنیم که جستجو در کدام یک از الگوها انجام شود.

در منوی بالای این صفحه، چهار گزینه دیگر نیز وجود دارد: Edit, Duplicate, Delete, Options
با استفاده از این گزینه ها می توانیم یک الگو را که انتخاب کرده ایم، ویرایش کنیم، حذف کنیم، یک نمونه دیگر از آن ایجاد کنیم یا به گزینه های مربوط به آن دسترسی داشته باشیم.

۰ نظر موافقین ۱ مخالفین ۰ ۲۳ تیر ۹۶ ، ۱۴:۵۴
مهرداد یوسفی فرد

بعد از اینکه جوملا را نصب کردیم، حتما علاقه دارید که بدانید این سیستم مدیریت محتوا دارای چه پوشه ها و فایل هایی است. شاید برایتان جذاب باشد که بخواهید با ساختار دایرکتوری ها (پوشه ها) در این سیستم مدیریت محتوا آشنا شوید. مخصوصا اگر علاقه داشته باشید که کار برنامه نویسی انجام دهید و توسعه های مختلفی را برای جوملا طراحی (یا ویرایش کنید) لازم است با این ساختار آشنا شوید.

من نسخه 3.7 را بر روی سیستم خودم (به صورت محلی) نصب کرده ام. همانطور که در قسمت نصب جوملا نیز برایتان توضیح دادم، از نرم افزار Wamp Server برای نصب استفاده کرده ام. فایل های مربوط به جوملا در کامپیوتر من در این آدرس قرار دارند (C:\wamp\www\joomla3.7) که با فعال کردن Wamp Server و تایپ آدرس localhost/joomla3.7 در نوار آدرس مرورگر وب می توانم به محتوای این سایت دسترسی داشته باشم.

در حال حاضر در پوشه joomla3.7 تعداد 15 پوشه و 7 فایل وجود دارد. در سیستم مدیریت محتوای جوملا (که از این به بعد به طور مختصر آن را با نام جوملا استفاده خواهم کرد) مثل بسیاری دیگر از سیستم های مدیریت محتوا دو محیط کاری مختلف وجود دارد، یکی برای کاربر و دیگری برای مدیر وب سایت.

همانطور که در پوشه بالا مشاهده می کنید یک پوشه با نام administrator وجود دارد. تمام فایل های مربوط به سمت مدیر (قسمت مدیریت) در داخل این پوشه قرار می گیرند (آدرس دسترسی به قسمت مدیریت به این شکل است: http://localhost/joomla3.7/administrator/index.php). از دیگر پوشه های مهم موجود در دایرکتوری ریشه جوملا، باید به components، images ، modules، plugins، و templates اشاره کنم. به راحتی از نام این پوشه ها می توانیم بفهمیم که محتویات هر کدام از پوشه ها مربوط به چه چیزی است: کامپوننت ها، تصاویر (تصاویری که در داخل مقالات قرار می گیرند، در داخل همین پوشه یا زیرپوشه های آن بارگذاری خواهند شد)، ماژول ها، پلاگین ها، و تمپلیت ها (الگوها) ی مربوط به وب سایت. تا همینجا هم خیلی خوب است که با ساختار کلی پوشه ها آشنا باشیم و بدانیم فایل های هر قسمت از جوملا در داخل کدام پوشه قرار دارد.

در دایرکتوری ریشه جوملا، دو فایل بسیار مهم هم (با پسوند.php) وجود دارد. فایل configuration.php همانطور که از نامش پیداست، مربوط به تنظیمات پیکربندی جوملاست و فایل index.php قلب تپنده جوملاست! با استفاده از فایل index جوملا مشخص می کند که محتویات کدام فایل(ها) باید فراخوانی شود و محتویات صفحه باید چگونه ایجاد شده و نمایش داده شود. همه کارها و پردازش های اصلی، برای تعیین نوع عملی که قرار است اتفاق بیفتد، توسط فایل index.php انجام می شود. فعلا می توانید این دو فایل را بایک ویرایشگر (مثلا notepad یا dremWeaver) باز کنید و محتویاتشان را بدون اینکه تغییری در آنها ایجاد کنید مشاهده نمایید.

برای نمونه، پوشه templates را باز می کنم و محتویات داخل آن را باهم مشاهده می کنیم. همانطور که در بالا اشاره کردم، الگوهای مربوط به وب سایت در داخل این پوشه قرار دارند:

در شکل بالا می بینید که سه پوشه در داخل پوشه templates وجود دارد. تعداد این پوشه ها بستگی به تعداد الگوها (تمپلیت)یی دارد که شما نصب کرده اید. در حال حاضر سه الگو برای جوملایی که من نصب کرده ام، نصب شده است. این سه الگو، همان الگوهایی هستند که در قسمت مدیریت می توانیم به آنها دسترسی داشته باشیم و یکی از آنها را به عنوان الگوی طرف کاربر انتخاب کنیم.

بد نیست به پوشه administrator هم سری بزنیم:

در شکل بالا می بینید که پوشه های مختلفی در داخل پوشه administrator وجود دارد که در آینده در هرجا که لازم شد به محتویات آنها اشاره خواهم کرد. اما نکته جالب در این است که پوشه های components، modules، و templates که در داخل دایرکتوری ریشه جوملا وجود داشت و قبلا به آنها اشاره کردم، در داخل این دایرکتوری (پوشه) هم وجود دارد. البته پوشه های مشابه دیگری نیز وجود دارد. این ها کامپوننت ها، ماژول ها، و الگوهای مربوط به قسمت مدیریت هستند. یعنی یا فقط مربوط به تنظیمات قسمت مدیریت هستند یا مربوط به رابط کاربری یک کامپوننت یا ماژول خاص در محیط مدیریت جوملا هستند. مثلا در پوشه templates نسخه ای که من نصب کرده ام سه پوشه متفاوت وجود دارد که ظاهرا نشان می دهد می توانم برای قسمت مدیریت یکی از این سه الگو را انتخاب کنم:

شما می توانید خودتان وارد سایر پوشه ها شوید و پوشها و فایل های داخل هر کدام را مشاهده و بررسی کنید. این کار باعث می شود با ساختار پوشه ها و فایل ها در جوملا آشنا شوید. نگران نباشید اگر متوجه نمی شوید هر کدام از پوشه ها یا فایل ها مربوط به چه چیزی است. به مرور زمان با این موارد آشنا خواهید شد.

۲ نظر موافقین ۱ مخالفین ۰ ۲۲ تیر ۹۶ ، ۱۱:۵۹
مهرداد یوسفی فرد