সংখ্যা

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

সংখ্যা হল একটি ক্ষেত্র যা আপনি বিনামূল্যে সংস্করণের উইজেট বিল্ডারে ব্যবহার করতে পারেন। বিনামূল্যের প্লাগইনটিতে একটি সীমিত উইজেট বিল্ডার রয়েছে এবং ক্ষেত্রগুলির সম্পূর্ণ সেট সহ আসে মাস্টার অ্যাডনস প্রো.

সংখ্যা ক্ষেত্র কি করে #

• Elementor-এ আপনার উইজেটের প্যানেলে স্পিনার তীর সহ একটি সংখ্যাসূচক ইনপুট যোগ করে।
• সম্পাদকরা যা প্রবেশ করতে পারে তা সীমিত করে মিন, সর্বোচ্চ এবং ধাপ.
• HTML, CSS বা JS প্যানেলে আপনি যেখানেই টোকেন রাখেন নম্বরটি প্রিন্ট করে।
• তুলনা কাজ করে, তাই {% if columns > 2 %} মার্কআপের অংশ পরিবর্তন করতে পারেন।

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

আপনি শুরু করার আগে #

• এলিমেন্টর ইনস্টল এবং সক্রিয় সহ ওয়ার্ডপ্রেস।
• এলিমেন্টর ইনস্টল এবং সক্রিয় জন্য মাস্টার অ্যাডঅন। দ্য ইনস্টলেশন গাইড সেটআপ কভার করে।
• উইজেট বিল্ডারে একটি উইজেট খোলা। এই গাইডের উদাহরণ হল দুটি সংখ্যা ক্ষেত্র সহ একটি “ Counter” উইজেট: columns (1 থেকে 4) বিষয়বস্তু ট্যাবে এবং stat_size (20 থেকে 96) স্টাইল ট্যাবে।

কিভাবে একটি সংখ্যা ক্ষেত্র যোগ করতে হয় #

1. যাও মাস্টার অ্যাডঅন > উইজেট নির্মাতা এবং আপনার উইজেট খুলুন।
2. সেটিংটি যে ট্যাবে রয়েছে তাতে একটি বিভাগ যোগ করুন। একটি লেআউট গণনা ফিট বিষয়বস্তু, একটি আকার ফিট শৈলী.
3. টাইপ করা number বাম দিকে ফিল্ড সার্চ বক্সে।
4. টেনে আনুন সংখ্যা বিভাগে। সেটিংস খুলতে মাঠের পেন্সিলটিতে ক্লিক করুন।

সংখ্যা ক্ষেত্রের বিকল্প ব্যাখ্যা করা হয়েছে #

• লেবেল: এলিমেন্টরে ইনপুটের পাশের পাঠ্য, উদাহরণস্বরূপ “Columns”।
• নাম: ক্ষেত্রের অনন্য আইডি এবং এর টোকেনের নাম। উদাহরণস্বরূপ, শুধুমাত্র অক্ষর, সংখ্যা এবং আন্ডারস্কোর ব্যবহার করুন columns.
• বর্ণনা: এলিমেন্টরে ইনপুটের অধীনে দেখানো একটি ইঙ্গিত। বলুন সংখ্যা কি নিয়ন্ত্রণ করে এবং, যদি এটি গুরুত্বপূর্ণ হয়, ইউনিট।
• স্থানধারক: ইনপুট খালি থাকা অবস্থায় ধূসর টেক্সট দেখানো হয়েছে।
• মিন এবং সর্বোচ্চ: ইনপুট গ্রহণ করে সর্বনিম্ন এবং সর্বোচ্চ মান।
• ধাপ: স্পিনার তীর প্রতিটি ক্লিকে কতদূর সরে যায়। পূর্ণ সংখ্যার জন্য 1, জোড় সংখ্যার জন্য 2, অর্ধেক ধাপের জন্য 0.5 ব্যবহার করুন।
• ডিফল্ট মান: উইজেটের একটি নতুন অনুলিপি যে নম্বর দিয়ে শুরু হয়।

মিন, ম্যাক্স এবং স্টেপ ইনপুটেই পৌঁছায়। আমাদের পরীক্ষায় কলাম ক্ষেত্রটি এলিমেন্টরে একটি নম্বর ইনপুট হিসাবে ন্যূনতম 1, সর্বোচ্চ 4 এবং ধাপ 1 সহ পৌঁছেছে, তাই তীরগুলি পরিসরের শেষে থামে।

সাধারণ সেটিংস সহ অন্যান্য ক্ষেত্রের মতো কাজ করে শর্তাবলী যদি সংখ্যাটি শুধুমাত্র তখনই প্রদর্শিত হবে যখন অন্য ক্ষেত্র সেট করা হয়।

আপনার টেমপ্লেটে নম্বরটি প্রিন্ট করুন #

টোকেন তিনটি প্যানেলে কাজ করে। স্ট্যাট কাউন্টার উইজেটে, এইচটিএমএল একটি ডেটা অ্যাট্রিবিউটে মান রাখে এবং এটি তুলনা করে ব্যবহার করে:

<div class="stats-grid" data-columns="{{ columns }}">
  ...
</div>
{% if columns > 2 %}
<p class="stats-note">Tip: drop to two columns for a narrower layout.</p>
{% endif %}

CSS প্যানেল হল যেখানে একটি সংখ্যা ক্ষেত্র সাধারণত তার রাখা উপার্জন করে। বন্ধনী বাইরে ইউনিট রাখুন, কারণ ক্ষেত্র একটি খালি সংখ্যা সঞ্চয় করে:

.stats-grid { grid-template-columns: repeat({{ columns }}, 1fr); }
.stat-value { font-size: {{ stat_size }}px; }

একই টোকেন JS প্যানেলে কাজ করে, উদাহরণস্বরূপ var perRow = {{ columns }};.

প্রতিটি সংখ্যা ক্ষেত্রকে একটি ডিফল্ট মান দিন #

একটি খালি ক্ষেত্র কিছুই প্রিন্ট করে না, এবং এটি নীরবে এর চারপাশের নিয়ম ভঙ্গ করে। কলাম ক্ষেত্র সাফ হওয়ার সাথে সাথে আমাদের CSS হয়ে গেছে repeat(, 1fr), কোন ব্রাউজার ড্রপ, এবং গ্রিড একটি একক কলামে ফিরে পড়ে। দ্য {% if columns > 2 %} চেক একই সময়ে ম্যাচিং বন্ধ। প্যানেলের কিছুই আপনাকে সতর্ক করে না।

তাই CSS বা JavaScript ফিড করে এমন যেকোনো নম্বর ক্ষেত্রে একটি ডিফল্ট মান সেট করুন এবং সম্পাদকরা এটি সাফ করতে পারলে আপনার টেমপ্লেটে একটি খালি মান যতটা সম্ভব বিবেচনা করুন।

একটি নম্বর ক্ষেত্রে নির্বাচক খালি রাখুন #

নির্বাচক বাক্স এই ক্ষেত্রের জন্য অদ্ভুত আচরণ করে, এবং আমাদের পরীক্ষায় এটি একবারে দুটি সমস্যা সৃষ্টি করে:

• এটি কোনও সম্পত্তির নাম ছাড়াই নিয়মে বেয়ার নম্বর লিখেছিল, তাই এটি থেকে কোনও ব্যবহারযোগ্য CSS বেরিয়ে আসেনি।
• যখন একজন নির্বাচক পূরণ করা হয়েছিল, তখন ক্ষেত্রের ডিফল্ট মান টোকেনে পৌঁছানো বন্ধ করে দেয়। একটি উইজেট কেউ রেন্ডার করা স্পর্শ করেনি font-size:px সামনের প্রান্তে। নির্বাচককে সাফ করা এটি ঠিক করেছে, এবং একই অস্পর্শিত উইজেট রেন্ডার করা হয়েছে font-size:44px.

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

এলিমেন্টরে নম্বর নিয়ন্ত্রণ ব্যবহার করুন #

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

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

সাধারণ ব্যবহারের ক্ষেত্রে #

• কলাম বা আইটেম গ্রিড এবং carousels মধ্যে গণনা।
• ফন্টের আকার, ব্যবধানের মান এবং পিক্সেলে প্রস্থ।
• তারকা রেটিং, পর্যালোচনা স্কোর এবং শতাংশ।
• একটি স্ক্রিপ্ট পড়ার গণনা এবং গতি, যেমন প্রতি স্লাইড আইটেম বা একটি অটোপ্লে বিলম্ব।

নম্বর ক্ষেত্রের সাথে কাজ করার জন্য টিপস #

• সর্বদা একটি ডিফল্ট মান সেট করুন। এটি একটি কার্যকরী উইজেট এবং একটি নিঃশব্দে ভাঙা নিয়মের মধ্যে পার্থক্য।
• মিন এবং ম্যাক্স সেট করুন ডিজাইন কি নিতে পারে। চারটি কলামের জন্য নির্মিত একটি গ্রিড 12 গ্রহণ করা উচিত নয়।
• লেবেল বা বিবরণে ইউনিট রাখুন, যেমন “number Size” সহ “in pixels”, যেহেতু ক্ষেত্রটি একটি প্লেইন নম্বর সঞ্চয় করে।
• টোকেনের বাইরে ইউনিট রাখুন সিএসএস-এ: {{ stat_size }}px, ধনুর্বন্ধনী ভিতরে না।
• পরিবর্তে ইউনিট সহ একটি স্লাইডার চান? দ্য স্লাইডার ক্ষেত্র একটি প্রো ক্ষেত্র যা সম্পাদকদের একটি ড্র্যাগ হ্যান্ডেল দেয়।

প্রায়শই জিজ্ঞাসিত প্রশ্নাবলী #

মোড়ানো #

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