Unlimited Wordpress themes, plugins, graphics & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Web Design
  2. WordPress

Redux ফ্রেমওয়ার্ক দিয়ে আপনার নিজস্ব ওয়ার্ডপ্রেস থিম অপশন প্যানেল তৈরি করুন

by
Length:MediumLanguages:

Bengali (বাংলা) translation by Shakila Humaira (you can also view the original English article)

রিডাক্স ফ্রেমওয়ার্ক হচ্ছে জনপ্রিয়, উন্নত ফ্রেমওয়ার্কগুলোর মধ্যে অন্যতম যা ওয়ার্ডপ্রেস থিম ও প্লাগিনের জন্য বিনামুল্যে ব্যবহার করা যায়। এর ফ্লেক্সিবিলিটি বা নমনীয়তার কারণে আপনি আপনার ওয়ার্ডপ্রেস প্রজেক্টের জন্য যেকোনো ধরণের অপশন এবং সেটিংস তৈরি করতে পারবেন। 

এই টিউটোরিয়ালে আমি আপনাকে দেখাবো কিভাবে আপনি আপনার নিজস্ব থিমে রিডাক্স ফ্রেমওয়ার্ক ইন্সটল, কাস্টমাইজ ও ব্যবহার করতে পারবেন।

আমরা নিন্মোক্ত ধাপ অনুযায়ী অগ্রসর হবো:

  1. ইন্সটল করা
  2. সাধারণ কনফিগারেশন
  3. একটি অপশন প্যানেল তৈরি করা
  4. একটি থিমে অপশনসমূহ ব্যবহার করা।

নোটঃ আমি এই টিউটোরিয়ালে রিডাক্স ফ্রেমওয়ার্ককে  Redux হিসেবে বর্ণনা করবো। এটা Redux এর সঙ্গে গুলিয়ে ফেলবেন না যা জাভাস্ক্রিপ্ট অ্যাপসমূহের জন্য সাধারনত একটি স্ট্যাট কন্টেইনার।

১। ইন্সটল করা

তিনটি উপায়ে আপনি আপনার প্রজেক্টে রিডাক্স ফ্রেমওয়ার্ক ব্যবহার করতে পারেনঃ

  • আলাদা প্লাগিন হিসেবে ইন্সটল করা।
  • থিম কোর ফাইলে অন্তর্ভুক্ত করা।
  • থিম-নির্ভর প্লাগিন হিসেবে অন্তর্ভুক্ত করা।

আলাদা প্লাগিন হিসেবে ইন্সটল করা

ডিফল্টরূপে রিডাক্স প্লাগিন হিসেবে ইন্সটল করা যায়। আপনি যদি রিডাক্স ফ্রেমওয়ার্ক ওয়ার্ডপ্রেস প্লাগিন পেইজে যান তাহলে দেখবেন এটা আপনি রেগুলার প্লাগিন হিসেবে ডাউনলোড ও আপনার ওয়ার্ডপ্রেস সাইটে যেকোনো থিমের সাথে ব্যবহার করতে পারবেন। এটা দিয়ে যদিও কোনও অপশন তৈরি হবে না, কিন্তু আপনি ডেমো মোডে কিছু স্যাম্পল অপশনসহ এটা চালু করতে পারেন।

আপনার থিম বা প্লাগিনের জন্য কাস্টমাইজ অপশনসহ একটি অপশন প্যানেল পেতে আপনাকে একটি আলাদা config.php ফাইল তৈরি করতে হবে। এটা কিভাবে কাজ করে সে সম্পর্কে আরও জানুনঃ

এই পদ্ধতিটির সুবিধা ও অসুবিধা নিচে দেয়া হলো:

অসুবিধা

সুবিধা

আলাদা প্লাগিন ইন্সটলেশন যা আপনার সার্ভার অথবা থিম ফোল্ডারে যিপ ফাইল হিসেবে জমা হবে

আপনার থিমের সাইজ কমবে যেহেতু অপশন প্যানেলটি আপনার থিম কোরের অংশ নয়।

থিম এবং প্লাগিনটি থার্ডপার্টি ডেভেলপমেন্ট এবং টুলসমূহের উপর নির্ভরশীল বলে মনে হবে।

থিম চেক প্লাগিনের অসংখ্য ওয়ার্নিং ও এররসমূহ এড়ানো সম্ভব হবে।

থিম কোরে অন্তর্ভুক্ত করা

আপনার থিমে আপনি যেকোনোভাবে রিডাক্স ব্যবহার করতে পারেন, যতক্ষন না এটা থিমচেক প্লাগিনের সাথে কোনও ঝামেলা না করে। লজিকটি আগের মতই আপনার কাস্টম অপশনের জন্য এখনও একটি config.php ফাইল দরকার হবে, কিন্তু এখন আপনি অতিরিক্ত প্লাগিন ইন্সটলেশন এড়িয়ে যেতে পারেন।

অসুবিধা

সুবিধা

থিম প্যাকেজ সাইজ বৃদ্ধি করবে।

অতিরিক্ত প্লাগিন ইন্সটলেশন এড়ানো যাবে।

থিমচেক প্লাগিনে সম্ভাব্য অসুবিধা ও সমস্যা দেখা যেতে পারে।

থিম অপশন প্যানেলটিকে মনে হবে আপনার থিমেরই অংশ।

প্লাগিন আপডেট করার সাথে সাথে আপনার থিমটিকেও আপডেট করতে হবে।

এটাকে থিম-নির্ভর প্লাগিন হিসেবে যুক্ত করা

আমার মতে, রিডাক্স ফ্রেমওয়ার্ক যুক্ত করার এটাই হচ্ছে সর্বোত্তম উপায়। এই প্রক্রিয়াটি সাধারণ প্লাগিন ইন্সটলেশনের মতই সহজ, একমাত্র পার্থক্য হচ্ছে এটা এখন আপনার থিমের জন্য আবশ্যক একটি প্লাগিন।

প্রিমিয়াম থিমে সাধারণত কাস্টম উপাদানসমূহ থাকে-কাস্টম পোস্ট টাইপ এবং অন্যান্য উপাদান-এর সবগুলোই একটি প্লাগিনের অধীনে থাকে, তাই লজিক্যাল পদ্ধতি হচ্ছে একটি অ্যাড-অন প্লাগিন তৈরি করে আপনার থিমের সাথে লিঙ্ক করে দেয়া। এই অ্যাড-অন প্লাগিনে আপনি আপনার থিম অপশনসমূহ অন্তর্ভুক্ত করতে পারবেন। থিম-নির্ভর প্লাগিন তৈরি করা সম্পর্কে এই টিউটোরিয়াল থেকে আরও জানুন:

অসুবিধা

সুবিধা

খুঁজে পাই নি :)

অতিরিক্ত প্লাগিন ইন্সটলেশন এড়িয়ে যাওয়া।

থিম অপশন প্যানেলটিকে আপনার থিমের সাথে আরও সংযুক্ত মনে হবে।

এই ইন্সটলেশনে রিডাক্সের কনফিগারেশন প্রক্রিয়ায় কোনও প্রভাব পড়বে না, তাই আপনি কিভাবে আপনার প্রজেক্টে রিডাক্স যুক্ত করবেন তা সম্পূর্ণই আপনার উপর নির্ভর করে। যাই হোক, আমি শেষের অপশনকেই পছন্দ করলাম, তাই আমি এই পদ্ধতিতেই কনফিগারেশনটি বর্ণনা করবো।

২। জেনারেল কনফিগারেশন

আপনি যদি ডিফল্ট রিডাক্স ফ্রেমওয়ার্ক প্লাগিন ফোল্ডারটি পরীক্ষা করেন তাহলে এখানে অনেকগুলো ফাইল ও ডাইরেক্টরি দেখতে পাবেন, কিন্তু এখানে আপনার কেবল রিডাক্সকোর ফোল্ডারটি দরকার হবে।

the ReduxCore folder
রিডাক্সকোর ফোল্ডার

এই ফোল্ডারের সবকিছুই আপনার অ্যাড-অন প্লাগিন ফোল্ডারে কপি করুন। একটি ফোল্ডার তৈরি করুন, এটাকে আপনি যা খুশি নাম দিন, যেমন optionpanel, এবং এটার ভিতর রিডাক্সকোর কনটেন্টগুলো রাখুন। তারপর, এর ভিতর একটি খালি ফাইল তৈরি করুন এবং এর নাম দিন config.php।  তারপর আমাদের reduxframework দরকার হবে, যা আমরা কোনও ঝামেলা ছাড়াই করতে সক্ষম হবো, তাই অ্যাড-অন প্লাগিনটি যদি কোনও ওয়ার্ডপ্রেস সাইটে ইন্সটল করা হয়, তবে তা ক্রাশ করবে না।

আপনার এড-অন প্লাগিনের মূল ফাইলে নিচের কোড যুক্ত করুন:

ব্যস, হয়ে গেলো! আপনার রিডাক্স ফ্রেমওয়ার্কটি যুক্ত হয়ে গেছে, যদিও আপনি এখন কোনও অপশন প্যানেল দেখছেন না, কারণ আমাদেরকে কিছু অপশন তৈরি করতে হবে। এই সবগুলো আমাদের তৈরি করা config.php ফাইলে করতে হবে।

৩। অপশন প্যানেল তৈরি করা

গাইডলাইন এবং স্টার্টিং পয়েন্ট হিসেবে আপনি রিডাক্স প্লাগিনের সাথে দেয়া sample-config.php ফাইলটি ব্যবহার করতে পারেন। এটাতে আপনার কাস্টম অপশন তৈরি করার জন্য প্রয়োজনীয় সমস্ত কোডই পাবেন। এখন চলুন আমরা মেইন কনফিগারেশন প্রক্রিয়াটি তুলে ধরি।

config.php ফাইলটি খুলুন এবং এবং শুরুতে এই কোডটি যুক্ত করুন (শুরুর <?php  ট্যাগের প্রয়োজন হবে না, যদি তা ইতিমধ্যেই থেকে থাকে):

এটা চেক করা হয় রিডাক্স ফ্রেমওয়ার্কটি চালু আছে কিনা তা নিশ্চিত করার জন্য, অন্যথায় আমাদের তৈরি করা সমস্ত অপশনই ব্যর্থ হয়ে যাবে এবং অসংখ্য PHP এরর সৃষ্টি হবে।

অপশনসমূহ তৈরি করার আগে আমাদের বেশ কিছু কনফিগারেশনের প্রয়োজন হবে। এমন একটি ভেরিয়েবল তৈরি করুন যা আপনার সমস্ত অপশন সংরক্ষণ করবে এবং আপনার থিমফাইলে সহজেই ব্যবহার করা যাবে:

এটা ইউনিক করতে প্রিফিক্স ব্যবহার করুন, যেমন: yourbrandname_yourthemename

তারপর, এই কোডটি যুক্ত করুন:

এটা রিডাক্সের যেকোনো আর্গুমেন্ট কনফিগার করতে প্রয়োজন হবে যা ইন্সটল করা থিমের তথ্য ব্যবহার করতে সক্ষম হবে।

আর্গুমেন্টসমূহ

এই পর্যায়ে আমাদেরকে নিচের আর্গুমেন্টগুলো যুক্ত করতে হবে:

এখানে অনেকগুলো আর্গুমেন্ট দেখা যাচ্ছে, তবে চিন্তার কিছু নেই আমি এখানে কেবল গুরুত্বপূর্ণ আর্গুমেন্টগুলোই তুলে ধরবো।

menu_type

আপনি যদি আপনার থিম অপশন পেইজটিকে একটি আলাদা টপ লেভেল মেনু আইটেম হিসেবে উপস্থাপন করতে চান তাহলে এর মান সেট করতে হবে menu হিসেবে, আর যদি আপনি আপনার থিম অপশনটিকে সাবমেনু হিসাবে উপস্থাপন করতে চান (আমি এগুলোকে Appearance নিচেই রাখতে চাই) তাহলে মান বা ভ্যালু submenu হিসেবে সেট করুন।

dev_mode

এটা ডেভেলপমেন্টের সময় সক্রিয় করতে পারেন, কিন্তু থিম পাবলিশ করার সময় নিষ্ক্রিয় করতে ভুলবেন না।

update_notice

যেহেতু, রিডাক্স আপনার আপনার প্রজেক্টের অংশ হবে তাই আপনি নিশ্চয়ই আপনার ব্যবহারকারীকে রিডাক্স ফ্রেমওয়ার্ক থেকে কোনও আপডেট নোটিশ দেখাতে চান না, তাই এটার মান সেট করুন false

customizer

আপনি যদি আপনার কাস্টম সেটিংসগুলো ওয়ার্ডপ্রেস কাস্টমাইজারের অংশ হিসেবে দেখাতে চান তাহলে এই আর্গুমেন্টটি true হিসেবে সেট করুন।

আর্গুমেন্ট অ্যারেতে আরও অনেকগুলো আইটেম আছে, এবং আপনি যদি এই প্রত্যেকটির উপর আরও তথ্য চান তাহলে sample-config.php ফাইলটি দেখুন। আমাদের প্রয়োজন অনুসারে আমরা আর্গুমেন্টগুলো যথেষ্ট কাস্টমাইজ করেছি। এখন চলুন আর্গুমেন্টগুলো সেট করি।

সেকশনসমূহ যুক্ত করা

আপনার থিম প্যানেল প্রস্তুত, এখন আপনি অপশনসহ সেকশনসমূহ যুক্ত করতে পারেন। গ্রুপ হিসেবে সেকশনগুলো চিন্তা করুন। আপনি যদি হেডার অপশন যুক্ত করতে চান, তাহলে হেডার সেকশন তৈরি করুন এবং তাতে অপশনসমূহ যুক্ত করুন। যেকোনো সেকশন তৈরি করতে আপনার নিচের স্ট্রাকচারটি প্রয়োজন হবে:

এখানে id এট্রিবিউটটি যাতে ইউনিক হয় তা নিশ্চিত করতে হবে।আপনি কাস্টম আইকন ব্যবহার করতে পারেন, কিন্তু ডিফল্ট আইকন প্যাক হচ্ছে elusiveicons

আপনার সেকশন তৈরি হওয়ার পর, আপনি ফিল্ড অ্যারেতে অপশন যোগ করতে পারেন। সংশ্লিষ্ট অপশন টাইপ এবং ব্যাখ্যা ও হাইলাইটসহ কোড স্ট্রাকচারগুলোর তালিকা আপনি এখানে খুঁজে পাবেন।

আপনি যদি এই সেকশনটিকে আগের যুক্ত করা সেকশনের অধীনে বা সাব সেকশন হিসেবে তৈরি করতে চান, তাহলে কেবল একটি নতুন আর্গুমেন্ট 'subsection' => true যুক্ত করুন।

এই অপশনটি আসলে আর্গুমেন্টসহ একটি অ্যারে ছাড়া আর কিছুই নয়, যেমন:

এই কোডের মাধ্যমে আমরা আমাদের সেকশনে একটি চেকবক্স যোগ করেছি। এখানে সবচেয়ে গুরুত্বপূর্ণ বিষয় হলো আইডি (এটা ইউনিক হতে হবে), ও টাইপ (এটা সঠিক হতে হবে, এবং রিডাক্সে দেয়া ফিল্ড টাইপ অনুসারে  একইভাবে এর নামকরণ করতে হবে)। আবারো বলছি, sample-config.php ফাইলে ফিল্ড সমূহ সম্পর্কে আপনি আরও তথ্য পাবেন।

অপশন প্যানেল তৈরি করতে আপাতত আপনাকে এতটুকু জানলেই হবে। এরপর আমরা দেখবো, কিভাবে এই অপশনগুলো ব্যবহার করবেন।

৪। একটি থিমে অপশন ব্যবহার করা

রিডাক্স সমস্ত অপশনসমূহ একটি গ্লোবাল ভেরিয়েবল হিসেবে সংরক্ষণ করে।$opt_name  ভেরিয়েবলের কথা মনে আছে কি যা আমরা config.php ফাইলে তৈরি করেছিলাম। এই ভেরিয়েবলেই আপনার সবগুলো অপশন থাকবে, এবং আপনি নিন্মোক্ত উপায়ে এগুলো ব্যবহার করতে পারবেন।

প্রথমত, আপনাকে গ্লোবাল ভেরিয়েবল ঘোষণা করতে হবে। এবং এখানে একটি সম্ভাব্য সমস্যা দেখা দিতে পারেঃ গ্লোবাল ভেরিয়েবল কোনও ফাংশন বা অ্যাকশনের বাইরে ঘোষণা করা বাঞ্ছনীয় নয়। এর সমাধান হচ্ছে আপনার functions.php ফাইলে এই ছোট্ট ফাংশনটি যুক্ত করতে হবে:

তারপর যেসব পেইজে আপনি এই অপশন ব্যবহার করতে চান সেসব পেইজে নিচের মত করে ফাংশন এক্সিকিউট করুনঃ

আপনার যদি অন্য কোনও ফাংশন বা অ্যাকশনে গ্লোবাল ভেরিয়েবলটি দরকার হয়, তাহলে আপনি এই ফাংশন ছাড়াই তা ঘোষণা করতে পারেন।

অপশনসমূহ ব্যবহার করে

আপনি যদি কোনও অপশন আগে থেকে আছে কিনা তা চেক না করেই ব্যবহার করেন, তাহলে আপনি undefined variable/index এই ধরণের কোনও পিএইচপি নোটিশ পাবেন। এটা কেন গুরুত্বপূর্ণ?  কারণ, ব্যবহারকারী যখন আপনার থিম চালু করবে, কিন্তু যদি অ্যাড-অন প্লাগিনটি চালু না করে যাতে আপনার অপশন প্যানেলটি আছে, তাহলে তিনি কেবল কিছু আন ডিফাইনেড ভেরিয়েবলের উপর কিছু পিএইচপি ওয়ার্নিং ছাড়া আর কিছুই দেখতে পাবেন না। এটা নিশ্চয়ই কাম্য নয়।

এখানে বেশ ভালো একটি প্যাটার্ন আছে, যা এই পরিস্থিতি এড়াতে সক্ষম-এটা দেখতে নিচের মত হবে:

এই ছোট্ট চেকের মাধ্যমে আপনি নিশ্চিত হবেন যে আপনি কোনও আনডিফাইনেড ভেরিয়েবল/ইন্ডেক্স নোটিশ পাচ্ছেন না। যদি আপনি ডিফল্ট ভ্যালু অ্যাসাইন অথবা ভেরিয়েবল তৈরি করতে না চান, তাহলে এর পরিবর্তে নিচের প্যাটার্ন ব্যবহার করতে পারেন:

পরিশিষ্ট

পড়ার জন্য ধন্যবাদ, আমি আশা করি এটা আপনাকে রিডাক্স দিয়ে আপনার থিম অপশন তৈরি করতে সাহায্য করবে! আপনার যদি কোনও প্রশ্ন বা সাজেশন থাকে তবে নিচের কমেন্টে জানাতে পারেন।

দরকারী লিঙ্কসমূহ

Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.