মিডিয়া

মিডিয়া ক্ষেত্রটি মাস্টার অ্যাডঅনগুলির সাথে নির্মিত একটি কাস্টম উইজেটে একটি চিত্র বাছাইকারী যুক্ত করে৷ উইজেট নির্মাতা। সম্পাদকরা মিডিয়া লাইব্রেরি থেকে একটি ছবি বেছে নেন বা Elementor-এ একটি নতুন আপলোড করেন এবং আপনার টেমপ্লেট তার URL, ID বা alt টেক্সট প্রিন্ট করে। প্রোফাইল ফটো, লোগো, হিরো ইমেজ, প্রোডাক্ট শট এবং অন্য কোন একক ইমেজ স্লটের জন্য এটি ব্যবহার করুন।

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

মিডিয়া ক্ষেত্র কি করে #

• এটি আপনার উইজেটের প্যানেলে এলিমেন্টরের ইমেজ বক্স যোগ করে, একটি ছবি চয়ন করুন বোতাম সহ।
• ছবি চয়ন করুন ওয়ার্ডপ্রেস মিডিয়া উইন্ডো খোলে, যেখানে সম্পাদকরা একটি ফাইল আপলোড করেন, মিডিয়া লাইব্রেরি থেকে একটি বাছাই করেন বা একটি URL থেকে একটি সন্নিবেশ করেন৷।
• ক্ষেত্রটি ছবিটি সংরক্ষণ করে url, id এবং alt পাঠ্য, এবং আপনার টেমপ্লেট যেটি প্রয়োজন তা প্রিন্ট করে।
• এটি এইচটিএমএল ট্যাব এবং সিএসএস ট্যাবে কাজ করে, উদাহরণস্বরূপ একটি ব্যাকগ্রাউন্ড ইমেজ হিসাবে।

আপনি যদি এখনও একটি উইজেট তৈরি না করে থাকেন তবে পড়ুন উইজেট নির্মাতা ওভারভিউ প্রথম।

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

• এলিমেন্টর ইনস্টল এবং সক্রিয় সহ ওয়ার্ডপ্রেস।
• এলিমেন্টর ইনস্টল এবং সক্রিয় জন্য মাস্টার অ্যাডঅন। দ্য ইনস্টলেশন গাইড সেটআপ কভার করে।
• উইজেট বিল্ডারে একটি উইজেট খোলা। এই গাইডের উদাহরণ হল একটি "প্রোফাইল কার্ড" উইজেট যার নাম একটি মিডিয়া ক্ষেত্র profile_photo এবং নামের জন্য একটি পাঠ্য ক্ষেত্র।

কিভাবে একটি মিডিয়া ক্ষেত্র যোগ করতে হয় #

1. যাও মাস্টার অ্যাডঅন > উইজেট নির্মাতা এবং আপনার উইজেট খুলুন।
2. উপর বিষয়বস্তু ট্যাব, একটি বিভাগ যোগ করুন, উদাহরণস্বরূপ “Profile”।
3. টাইপ করা media বাম দিকে ফিল্ড সার্চ বক্সে।
4. টেনে আনুন মিডিয়া বিভাগে। এর সেটিংস বাম সাইডবারে খোলে।

মিডিয়া ক্ষেত্রের বিকল্পগুলি ব্যাখ্যা করা হয়েছে #

• লেবেল এলিমেন্টরের ইমেজ বক্সের উপরের টেক্সট, উদাহরণস্বরূপ “ Photo”।
• নাম ক্ষেত্রের অনন্য আইডি এবং এর টোকেন শুরু, তাই profile_photo দেয় {{ profile_photo.url }}. অক্ষর, সংখ্যা এবং আন্ডারস্কোর শুধুমাত্র।
• বর্ণনা এলিমেন্টরে ইমেজ বক্সের নিচে প্রদর্শিত হবে।
• মিডিয়া প্রকার চিত্র (ডিফল্ট), ভিডিও, অডিও, পিডিএফ, এসভিজি, স্প্রেডশীট, নথি, উপস্থাপনা এবং সংরক্ষণাগার তালিকাভুক্ত করে। আমাদের পরীক্ষায় এই সেটিং এলিমেন্টরে পৌঁছায়নি। ভিডিওতে সেট করা একটি ক্ষেত্র এখনও একটি সাধারণ চিত্র বাছাইকারী হিসাবে দেখানো হয়েছে, তাই মিডিয়া ক্ষেত্রটিকে একটি চিত্র ক্ষেত্র হিসাবে বিবেচনা করুন।

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

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

ক্ষেত্রটি বেশ কয়েকটি মান ধারণ করে এবং আপনি প্রতিটিকে একটি বিন্দু দিয়ে মুদ্রণ করেন:

• {{ profile_photo.url }} ইমেজ ফাইল URL হয়। {{ profile_photo }} তার নিজস্ব প্রিন্ট একই URL।
• {{ profile_photo.id }} ছবিটির মিডিয়া লাইব্রেরি আইডি।
• {{ profile_photo.alt }} সম্পাদক এটি বাছাই করার সময় মিডিয়া লাইব্রেরিতে ছবিটির Alt পাঠ্য কি।

মোড়ানো <img> একটি চেকে ট্যাগ করুন, তাই ক্ষেত্রটি খালি থাকা অবস্থায় কিছুই প্রিন্ট হয় না:

{% if profile_photo.url %}
  <img class="profile-photo" src="{{ profile_photo.url }}" alt="{{ profile_photo.alt }}">
{% endif %}

টোকেনটি CSS ট্যাবেও কাজ করে, উদাহরণস্বরূপ একটি পটভূমি চিত্রের জন্য:

.profile-card {
  background-image: url('{{ profile_photo }}');
}

যদি আপনার ছবির শৈলী প্রযোজ্য না হয়, নির্বাচককে আরও নির্দিষ্ট করুন। উইজেটের ভিতরে এবং আমাদের পরীক্ষায় ছবির জন্য এলিমেন্টরের নিজস্ব নিয়ম রয়েছে .profile-photo একা তাদের বিরুদ্ধে জিততে পারেনি, যখন .profile-card .profile-photo করেছিল।

ক্লিক করুন সেটিংস সংরক্ষণ করুন আপনার কাজ শেষ হলে।

Elementor এ মিডিয়া নিয়ন্ত্রণ ব্যবহার করুন #

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

ইনসার্ট মিডিয়া উইন্ডো খোলে। অধীনে একটি ফাইল আপলোড করুন ফাইল আপলোড করুন, অধীনে একটি বাছাই মিডিয়া লাইব্রেরি, বা ব্যবহার করুন URL থেকে সন্নিবেশ করুন। ডানদিকের বিশদ প্যানেলটি চিত্রটির Alt পাঠ্য দেখায়, যা কি {{ profile_photo.alt }} প্রিন্ট। আপনি ক্লিক করার আগে সেখানে এটি পূরণ করুন নির্বাচন করুন.

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

• প্রোফাইল ফটো এবং দলের সদস্য কার্ড।
• হেডার, ফুটার এবং ক্লায়েন্ট তালিকায় লোগো।
• নায়ক এবং ব্যানার ইমেজ, একটি হিসাবে <img> ট্যাগ বা একটি CSS ব্যাকগ্রাউন্ড।
• কার্ডের ভিতরে পণ্য বা বৈশিষ্ট্যের ছবি।

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

• সর্বদা পাহারা দিন <img> সঙ্গে ট্যাগ {% if profile_photo.url %} তাই একটি খালি ক্ষেত্র একটি ভাঙা চিত্র ছেড়ে না।
• ছাপান {{ profile_photo.alt }} alt অ্যাট্রিবিউটে, এবং ছবি বাছাই করার আগে মিডিয়া লাইব্রেরিতে alt টেক্সট যোগ করুন।
• ব্যবহার object-fit: cover একটি নির্দিষ্ট প্রস্থ এবং উচ্চতা সহ যখন বিভিন্ন আকারের চিত্রগুলিকে লাইন আপ করতে হবে।
• ইমেজ নিয়ম দুই ক্লাস দিন, যেমন .profile-card .profile-photo, তাই Elementor এর নিজস্ব ইমেজ শৈলী তাদের ওভাররাইড করে না।
• বেশ কয়েকটি ছবির জন্য, ব্যবহার করুন গ্যালারি ক্ষেত্র। আইকন বা SVG চিহ্নের জন্য, ব্যবহার করুন আইকন ক্ষেত্র.

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

মোড়ানো #

মিডিয়া ক্ষেত্র যোগ করুন, মুদ্রণ করুন {{ field_name.url }} এবং {{ field_name.alt }} ভিতরে একটি {% if %} চেক করুন, এবং আপনার ছবির শৈলী একটি নির্দিষ্ট নির্বাচক দিন। সম্পাদকরা তারপর সরাসরি Elementor থেকে ছবি বাছাই বা আপলোড করুন। ছবির সাথে যাওয়ার জন্য একটি লিঙ্কের জন্য, একটি যোগ করুন URL ক্ষেত্র, এবং চেক মূল্য প্রতিটি পরিকল্পনা অন্তর্ভুক্ত কি জন্য।