সিএসএস ওভাররাইড কেন ব্যবহার করবেন?
আপনি যদি প্রাক-বিল্ট জুমলা টেম্পলেট ব্যবহার করেন তবে আপনার সিএসএস শৈলীগুলি বিদ্যমান টেম্পলেট স্টাইলিং থেকে আলাদা রাখা সর্বদা একটি ভাল ধারণা।
- এটি বজায় রাখা আরও সহজ
- আপনি যদি টেমপ্লেট আপগ্রেড করেন তবে আপনার পরিবর্তনগুলি নষ্ট হবে না
- আপনি পরিবর্তনগুলি অনুলিপি করে অন্য টেম্পলেট বা অন্য কোনও সাইটে সরিয়ে নিতে পারবেন।
সিএসএস কীভাবে কাজ করে?
সিএসএস অর্থ "ক্যাসকেডিং স্টাইল শিটস", এই প্রসঙ্গে "ক্যাসকেডিং" এর অর্থ এই যে একাধিক স্টাইলশিট বিধি এইচটিএমএলের একটি নির্দিষ্ট অংশে প্রয়োগ হতে পারে, তাই ব্যবহৃত নিয়মকে আরও সাধারণ নিয়ম থেকে নির্দিষ্ট নির্দিষ্ট নিয়মে ক্যাসকেড করে বেছে নেওয়া হয় ( সুনির্দিষ্ট সুনির্দিষ্ট নিয়মটি বেছে নেওয়া হয়), বা কোনও উপাদানের নিয়মের ক্রমের ভিত্তিতে (পাওয়া শেষ নিয়মটি নির্বাচিত হয়)।
আপনার কাস্টমাইজড সিএসএস ফাইল যতক্ষণ না ডিফল্ট টেমপ্লেট সিএসএস ফাইলগুলির পরে লোড করা হয় ততক্ষণ আপনি প্রয়োজন অনুযায়ী নির্দিষ্ট উপাদানগুলিকে ওভাররাইড করার জন্য আপনার নিজস্ব শৈলী যুক্ত করতে পারেন (নীচে সেই সাথে কিছু ব্যতিক্রম রয়েছে)।
সাধারণ ব্যবহার
জুমলা <head>ট্যাগে একটি কাস্টম স্টাইল শীট লোড করতে , আপনার ফাইলটি শেষের দিকে লোড হওয়া নিশ্চিত করার জন্য শেষ ট্যাগের ঠিক আগে আপনার কোডটি index.php( YOURDOMAIN.COM/templates/yourtemplate/index.php) এর ফাইলটিতে নিম্নলিখিত কোড যুক্ত করা যেতে পারে </head>।
JHtml::_('stylesheet', JUri::root() . 'templates/' . $this->template . '/css/custom.css');
(সিএসএস ফাইলের কোনও নাম থাকতে পারে এবং এটি / সিএসএস / সাবফোল্ডারটিতে থাকতে হবে না তবে এটি সেভাবে পরিষ্কার))
এটি একটি সাধারণ <link>ট্যাগ যুক্ত করাও সম্ভব তবে এটি উল্লিখিত বিকল্পের চেয়ে কম নমনীয়:
<link rel="stylesheet" href="/joomla//templates/mytemplate/css/custom.css" type="text/css" />
! গুরুত্বপূর্ণ
কিছু এক্সটেনশানগুলি আপনার সিএসএস শৈলীগুলি আপনার পরে লোড হতে পারে (বা এমনকি সরাসরি সূচি.পিএফপি ফাইলটিতে শৈলী যুক্ত করতে পারে), যাতে আপনার ওভাররাইডগুলি ওভাররাইড করে। এটি সাধারণত !importantআপনার স্টাইলগুলিতে যুক্ত করে সমাধান করা যায় ।h1{color:red!important;}
বিভিন্ন ফ্রেমওয়ার্কে ব্যবহার
এখন মজার অংশ: অনেকগুলি টেম্পলেট ফ্রেমওয়ার্কগুলির সম্ভাবনা রয়েছে যে ব্যবহারকারীরা তাদের টেম্পলেটগুলিতে পরিবর্তন করতে চান, এইভাবে আপনার সিএসএস ওভাররাইডগুলি অন্তর্ভুক্ত করার একটি সহজ উপায় যুক্ত করে। এখানে কয়েকটি পদ্ধতি ব্যবহার করা হল:
রকেট থেম গ্যান্ট্রি 4
রকেট থেম টেমপ্লেটগুলি গ্যান্ট্রি ফ্রেমওয়ার্ক দ্বারা চালিত হয় এবং যদি স্বনির্ধারিত CSS ফাইল পাওয়া যায় তবে স্বয়ংক্রিয়ভাবে লোড হবে will সিএসএস ফাইল অবশ্যই /templates/yourtemplate/css/ফোল্ডারে রাখতে হবে এবং নামটি অবশ্যই থাকা উচিতYOURTEMPLATEFOLDER-custom.css ।
উদাহরণ: আপনি যদি তাদের বিনামূল্যে Afterburner 2টেম্পলেট ব্যবহার করেন তবে ডিফল্ট টেম্পলেট ডিরেক্টরিটি /templates/rt_afterburner2/। rt_afterburner-custom.css/ সিএসএস / সাবফোল্ডারটিতে আন্ডারস্কোর এবং হাইফেন সহ কেয়ারফুল নামে একটি ফাইল যুক্ত করুন এবং এটি গ্যান্ট্রি ফ্রেমওয়ার্ক দ্বারা স্বয়ংক্রিয়ভাবে লোড হবে।
আকার 5
custom.cssআপনার টেমপ্লেটের / সিএসএস / উপ-ডিরেক্টরিতে একটি খালি ফাইল সহ 5 টি টেম্পলেট শিপান। এই ফাইলটিতে কেবল আপনার শৈলী যুক্ত করুন এবং সেগুলি আপনার বিন্যাসে অন্তর্ভুক্ত হবে।
গ্যাভিক প্রো
গ্যাভিক প্রো টেম্পলেটগুলি overrides.css/ সিএসএস / উপ-ডিরেক্টরিতে ফাঁকা ফাইল সহ শিপ করে। তবে নোট করুন যে এই ফাইলটি ডিফল্টরূপে লোড করা হয়নি, আপনাকে Override CSSটেমপ্লেট সেটিংসে উন্নত সেটিংস ট্যাবটিতে সক্রিয় করতে হবে ।
জুমলা শাইন
আপনার টেমপ্লেটের / সিএসএস / সাবফোল্ডারে একটি কাস্টম সিএসএস ফাইল তৈরি করুন custom.cssএবং ফাইলটির নামটি এখানে নির্দিষ্ট করুন Extensions -> Templates -> [template name] -> SEO & System -> Custom CSS/JS File(s)।
টি 3 ফ্রেমওয়ার্ক
টি 3 ফ্রেমওয়ার্কের উপর ভিত্তি করে custom.cssটেম্পলেটগুলি আপনার টেমপ্লেটের / সিএসএস / সাবফোল্ডারটিতে কোনও ফাইল অন্তর্ভুক্ত করতে পারে না (কেবল এটি উপস্থিত না থাকলে এটি তৈরি করুন) তবে উপস্থিত থাকলে ফাইলটি অন্য কোনও সিএসএস ফাইলের পরে লোড হবে be
ওয়ার্প ফ্রেমওয়ার্ক
ওয়ার্প ফ্রেমওয়ার্কের উপর ভিত্তি করে টেম্পলেটগুলি স্বয়ংক্রিয়ভাবে custom.css/ সিএসএস / সাবফোল্ডারে পাওয়া ফাইলটি লোড করে। অতিরিক্ত সিএসএস ফাইল যুক্ত করে লোড করা যায়
$this->warp->stylesheets->add('css:yourcssfile.css');
ফাইলটি /layouts/template.config.php।