আসসালামু আলাইকুম, কেমন আছেন সবাই? আশা করছি সকলেই ভালো আছেন আজকে আমি শাকিল মাহমুদ হাজির হয়েছি ওয়ার্ডপ্রেস ডেভেলোপমেন্ট কোর্সের ৩ নাম্বার পার্ট নিয়ে। এই পর্বে ওয়ার্ডপ্রেস থিমের সকল ফাইল স্ট্রাকচার সম্পর্কে বুঝাবো। তো চলুন শুরু করা যাক!
WordPress Theme-এর ভিতরে অনেক ধরনের File থাকে। প্রতিটি File-এর আলাদা আলাদা কাজ রয়েছে। Theme Development শেখার সময় কোন File কেন ব্যবহার করা হয়, সেটা জানা খুবই গুরুত্বপূর্ণ।
আজকে আমরা শুধু WordPress Theme-এর File নিয়ে আলোচনা করব। Folder বা অন্য কোনো বিষয় নয়—একটি Theme-এর ভিতরে থাকা গুরুত্বপূর্ণ Fileগুলো কী এবং কোন File কী কাজ করে, সেটাই দেখব।
১. style.css
style.css হলো WordPress Theme-এর সবচেয়ে গুরুত্বপূর্ণ Fileগুলোর একটি।
এখানে Theme-এর CSS Code লেখা হয়। পাশাপাশি এই File-এর শুরুতে Theme-এর Information দেওয়া থাকে।
যেমন:
/*
Theme Name: My Theme
Author: Shakil
Version: 1.0
Description: My Custom WordPress Theme
*/
WordPress এই Information ব্যবহার করে Theme-টিকে শনাক্ত করে।
কাজ:
- Theme-এর নাম নির্ধারণ করা
- Author Information দেওয়া
- Theme Version দেওয়া
- CSS Style লেখা
২. functions.php
functions.php হলো Theme-এর Functionality-এর অন্যতম প্রধান File।
Theme-এর বিভিন্ন Function, Hook, Filter, Menu Registration, Widget Registration, CSS এবং JavaScript Enqueue ইত্যাদি কাজ এখানে করা হয়।
যেমন:
<?php
function mytheme_setup() {
add_theme_support('post-thumbnails');
}
add_action('after_setup_theme', 'mytheme_setup');
তবে মনে রাখতে হবে, functions.php WordPress-এর মূল Function File নয়। এটি মূলত নির্দিষ্ট Theme-এর Functionality পরিচালনা করে।
৩. index.php
index.php হলো Classic WordPress Theme-এর প্রধান এবং সবচেয়ে গুরুত্বপূর্ণ Template File।
কোনো নির্দিষ্ট Content-এর জন্য WordPress উপযুক্ত Template না পেলে index.php অনেক সময় Fallback হিসেবে ব্যবহার করে।
একটি Theme-এ index.php থাকা অত্যন্ত গুরুত্বপূর্ণ।
৪. header.php
নাম থেকেই বোঝা যায়, header.php সাধারণত Website-এর Header অংশের জন্য ব্যবহৃত হয়।
এখানে সাধারণত থাকে:
- HTML Document শুরু
<head>- Website Logo
- Navigation Menu
- Header Content
এখানে সাধারণত wp_head() ব্যবহার করা হয়।
<?php wp_head(); ?>
৫. footer.php
footer.php Website-এর Footer অংশের জন্য ব্যবহৃত হয়।
যেমন:
- Copyright
- Footer Menu
- Footer Widget
- অন্যান্য Footer Content
এখানে সাধারণত:
<?php wp_footer(); ?>
ব্যবহার করা হয়।
৬. sidebar.php
Theme-এ Sidebar থাকলে তার Template সাধারণত sidebar.php File-এ রাখা হয়।
যেমন:
- Recent Posts
- Categories
- Search
- Widgets
- Advertisement
ইত্যাদি Sidebar Content এখানে দেখানো যেতে পারে।
৭. front-page.php
front-page.php Website-এর Front Page বা মূল Homepage-এর জন্য ব্যবহার করা হয়।
আপনি যদি WordPress Website-এর Homepage নিজের মতো করে Design করতে চান, তাহলে এই File খুব গুরুত্বপূর্ণ।
৮. home.php
home.php নিয়ে Beginner-দের মধ্যে অনেক Confusion থাকে।
home.php সবসময় Website-এর Main Homepage বোঝায় না।
WordPress-এর ক্ষেত্রে এটি সাধারণত Blog Posts Index দেখানোর জন্য ব্যবহৃত হয়।
অর্থাৎ Website-এর Front Page এবং Blog Page আলাদা হলে home.php Blog Posts-এর জন্য ব্যবহৃত হতে পারে।
৯. page.php
WordPress-এর সাধারণ Page দেখানোর জন্য page.php ব্যবহার করা হয়।
যেমন:
- About Us
- Contact
- Services
- Privacy Policy
ইত্যাদি সাধারণ Page-এর জন্য এটি ব্যবহৃত হতে পারে।
১০. single.php
একটি নির্দিষ্ট Blog Post দেখানোর জন্য single.php ব্যবহার করা হয়।
যেমন:
example.com/my-first-post/
এই ধরনের Single Blog Post-এর Title, Featured Image, Content, Author, Date ইত্যাদি single.php থেকে প্রদর্শন করা যায়।
১১. singular.php
singular.php হলো Single Content-এর জন্য একটি General Template।
যদি নির্দিষ্ট single.php বা page.php না পাওয়া যায়, তাহলে WordPress Template Hierarchy অনুযায়ী singular.php ব্যবহার করতে পারে।
এটি মূলত Post এবং Page-এর মতো Singular Content-এর জন্য একটি General Template হিসেবে কাজ করে।
১২. archive.php
Archive ধরনের Page-এর জন্য archive.php ব্যবহার করা হয়।
যেমন:
- Category Archive
- Tag Archive
- Author Archive
- Date Archive
- অন্যান্য Archive
নির্দিষ্ট Archive Template না থাকলে এটি সাধারণ Archive Template হিসেবে কাজ করতে পারে।
১৩. category.php
Category-এর Postগুলো দেখানোর জন্য category.php ব্যবহার করা হয়।
যেমন Website-এ:
WordPress
নামে একটি Category আছে।
এই Category-এর Post List দেখানোর জন্য category.php ব্যবহার করা যেতে পারে।
১৪. tag.php
Tag Archive-এর জন্য tag.php ব্যবহার করা হয়।
ধরুন Website-এ WordPress নামে একটি Tag রয়েছে।
সেই Tag-এর অধীনে থাকা Postগুলো দেখানোর জন্য tag.php ব্যবহার করা যেতে পারে।
১৫. author.php
কোনো নির্দিষ্ট Author-এর লেখা Postগুলো দেখানোর জন্য author.php ব্যবহার করা হয়।
যেমন:
example.com/author/shakil/
এই ধরনের Author Archive Page-এর Template হিসেবে author.php কাজ করতে পারে।
১৬. date.php
তারিখ অনুযায়ী Post Archive দেখানোর জন্য date.php ব্যবহার করা হয়।
যেমন:
- নির্দিষ্ট বছরের Post
- নির্দিষ্ট মাসের Post
- নির্দিষ্ট দিনের Post
ইত্যাদি।
১৭. search.php
Website-এর Search Result Page-এর জন্য search.php ব্যবহার করা হয়।
যখন Visitor Website-এ কোনো Keyword Search করে, তখন Search Result কীভাবে প্রদর্শিত হবে সেটা এই File দিয়ে Customize করা যায়।
১৮. 404.php
Website-এ এমন কোনো URL Visit করা হলে যেটা পাওয়া যাচ্ছে না, তখন 404 Page দেখানো হয়।
এই Page-এর Design এবং Content Customize করার জন্য:
404.php
ব্যবহার করা হয়।
যেমন:
Page Not Found
Sorry, the page you are looking for doesn't exist.
১৯. comments.php
WordPress Post-এর Comment Section নিয়ন্ত্রণ করার জন্য comments.php ব্যবহার করা হয়।
এখানে থাকতে পারে:
- Comment List
- Comment Form
- Comment Author
- Comment Date
- Reply Option
ইত্যাদি।
২০. searchform.php
Theme-এর Search Form Customize করার জন্য searchform.php ব্যবহার করা হয়।
যেমন:
[ Search here... ] [Search]
এই Search Box-এর HTML Structure এখানে রাখা যায়।
২১. screenshot.png
screenshot.png কোনো Template File নয়।
এটি Theme-এর Preview Image হিসেবে ব্যবহৃত হয়।
WordPress Admin-এর Themes Section-এ Theme-এর যে Preview Image দেখা যায়, সেটি সাধারণত এই File থেকে আসে।
Template Part-এর File
বড় Theme-এ একই Code বারবার না লিখে ছোট ছোট অংশ আলাদা File-এ রাখা হয়। এগুলোকে সাধারণত Template Part বলা হয়।
২২. content.php
সাধারণ Post Content দেখানোর জন্য content.php ব্যবহার করা যায়।
যেমন:
- Post Title
- Featured Image
- Excerpt
- Read More
ইত্যাদি।
২৩. content-single.php
Single Post-এর Content আলাদা করে রাখার জন্য content-single.php ব্যবহার করা হয়।
এতে Single Post-এর:
- Title
- Content
- Meta Information
- Featured Image
ইত্যাদি রাখা যায়।
২৪. content-page.php
সাধারণ WordPress Page-এর Content আলাদা Template File-এ রাখতে চাইলে content-page.php ব্যবহার করা যায়।
২৫. content-search.php
Search Result-এর প্রতিটি Content আলাদাভাবে Design করার জন্য content-search.php ব্যবহার করা যেতে পারে।
২৬. content-none.php
কোনো Content পাওয়া না গেলে যে Message বা Layout দেখানো হবে, সেটি content-none.php-তে রাখা যায়।
যেমন:
Nothing Found
Sorry, no results were found.
Custom Template File
২৭. Custom Page Template
WordPress-এ নিজের প্রয়োজন অনুযায়ী Custom Page Template File তৈরি করা যায়।
যেমন:
full-width.php
এর শুরুতে:
<?php
/*
Template Name: Full Width
*/
লিখলে WordPress এটিকে একটি Custom Page Template হিসেবে চিনতে পারে।
এভাবে:
contact-template.php
landing-page.php
full-width.php
এরকম নিজের প্রয়োজন অনুযায়ী Template File তৈরি করা সম্ভব।
WordPress Block Theme-এর গুরুত্বপূর্ণ File
Modern WordPress-এর Block Theme-এ Classic Theme-এর PHP Template-এর পাশাপাশি HTML Template File ব্যবহৃত হয়।
২৮. theme.json
theme.json Modern WordPress Theme-এর অত্যন্ত গুরুত্বপূর্ণ একটি Configuration File।
এর মাধ্যমে Theme-এর বিভিন্ন:
- Color
- Typography
- Font Size
- Spacing
- Layout
- Global Style
- Block Settings
নিয়ন্ত্রণ করা যায়।
২৯. index.html
Block Theme-এর একটি গুরুত্বপূর্ণ Template File হলো:
index.html
এটি Theme-এর General/Fallback Block Template হিসেবে কাজ করতে পারে।
৩০. single.html
Block Theme-এ Single Post-এর Layout নির্ধারণ করার জন্য:
single.html
ব্যবহার করা হয়।
৩১. page.html
সাধারণ WordPress Page-এর জন্য Block Theme-এ:
page.html
ব্যবহার করা যায়।
৩২. archive.html
Archive Content-এর Layout নির্ধারণ করার জন্য:
archive.html
ব্যবহার করা হয়।
৩৩. 404.html
Block Theme-এর 404 Page-এর জন্য:
404.html
ব্যবহার করা হয়।
৩৪. header.html
Block Theme-এ Header-এর Reusable অংশের জন্য:
header.html
ব্যবহার করা যেতে পারে।
৩৫. footer.html
Block Theme-এ Footer-এর জন্য:
footer.html
ব্যবহার করা যেতে পারে।
Theme File Structure এক নজরে
একটি বড় Classic Theme-এর গুরুত্বপূর্ণ Fileগুলো একসাথে দেখলে এমন হতে পারে:
my-theme/
│
├── style.css
├── functions.php
├── index.php
├── header.php
├── footer.php
├── sidebar.php
│
├── front-page.php
├── home.php
├── page.php
├── single.php
├── singular.php
├── archive.php
├── category.php
├── tag.php
├── author.php
├── date.php
├── search.php
├── 404.php
│
├── comments.php
├── searchform.php
├── screenshot.png
│
├── content.php
├── content-single.php
├── content-page.php
├── content-search.php
├── content-none.php
│
└── custom-template.php
আর Modern Block Theme-এর ক্ষেত্রে গুরুত্বপূর্ণ Fileগুলো হতে পারে:
my-theme/
│
├── style.css
├── functions.php
├── theme.json
│
├── templates/
│ ├── index.html
│ ├── single.html
│ ├── page.html
│ ├── archive.html
│ └── 404.html
│
└── parts/
├── header.html
└── footer.html
সবশেষে একটা বিষয় মনে রাখবেন—একটি WordPress Theme-এ উপরের সব File থাকা বাধ্যতামূলক নয়। Theme-এর প্রয়োজন অনুযায়ী File তৈরি করা হয়। WordPress-এর Template Hierarchy নির্ধারণ করে কোন Content-এর জন্য কোন Template File ব্যবহার করা হবে।
WordPress Theme Development ভালোভাবে শিখতে হলে তাই File-এর নাম মুখস্থ করার চেয়ে প্রতিটি File-এর কাজ এবং WordPress কখন সেই File ব্যবহার করে—এটা বোঝাই সবচেয়ে গুরুত্বপূর্ণ।