Grav CMS-এ Twig Template ব্যবহার করে আপনি কাস্টম ব্লক তৈরি করতে পারেন, যা সাইটের ডিজাইন এবং কনটেন্ট স্ট্রাকচারকে আরও নমনীয় এবং কাস্টমাইজেবল করে তোলে। Twig হল Grav এর টেমপ্লেট ইঞ্জিন, যা আপনাকে সহজে কাস্টম টেমপ্লেট তৈরি করতে সহায়তা করে। Advanced Twig Template ব্যবহার করে আপনি custom blocks তৈরি করতে পারেন, যা সাইটের পেজে বিভিন্ন অংশে কনটেন্ট অথবা ডিজাইন উপাদান বসানোর জন্য উপযুক্ত।
এই গাইডে, আমরা দেখব কীভাবে Advanced Twig Template ব্যবহার করে Grav-এ Custom Block তৈরি করা যায় এবং কীভাবে সেগুলি সাইটের বিভিন্ন স্থানে প্রয়োগ করা যায়।
১. Twig Template Blocks কী?
Twig Blocks হল টেমপ্লেটের এমন সেগমেন্ট যা ডিফল্ট টেমপ্লেটে সেট করা থাকে এবং সেই সেগমেন্টগুলি আপনার কাস্টম টেমপ্লেটে রিপ্লেস বা অ্যাড করা যায়। ব্লকগুলি সাধারণত এমন জায়গায় ব্যবহার করা হয় যেখানে আপনি কিছু নির্দিষ্ট কনটেন্ট প্রদর্শন করতে চান।
উদাহরণ: যেমন, একটি ব্লগ পেজের মধ্যে আপনি ট্যাগ বা ক্যাটাগরি ভিত্তিক কনটেন্ট বা কোনও কাস্টম স্টাইলেড সেকশন যোগ করতে চান।
২. Custom Block তৈরি করা
Grav CMS-এ Twig Block তৈরি করতে, আপনাকে প্রথমে একটি base template তৈরি করতে হবে যা ব্লকের ডিফাইনেশন হবে। এই টেমপ্লেট ফাইলের মধ্যে আপনি ব্লক কোড এবং কনটেন্ট রাখবেন, এবং সেই ব্লকটি পরে সাইটের বিভিন্ন পেজে ব্যবহার করতে পারবেন।
১. Base Template তৈরি করা
প্রথমে, একটি base.twig ফাইল তৈরি করুন যা মূল টেমপ্লেট হবে। এই ফাইলে আমরা ব্লক ডিফাইন করব।
user/themes/your-theme/templates/base.twig:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{{ page.title }}</title>
</head>
<body>
<header>
<h1>{{ page.header.title }}</h1>
</header>
<main>
<section class="content">
{{ block('content') }}
</section>
</main>
<footer>
<p>© 2024 Your Site</p>
</footer>
</body>
</html>
এখানে:
{{ block('content') }}: এই ব্লকটি ডিফাইন করা হয়েছে এবং এটি সাইটের পেজে কনটেন্ট দেখানোর জন্য ব্যবহৃত হবে।- আপনি এই ব্লকের মাধ্যমে কনটেন্টের অংশ পরিবর্তন করতে পারবেন, যেমন পেজের বিভিন্ন অংশে কাস্টম কনটেন্ট বা ডিজাইন ব্লক ইনজেক্ট করা।
২. Custom Block তৈরি করা
এখন, আপনি একটি কাস্টম ব্লক তৈরি করতে পারেন যেটি এই টেমপ্লেটের অংশ হিসেবে ব্যবহৃত হবে। এর জন্য, টেমপ্লেট ফাইলের ভিতরে কাস্টম ব্লক ডিফাইন করুন।
user/themes/your-theme/templates/custom_block.twig:
{% block content %}
<div class="custom-block">
<h2>Welcome to Our Custom Block!</h2>
<p>This is a custom block created using Twig template in Grav CMS.</p>
</div>
{% endblock %}
এখানে:
{% block content %}: এটিbase.twigফাইলে যেভাবেcontentব্লককে রিপ্লেস বা যোগ করার জন্য ব্যবহৃত হয়।- এই কোডের মধ্যে আপনি কাস্টম HTML এবং Twig কোড ব্যবহার করে ব্লকটি কাস্টমাইজ করেছেন।
৩. Custom Block ব্যবহার করা
এখন যে কাস্টম ব্লক তৈরি করেছেন তা সাইটের অন্যান্য টেমপ্লেটে ব্যবহার করতে পারবেন। উদাহরণস্বরূপ, যদি আপনি এই কাস্টম ব্লকটি পেজের মধ্যে ব্যবহার করতে চান, তাহলে আপনার page.twig ফাইলের মধ্যে নিম্নলিখিত কোডটি ব্যবহার করতে হবে।
user/themes/your-theme/templates/page.twig:
{% extends 'base.twig' %}
{% block content %}
{{ parent() }}
<div class="extra-content">
{% include 'templates/custom_block.twig' %}
</div>
{% endblock %}
এখানে:
{% extends 'base.twig' %}: এই টেমপ্লেটটিbase.twigফাইলের সাথে এক্সটেন্ড হচ্ছে, যাতে ব্লক এবং অন্যান্য কনটেন্ট ব্যবহার করা যায়।{{ parent() }}: এটিbase.twigফাইলের ডিফাইন করা কনটেন্টকে রিপ্লেস বা অ্যাড করতে ব্যবহৃত হয়।{% include 'templates/custom_block.twig' %}: এটি কাস্টম ব্লক যোগ করার জন্য ব্যবহার করা হয়েছে, যাতেcustom_block.twigটেমপ্লেটটি এই পেজে অন্তর্ভুক্ত করা হয়।
৪. Advanced Twig ফিচার ব্যবহার করে Custom Block কাস্টমাইজ করা
Grav CMS-এ Advanced Twig ব্যবহার করে আপনি আরও ডাইনামিক এবং কাস্টমাইজেবল ব্লক তৈরি করতে পারেন। আপনি variables, loops, এবং conditions ব্যবহার করে ব্লকগুলোর কনটেন্ট আরও নমনীয় করতে পারেন।
১. Dynamic Content in Block
গ্রাভ টেমপ্লেটে আপনি কাস্টম ব্লকগুলিতে ডাইনামিক কনটেন্ট যোগ করতে পারেন। উদাহরণস্বরূপ, ব্লকটির মধ্যে looping বা conditions ব্যবহার করতে পারেন।
user/themes/your-theme/templates/dynamic_block.twig:
{% block content %}
<div class="dynamic-block">
<h2>{{ page.header.title }}</h2>
<ul>
{% for item in page.collection() %}
<li>{{ item.title }}</li>
{% endfor %}
</ul>
</div>
{% endblock %}
এখানে:
page.collection(): এটি সমস্ত পেজ বা কনটেন্টের অ্যারে আনে, যার মাধ্যমে আপনি ডাইনামিক লিস্ট বা কনটেন্ট প্রদর্শন করতে পারেন।
২. Conditions for Custom Blocks
আপনি শর্ত ব্যবহার করে কাস্টম ব্লকের কনটেন্ট নিয়ন্ত্রণ করতে পারেন।
user/themes/your-theme/templates/conditional_block.twig:
{% block content %}
{% if page.header.show_custom_block %}
<div class="conditional-block">
<h3>{{ page.title }}</h3>
<p>{{ page.content }}</p>
</div>
{% endif %}
{% endblock %}
এখানে:
{% if page.header.show_custom_block %}: এই শর্তটি চেক করবে যে, পেজের হেডারে একটি নির্দিষ্ট বৈশিষ্ট্যshow_custom_blockসত্য কিনা এবং তার ভিত্তিতে ব্লকটি প্রদর্শন করবে।
সারাংশ
Grav CMS-এ Advanced Twig Template ব্যবহার করে Custom Block তৈরি করা খুবই নমনীয় এবং শক্তিশালী। আপনি কাস্টম ব্লক তৈরি করতে Twig Block ফিচার ব্যবহার করে সাইটের ডিজাইন এবং কনটেন্ট কাস্টমাইজ করতে পারেন। Grav এর টেমপ্লেট সিস্টেমের মাধ্যমে আপনি কাস্টম ব্লকগুলিকে ডাইনামিক কনটেন্ট, শর্ত এবং লুপ ব্যবহার করে আরও কার্যকরী এবং নমনীয় করে তুলতে পারেন। এই কাস্টম ব্লকগুলো সাইটের বিভিন্ন স্থানে প্রয়োগ করে আপনি একটি শক্তিশালী এবং কাস্টমাইজড ডিজাইন তৈরি করতে পারবেন।
Read more
