آموزش جوملا

5 1 1 1 1 1 1 1 1 1 1 امتیاز 5.00 (1 رای)

نحوه اضافه کردن CSS سفارشی به سایت در جوملا

custom css JOOMLA

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


 مرحله 1. ایجاد فایل CSS

قبل از هرکاری شما، مهم ترین کار آشنایی با کدهای CSS ای می باشد که می خواهید آن ها را اضافه کنید.

  •    کدهای CSS سفارشی خود را به یک فایل به نام mycustom.css اضافه کنید.
  • این فایل را در جایی دلخواه در سایت خود آپلود کنید. به طور مثال ما این فایل را در CSS قالب ها آپلود می کنیم پوشه templates / mytemplate / css / mycustom.css، اما شما می توانید این فایل را در هر موقعیتی که می خواهید قرار دهید.

 مرحله 2. دانلود و نصب پلاگین

  • برای دانلود افزونه CSS سفارشی به صفحه افزونه ها بروید و روی دکمه دانلود کلیک کنید.

download add custom css plugin

  • پس از ورود به قسمت مدیریت administrator سایت خود، به افزونه ها > مدیریت > نصب بروید.
  • در تب «آپلود فایل بسته» بر روی کادر سبز رنگ کلیک کرده و پلاگین موردنظر خود را انتخاب کنید.

Add Custom CSS

  • فایل نصبی پلاگین را پیدا کرده و سپس بر روی آن دوبار کلیک کنید.
  • شما اکنون پلاگین مورد نیاز خود را برای ایجاد سبک های CSS سفارشی خود برای سایت جوملا خود نصب کرده اید. اکنون می توانید پیکربندی های لازم را روی آن انجام دهید.

 مرحله 3. راه اندازی پلاگین

  • به افزونه ها > پلاگین ها بروید.
  • "System - Add Custom CSS" را جستجو کنید.

Setup the plugin

  • برای باز کردن پلاگین به منظور ویرایش کردن آن، روی عنوان پلاگین کلیک کنید.
  • سپس در صفحه این پلاگین، در فیلد Custom CSS File 1 Path، مسیر را فایل CSS خود وارد کنید. در این مثال، همانطور که در ابتدای این آموزش ذکر شد، ما مسیر templates / mytemplate / css / mycustom.css را انتخاب کردیم.

 Custom CSS File 1 Path

  •  پلاگین را فعال کنید ( در قسمت بالا سمت چپ حالت را بر روی «فعال» تنظیم کنید)
  • تغییرات را ذخیره و صفحه ببندید.

 مرحله 4. بررسی نتیجه

پس از وارد کردن کد CSS خود و تنظیم پلاگین "Add Custom CSS" اکنون به سایت خود رفته و تغییرات را مشاهده کنید.

این مطلب را به اشتراک بگذارید در :

نظرات (0)

تابحال برای این مطلب نظری داده نشده است .

نظر خود را اضافه کنید.

  1. ارسال نظر به صورت مهمان . ثبت نام یا ورود
پیوست ها (0 / 1)
Share Your Location