দ্য বিভাজক ক্ষেত্র আপনার কাস্টম উইজেটের বিকল্প প্যানেলে দুটি নিয়ন্ত্রণের মধ্যে একটি পাতলা সীমানা রেখা আঁকে। এটি প্যানেলের জন্যই একটি লেআউট হেল্পার: এটি পৃষ্ঠায় কিছুই প্রিন্ট করে না, আপনার HTML-এ কিছুই যোগ করে না এবং ফ্রন্টএন্ডে কখনই দেখায় না। এটির একমাত্র কাজ হল বিকল্পগুলির একটি গ্রুপকে পরবর্তী থেকে দৃশ্যত আলাদা করা, যাতে এলিমেন্টরে আপনার উইজেট সম্পাদনা করা লোকেরা প্যানেলটি দ্রুত স্ক্যান করতে পারে।
এমনকি ডিভাইডার সমর্থন করে এমন একটি UI-শুধু নিয়ন্ত্রণ শর্তাবলী, তাই বিকল্পগুলির একটি সম্পূর্ণ গ্রুপ উপস্থিত হতে পারে এবং এর বিভাজকের সাথে একসাথে অদৃশ্য হয়ে যেতে পারে। বিল্ডার জুড়ে টেমপ্লেট আউটপুট দ্বারা রেন্ডার করা হয় টুইগ-সিনট্যাক্স টেমপ্লেট ইঞ্জিন; উভয় গাইড বিস্তারিত কভার।
মাস্টার অ্যাডঅন ভিতরে উইজেট নির্মাতা, আপনি যেকোনো দুটি ক্ষেত্রের মধ্যে বিভাজকটি ফেলে দিন, সংরক্ষণ করুন এবং এলিমেন্টর উইজেটের প্যানেলের সেই সঠিক স্থানে একটি ছোট অনুভূমিক রেখা রেন্ডার করে। নীচের ওয়াকথ্রুতে, বিভাজকটি a এর মধ্যে যায় পাঠ্য ক্ষেত্র এবং ক পাঠ্য এলাকা ক্ষেত্র.

বিভাজক ক্ষেত্র কি করে #
একটি বিভাজক এলিমেন্টর এডিটর প্যানেলের ভিতরে একটি সূক্ষ্ম অনুভূমিক সীমানা রেন্ডার করে, যেখানে আপনি এটি দুটি নিয়ন্ত্রণের মধ্যে রেখেছেন। এটি পুরো বৈশিষ্ট্য, এবং এটি বিন্দু। যখন একটি কাস্টম উইজেটে একটি বিভাগে পাঁচ বা ছয়টি ইনপুট স্ট্যাক করা থাকে, তখন কয়েকটি বিভাজক ক্ষেত্রগুলির একটি প্রাচীরকে পরিষ্কার গ্রুপে পরিণত করে।
বিভাজক দুটি জিনিস করে না করুন, তাই পরে কোন চমক নেই:
- এর কোনো আউটপুট নেই। টেক্সট বা টেক্সট এরিয়া ফিল্ডের বিপরীতে, ডিভাইডার ডকুমেন্টেশন সাইডবারে কোনো শর্টকোড যোগ করে না। নেই
{{divider}}আপনার HTML, CSS, বা JS-এ রাখার জন্য টোকেন। - এটি কখনই পৃষ্ঠা স্পর্শ করে না। লাইনটি শুধুমাত্র এলিমেন্টর এডিটরের ভিতরে উইজেটের অপশন প্যানেলে প্রদর্শিত হয়। প্রিভিউ এলাকা এবং লাইভ ফ্রন্টএন্ড ঠিক একই থাকে।
আপনি যদি এমন একটি বিভাজক চান যা দর্শকরা আসলে পৃষ্ঠায় দেখতে পান, তবে এটি একটি ভিন্ন টুল: পরিবর্তে আপনার পৃষ্ঠা ডিজাইনে একটি বিভাজক বা বিভাজক উইজেট ব্যবহার করুন৷ এই ক্ষেত্রটি সম্পূর্ণরূপে সম্পাদনা অভিজ্ঞতা সংগঠিত করার জন্য। আপনি যদি উইজেট তৈরিতে নতুন হন তবে শুরু করুন উইজেট নির্মাতা ওভারভিউ প্রথম।
আপনি শুরু করার আগে #
- ওয়ার্ডপ্রেস সঙ্গে এলিমেন্টর ইনস্টল এবং সক্রিয়।
- এলিমেন্টরের জন্য মাস্টার অ্যাডঅন ইনস্টল এবং সক্রিয়। প্লাগইনে নতুন? দেখা ইনস্টলেশন গাইড.
- উইজেট বিল্ডার এডিটরে একটি কাস্টম উইজেট খোলা, যেখানে অন্তত দুটি ক্ষেত্র ইতিমধ্যেই রয়েছে৷ এখানে আমরা একটি পাঠ্য ক্ষেত্র এবং একটি পাঠ্য এলাকা ক্ষেত্র ব্যবহার করি।
কিভাবে একটি বিভাজক ক্ষেত্র যোগ করতে হয় #
উইজেট বিল্ডার এডিটরে, বাম দিকে ফিল্ড প্যানেলটি স্ক্রোল করুন যতক্ষণ না আপনি এটি খুঁজে পান বিভাজক ক্ষেত্র। এটি তালিকার নীচের দিকে, টেক্সট শ্যাডোর পাশে বসে আছে এবং এর আইকনটি দুটি ছোট তীরের মধ্যে একটি লাইনের মতো দেখাচ্ছে।

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

একবার বিভাজক দুটি ক্ষেত্রের মধ্যে বসলে, বিভাগটি পাঠ্য, বিভাজক, টেক্সটেরিয়া উপরে থেকে নীচে পড়ে। ক্লিক করুন সেটিংস সংরক্ষণ করুন পরিবর্তন সংরক্ষণ করতে।

বিভাজক ক্ষেত্রের বিকল্পগুলি ব্যাখ্যা করা হয়েছে #
বাম দিকে সেটিংস খুলতে বিভাজক নির্বাচন করুন। এটি একটি ইনপুট ক্ষেত্রের তুলনায় অনেক কম বিকল্প বহন করে, কারণ সংগ্রহ করার কোন মান নেই।
- লেবেল: বিল্ডারের ফিল্ড কার্ডে দেখানো অভ্যন্তরীণ নাম, ডিফল্টরূপে "ডিভাইডার"৷ উইজেট সম্পাদনা করার সময় এটি আপনাকে একাধিক বিভাজককে আলাদা করতে সাহায্য করে।
- নাম: ক্ষেত্রের জন্য অনন্য শনাক্তকারী। এটিতে শুধুমাত্র অক্ষর, সংখ্যা এবং আন্ডারস্কোর থাকতে হবে। ডিভাইডার কোনো শর্টকোড তৈরি করে না, তাই এটি পর্দার আড়ালে থাকে, কিন্তু প্রতিটি ক্ষেত্রের এখনও একটি অনন্য নাম প্রয়োজন।
- লেবেল দেখান এবং লেবেল ব্লক: স্ট্যান্ডার্ড লেবেল টগল করে যা প্রতিটি উইজেট বিল্ডার ক্ষেত্রে প্রদর্শিত হয়।
- বিভাজক: নিয়ন্ত্রণ বিভাজকের অবস্থান সেট করে (কোনটিই নয়, আগে, পরে, ডিফল্ট)।
- শর্ত: অন্য নিয়ন্ত্রণের মানের উপর ভিত্তি করে বিভাজক দেখান বা লুকান। ক্লিক করুন শর্ত যোগ করুন নিয়ম সেট করতে। সুবিধাজনক যখন এটির চারপাশের ক্ষেত্রগুলিও শর্তসাপেক্ষ হয়, তাই একটি লাইন কখনই লুকানো নিয়ন্ত্রণের উপরে ভাসতে পারে না।
বেশিরভাগ উইজেটের জন্য, আপনি ডিভাইডারটিকে জায়গায় ফেলে দেন এবং এই সেটিংসগুলিকে কখনই স্পর্শ করবেন না। প্লেসমেন্ট হল সেটিং যা গুরুত্বপূর্ণ।
এলিমেন্টর এডিটরে ডিভাইডার দেখুন #
এখন Elementor-এ একটি পৃষ্ঠা খুলুন যা আপনার কাস্টম উইজেট ব্যবহার করে, অথবা উইজেটটিকে একটি পৃষ্ঠায় টেনে আনুন। আপনি উইজেট সম্পাদনা করার সময় যদি পৃষ্ঠাটি ইতিমধ্যেই খোলা থাকে, এলিমেন্টর এডিটর পুনরায় লোড করুন তাই এটি নতুন প্যানেল লেআউট তুলে নেয়।
উইজেট নির্বাচন করুন এবং এর বিষয়বস্তু ট্যাবটি দেখুন। একটি ছোট সীমানা রেখা এখন টেক্সট কন্ট্রোল এবং টেক্সটেরিয়া কন্ট্রোলের মধ্যে বসে আছে, ঠিক যেখানে আপনি বিল্ডারে ডিভাইডারটি ফেলে দিয়েছেন।

ডানদিকে পূর্বরূপ পরীক্ষা করুন: শিরোনাম এবং অনুচ্ছেদ আগের মতোই রেন্ডার করে। বিভাজক আউটপুট সম্পর্কে কিছুই পরিবর্তন করেনি, শুধুমাত্র প্যানেল। ঠিক তাই ঘটতে হবে।
সাধারণ ব্যবহারের ক্ষেত্রে #
- গ্রুপিং সম্পর্কিত ইনপুট, লাইনের উপরে একটি শিরোনাম এবং এর উপশিরোনাম এবং এটির নীচে একটি বোতাম লেবেল এবং লিঙ্কের মতো।
- আচরণ থেকে বিষয়বস্তু পৃথক করা, উদাহরণস্বরূপ উপরের পাঠ্য ক্ষেত্রগুলি, নীচে টগল এবং সুইচ করে।
- দীর্ঘ বিভাগ ভাঙ্গা যেখানে পৃথক বিভাগে বিভক্ত হওয়া অতিরিক্ত হবে কিন্তু দশটি স্তুপীকৃত ক্ষেত্র ভারী বোধ করবে।
- ঐচ্ছিক অতিরিক্ত চিহ্নিত করা, বিভাজকের উপরে প্রয়োজনীয় ক্ষেত্র এবং নীচে থাকা সুন্দর সেটিংস সহ।
বিভাজক ক্ষেত্রের সাথে কাজ করার জন্য টিপস #
- প্রতিটি ক্ষেত্রের মধ্যে নয়, গ্রুপের মধ্যে বিভাজক ব্যবহার করুন। প্রতিটি নিয়ন্ত্রণের পরে একটি লাইন মোটেও লাইনের মতো কোলাহলপূর্ণ।
- একটি নতুন বিভাগের আগে একটি বিভাজকের জন্য পৌঁছান। যদি ক্ষেত্রগুলির দুটি গ্রুপ একই ট্যাব এবং একই বিষয়ের অন্তর্গত হয়, তবে একটি বিভাজক অন্য একটি সংকোচনযোগ্য বিভাগের খরচ ছাড়াই তাদের একসাথে রাখে।
- সংরক্ষণ করার পরে এলিমেন্টর সম্পাদক পুনরায় লোড করুন। পরিবর্তনের সময় খোলা একটি সম্পাদক ট্যাব আপনি রিফ্রেশ না হওয়া পর্যন্ত নতুন লাইন দেখাবে না।
- মনে রাখবেন এটি দর্শকদের কাছে অদৃশ্য। যদি একজন ক্লায়েন্ট পৃষ্ঠায় একটি লাইনের জন্য জিজ্ঞাসা করে, এটি উইজেটের HTML বা একটি পৃথক উইজেটের একটি ডিজাইন উপাদান, এই ক্ষেত্রে নয়।
প্রায়শই জিজ্ঞাসিত প্রশ্নাবলী #
মাস্টার অ্যাডনস উইজেট বিল্ডারে ডিভাইডার ক্ষেত্র কী?
বিভাজক ক্ষেত্রটি একটি কাস্টম উইজেটের বিকল্প প্যানেলে দুটি নিয়ন্ত্রণের মধ্যে একটি পাতলা অনুভূমিক রেখা আঁকে। এটি এলিমেন্টর এডিটরের ভিতরে প্যানেলটিকে দৃশ্যতভাবে সংগঠিত করে এবং উইজেটের আউটপুট বা আপনার সাইটের সামনের দিকে কোন প্রভাব ফেলে না।
ডিভাইডার ফিল্ড কি আমার ওয়েবসাইটে কিছু দেখায়?
না। বিভাজকটি শুধুমাত্র এলিমেন্টর এডিটরের উইজেটের বিকল্প প্যানেলে প্রদর্শিত হয়। এটি পৃষ্ঠায়, প্রিভিউতে বা ফ্রন্টএন্ডে কিছুই প্রিন্ট করে না। দর্শকদের একটি দৃশ্যমান লাইন দেখাতে, আপনার উইজেটের HTML-এ একটি যোগ করুন বা একটি বিভাজক উইজেট ব্যবহার করুন৷।
কেন আমি এলিমেন্টরে বিভাজকটি যোগ করার পরে দেখতে পাচ্ছি না?
এলিমেন্টর এডিটর পুনরায় লোড করুন। আপনি উইজেট সংরক্ষণ করার সময় খোলা একটি ট্যাব এখনও পুরানো প্যানেল লেআউট ধারণ করে। একটি রিফ্রেশ করার পরে, উইজেটটি নির্বাচন করুন এবং আপনি যেখানে ডিভাইডার ক্ষেত্রটি স্থাপন করেছেন সেখানে দুটি নিয়ন্ত্রণের মধ্যে পাতলা লাইনটি উপস্থিত হবে।
বিভাজক ক্ষেত্র কি একটি শর্টকোড তৈরি করে?
না। টেক্সট এর মত ইনপুট ক্ষেত্রগুলি ডকুমেন্টেশন সাইডবারে {{text}} এর মত টোকেন তৈরি করে, কিন্তু ডিভাইডার কোন মান সংগ্রহ করে না, তাই এটি কোন শর্টকোড যোগ করে না। আপনি এটি প্যানেলে রাখুন এবং এটি সম্পূর্ণ সেটআপ।
আমি একটি বিভাজক বা একটি নতুন বিভাগ ব্যবহার করা উচিত?
একটি বিভাগের মধ্যে সম্পর্কিত ক্ষেত্রগুলির গ্রুপগুলিকে বিভক্ত করতে একটি বিভাজক ব্যবহার করুন৷ একটি নতুন বিভাগ তৈরি করুন যখন ক্ষেত্রগুলি একটি ভিন্ন বিষয়কে সম্পূর্ণরূপে কভার করে এবং এলিমেন্টর প্যানেলে তাদের নিজস্ব সংকোচনযোগ্য শিরোনামের যোগ্য। বিভাজক হালকা, বিভাগ শক্তিশালী বিচ্ছেদ হয়।
মোড়ানো #
ডিভাইডার ফিল্ড হল উইজেট বিল্ডারের সবচেয়ে ছোট টুল, এবং যে কেউ পরে আপনার উইজেট এডিট করবে তাদের জন্য সবচেয়ে উপযোগী। এটিকে দুটি ক্ষেত্রের মধ্যে ফেলে দিন, এলিমেন্টর সম্পাদকটিকে সংরক্ষণ করুন, পুনরায় লোড করুন এবং প্যানেলটি একটি পরিষ্কার লাইন লাভ করে যেখানে বিকল্পগুলি বিষয় পরিবর্তন করে। এর সাথে পেয়ার করুন টেক্সট এবং পাঠ্য এলাকা প্যানেল তৈরি করার ক্ষেত্রগুলি যা একটি ফর্মের মতো পড়ে, ইনপুটগুলির স্তূপ নয়। বাকি অন্বেষণ মাস্টার অ্যাডঅন উইজেট এবং এক্সটেনশন, এবং দেখুন মূল্য পৃষ্ঠা প্রতিটি পরিকল্পনা অন্তর্ভুক্ত কি জন্য।