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

সিলেক্ট ফিল্ড কি করে #
- Elementor-এ আপনার উইজেটের প্যানেলে একটি স্ট্যান্ডার্ড ড্রপডাউন যোগ করে।
- সম্পাদককে আপনার সংজ্ঞায়িত তালিকা থেকে একটি বিকল্প বেছে নিতে দিন।
- বিকল্পটি সংরক্ষণ করে চাবি (উদাহরণস্বরূপ
outlined), সম্পাদক যে লেবেলটি দেখেন তা নয়। - আপনি যেখানেই এর টোকেন রাখবেন সেই কীটি প্রিন্ট করে, যেমন
{{ layout_style }}, তাই আপনি এটি একটি ক্লাস হিসাবে ব্যবহার করতে পারেন বা এটি পরীক্ষা করতে পারেন{% if %}.
নির্মাতার কাছে নতুন? পড়ুন উইজেট নির্মাতা ওভারভিউ প্রথমে, তারপর একটি উইজেট খোলা নিয়ে ফিরে আসুন।
আপনি শুরু করার আগে #
- এলিমেন্টর ইনস্টল এবং সক্রিয় সহ ওয়ার্ডপ্রেস।
- এলিমেন্টর ইনস্টল এবং সক্রিয় জন্য মাস্টার অ্যাডঅন। দ্য ইনস্টলেশন গাইড সেটআপ কভার করে।
- উইজেট বিল্ডারে একটি উইজেট খোলা। এই গাইডের উদাহরণ হল দুটি নির্বাচন ক্ষেত্র সহ একটি “ Card” উইজেট:
layout_style(বক্সযুক্ত, ন্যূনতম, রূপরেখা) স্টাইল ট্যাবে এবংbadgeবিষয়বস্তু ট্যাবে (কোন ব্যাজ নেই, সর্বাধিক জনপ্রিয়, নতুন)।
কিভাবে একটি নির্বাচন ক্ষেত্র যোগ করতে হয় #
- যাও মাস্টার অ্যাডঅন > উইজেট নির্মাতা এবং আপনার উইজেট খুলুন।
- সেটিংটি যে ট্যাবটিতে রয়েছে সেটি বেছে নিন এবং একটি বিভাগ যোগ করুন। লেআউট স্টাইলের মতো একটি চেহারা এবং অনুভূতি পছন্দ ফিট করে শৈলী ট্যাব, উদাহরণস্বরূপ একটি “Card Style” বিভাগে।
- টাইপ করা
selectবাম দিকে ক্ষেত্র অনুসন্ধান বাক্সে। দুটি ক্ষেত্র আসে: নির্বাচন করুন এবং নির্বাচন করুন 2। - টেনে আনুন নির্বাচন করুন বিভাগে। সেটিংস খুলতে মাঠের পেন্সিলটিতে ক্লিক করুন।

নির্বাচন একটি সংক্ষিপ্ত তালিকা থেকে একটি পছন্দ ধারণ করে। সম্পাদকদের যদি একটি দীর্ঘ তালিকা অনুসন্ধান করতে হয় বা একাধিক বিকল্প বেছে নিতে হয়, ব্যবহার করুন নির্বাচন 2 পরিবর্তে, যা একটি প্রো ক্ষেত্র।
ব্যাখ্যা করা ক্ষেত্রের বিকল্পগুলি নির্বাচন করুন #

- লেবেল: এলিমেন্টরে ড্রপডাউনের পাশের পাঠ্য, উদাহরণস্বরূপ “Layout Style”।
- নাম: ক্ষেত্রের অনন্য আইডি এবং এর টোকেনের নাম। উদাহরণস্বরূপ, শুধুমাত্র অক্ষর, সংখ্যা এবং আন্ডারস্কোর ব্যবহার করুন
layout_style. - বর্ণনা: এলিমেন্টরে ড্রপডাউনের অধীনে দেখানো একটি ইঙ্গিত।
- বিকল্প: পছন্দ প্রতি এক সারি। বাম বাক্স হল চাবি আপনার টেমপ্লেট গ্রহণ করে, এবং ডান বাক্স হল লেবেল সম্পাদকরা দেখেন। একটি সারি সরাতে লাল ক্রস এবং একটি যোগ করতে প্লাস বোতাম ব্যবহার করুন।
- ডিফল্ট মান: উইজেটের একটি নতুন অনুলিপি বিকল্পটি দিয়ে শুরু হয়। ড্রপডাউন লেবেল দেখায়, কিন্তু ক্ষেত্রটি কী সংরক্ষণ করে।
একটি নতুন নির্বাচন ক্ষেত্র তিনটি নমুনা সারি সহ আসে, value-1 প্রতি value-3 লেবেলগুলির সাথে বিকল্প 1 থেকে বিকল্প 3৷ আপনি উইজেট ব্যবহার করার আগে সেগুলিকে আপনার নিজস্ব কী এবং লেবেল দিয়ে প্রতিস্থাপন করুন৷।
কী ছোট, ছোট হাতের এবং স্পেস ছাড়া রাখুন, যেমন boxed বা most_popular। তারা ক্লাসের নাম এবং তুলনা শেষ করে। আপনি যদি ডিফল্ট মান খালি রাখেন, উইজেটটি তালিকার প্রথম বিকল্পে শুরু হয়।
সাধারণ সেটিংসের অধীনে আপনি পাবেন লেবেল দেখান, লেবেল ব্লক, বিভাজক এবং শর্তাবলী, যা অন্যান্য ক্ষেত্রের মতোই কাজ করে।
আপনার টেমপ্লেটে পছন্দ ব্যবহার করুন #
প্ল্যান কার্ড এইচটিএমএল দুটি সবচেয়ে সাধারণ উপায়ে উভয় নির্বাচন ক্ষেত্র ব্যবহার করে:
<div class="plan plan--{{ layout_style }}">
{% if badge == 'popular' %}
<span class="plan-badge">Most Popular</span>
{% elseif badge == 'new' %}
<span class="plan-badge plan-badge--new">New</span>
{% endif %}
<p class="plan-name">{{ plan_name }}</p>
<p class="plan-price">{{ plan_price }}<span>/month</span></p>
<a class="plan-button" href="#">Get started</a>
</div>
সংশোধক ক্লাস #
plan--{{ layout_style }} হয়ে যায় plan--boxed, plan--minimal বা plan--outlined। প্রতিটি ভেরিয়েন্ট তখন CSS প্যানেলে একটি সংক্ষিপ্ত নিয়ম, এবং HTML একই থাকে:
.plan--boxed { background: #fff; box-shadow: 0 12px 32px rgba(29, 27, 76, .14); }
.plan--minimal { background: transparent; }
.plan--outlined { background: #fff; border: 2px solid #7c3aed; }বিকল্প প্রতি ভিন্ন মার্কআপ #
যখন একটি বিকল্পের বিভিন্ন HTML প্রয়োজন হয়, তখন কীটির সাথে তুলনা করুন {% if %}. {% elseif %} এবং {% else %} কাজও করুন। উদাহরণে, none কোন চেকের সাথে মেলে না, তাই কোন ব্যাজ প্রিন্ট করা হয় না।
সর্বদা কী এর সাথে তুলনা করুন। {% if badge == 'popular' %} ম্যাচ, যখন {% if badge == 'Most Popular' %} কখনই করে না এবং কোন ত্রুটি দেয় না। যদি একটি চেক কখনই ফায়ার না হয়, প্রথমে কীটির বানানটি দেখুন।
নির্বাচক এবং প্রতিক্রিয়াশীল নিয়ন্ত্রণ #
- নির্বাচক সবসময় লেখে
color: {{VALUE}};এই ক্ষেত্রের জন্য, এবং সম্পত্তি পরিবর্তন করার জন্য কোন বাক্স নেই। মত চাবি সঙ্গেboxedনিয়ম কিছুই করে না। এটি শুধুমাত্র তখনই সাহায্য করে যখন আপনার কীগুলি রঙ হয়: আমাদের পরীক্ষায়, কী যেমন#7c3aedএবং#0ea5e9এর একজন নির্বাচকের সাথে.plan-priceদাম রঙ করেছেন। অন্য কিছুর জন্য, নির্বাচককে খালি রাখুন এবং ক্লাস ব্যবহার করুন। - প্রতিক্রিয়াশীল নিয়ন্ত্রণ সম্পাদকদের ডিভাইস প্রতি একটি ভিন্ন বিকল্প বাছাই করতে দেয়। প্রতি-ডিভাইস পিকগুলি শুধুমাত্র উপরের নির্বাচক নিয়মের মাধ্যমে পৃষ্ঠায় পৌঁছায়। টোকেন ডেস্কটপ পছন্দ প্রিন্ট করে, তাই আপনি যখন আপনার টেমপ্লেটে মান ব্যবহার করেন তখন প্রতিক্রিয়াশীল নিয়ন্ত্রণ বন্ধ রাখুন।
Elementor এ সিলেক্ট কন্ট্রোল ব্যবহার করুন #
একটি পৃষ্ঠায় উইজেট যোগ করুন, অথবা পৃষ্ঠাটি ইতিমধ্যে খোলা থাকলে সম্পাদকটি পুনরায় লোড করুন। উইজেটটি নির্বাচন করুন এবং আপনি যেখানে ক্ষেত্রটি রেখেছেন সেখানে ট্যাবটি খুলুন। ড্রপডাউন আপনার লেবেল দেখায়, ডিফল্ট বিকল্পটি ইতিমধ্যেই নির্বাচিত। অন্য বিকল্প এবং পূর্বরূপ আপডেট চয়ন করুন।

এখানে লেআউট স্টাইল এবং ব্যাজের তিনটি সমন্বয় সহ একই প্ল্যান কার্ড রয়েছে:

সাধারণ ব্যবহারের ক্ষেত্রে #
- কার্ড, বোতাম বা বিভাগ শৈলী বৈকল্পিক।
- ব্যাজ বা ফিতা যেমন বিক্রয়, নতুন বা সর্বাধিক জনপ্রিয়।
- শিরোনাম ট্যাগ, চিত্র অনুপাত বা কলাম গণনা পছন্দ।
- একটি তালিকা উইজেটের জন্য অর্ডার বা ডেটা উত্স সাজান।
সিলেক্ট ফিল্ডের সাথে কাজ করার জন্য টিপস #
- সম্পাদকরা উইজেট ব্যবহার করার আগে কীগুলির বিষয়ে সিদ্ধান্ত নিন। আপনি পরে লেবেলগুলির নাম পরিবর্তন করতে পারেন, তবে একটি কী পরিবর্তন করা পৃষ্ঠাগুলিকে ভেঙে দেয় যা ইতিমধ্যে পুরানোটিকে সংরক্ষণ করেছে৷।
- একটি “none” বিকল্প যোগ করুন যখন উপাদানটি ঐচ্ছিক হয়, উদাহরণের ব্যাজের মতো।
- একটি ডিফল্ট মান সেট করুন এটি নিজে থেকেই ভাল দেখায়, তাই একটি নতুন যোগ করা উইজেট ব্যবহারের জন্য প্রস্তুত৷।
- পরিষ্কার আইকন সহ শুধুমাত্র দুই বা তিনটি বিকল্প? দ্য ক্ষেত্র নির্বাচন করুন ড্রপডাউনের পরিবর্তে বোতাম হিসাবে তাদের দেখায়।
- শুধু চালু বা বন্ধ? ব্যবহার করুন সুইচার ক্ষেত্র.
প্রায়শই জিজ্ঞাসিত প্রশ্নাবলী #
নির্বাচন ক্ষেত্রটি কি বিনামূল্যে সংস্করণে উপলব্ধ?
হ্যাঁ। বিনামূল্যে সংস্করণের উইজেট বিল্ডারে আপনি যে ক্ষেত্রগুলি ব্যবহার করতে পারেন তার মধ্যে একটি নির্বাচন করুন৷ উইজেট বিল্ডার ক্ষেত্রগুলির সম্পূর্ণ সেট মাস্টার অ্যাডনস প্রো এর সাথে আসে।
টোকেন কি কী বা লেবেল প্রিন্ট করে?
চাবি। যদি বিকল্প হয় outlined আউটলাইন লেবেল সহ, {{ layout_style }} প্রিন্ট outlined.
কেন আমার {% যদি %} চেক কখনও মেলে না?
এটি সম্ভবত লেবেল বা একটি ভুল বানান কী এর সাথে তুলনা করছে। বিকল্প সারির বাম বাক্স থেকে সঠিক কী ব্যবহার করুন, উদাহরণস্বরূপ {% if badge == 'popular' %}.
আমি ডিফল্ট মান খালি রাখলে কি হবে?
উইজেটটি তালিকার প্রথম বিকল্পে শুরু হয়।
সিলেক্ট এবং সিলেক্ট 2 এর মধ্যে পার্থক্য কি?
নির্বাচন হল একটি পছন্দের সাথে একটি প্লেইন ড্রপডাউন। Select2 হল একটি প্রো ক্ষেত্র যেখানে একটি অনুসন্ধানযোগ্য তালিকা রয়েছে যা বিভিন্ন পছন্দের অনুমতি দিতে পারে।
মোড়ানো #
একটি নির্বাচন ক্ষেত্র যোগ করুন, নমুনা সারিগুলিকে ছোট কী এবং পরিষ্কার লেবেল দিয়ে প্রতিস্থাপন করুন এবং একটি ডিফল্ট সেট করুন৷ তারপর স্টাইল ভেরিয়েন্টের জন্য একটি ক্লাস হিসাবে কীটি প্রিন্ট করুন বা এটি দিয়ে পরীক্ষা করুন {% if %} যখন মার্কআপ পরিবর্তন হয়। অনুসন্ধানযোগ্য বা একাধিক পছন্দের জন্য, দেখুন নির্বাচন 2, এবং চেক মূল্য প্রতিটি পরিকল্পনা অন্তর্ভুক্ত কি জন্য।
