উন্নত ইমেজ উইজেট সেটিংস

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

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

প্রথমে দেখতে পছন্দ করেন? এই সংক্ষিপ্ত টিউটোরিয়ালটি অ্যাডভান্সড ইমেজ উইজেটের মধ্য দিয়ে শেষ থেকে শেষ পর্যন্ত চলে:

অ্যাডভান্সড ইমেজ উইজেট কি করে #

এর মূল অংশে এটি একটি চিত্র দেখায়, তবে এটি উপরে অতিরিক্ত স্তর দেয়। একটি হোভার ইমেজ অদলবদল করে যখন কার্সারটি তার উপরে থাকে, একটি ফিতা একটি লেবেলকে কল করে যেমন "NEW,”" এবং সেটিংস ট্যাব একটি লাইটবক্স, একটি টিল্ট প্রভাব এবং একটি রঙিন ছায়া যোগ করে৷ সবকিছু প্যানেল থেকে কনফিগার করা হয়েছে, তাই একই চিত্র একটি সাধারণ ছবির চেয়ে অনেক বেশি করতে পারে।

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

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

• ওয়ার্ডপ্রেস সঙ্গে এলিমেন্টর ইনস্টল এবং সক্রিয়।
• এলিমেন্টরের জন্য মাস্টার অ্যাডঅন ইনস্টল এবং সক্রিয়। প্লাগইনে নতুন? দেখা ইনস্টলেশন গাইড.
• একটি ছবি দেখানোর জন্য, এবং দ্বিতীয়টি যদি আপনি হোভার অদলবদল করতে চান।

কিভাবে অ্যাডভান্সড ইমেজ উইজেট যোগ করবেন #

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

ইমেজ সেট করুন #

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

একটি হোভার ইমেজ যোগ করুন #

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

একটি ফিতা যোগ করুন #

দ্য ফিতা বিভাগটি ছবির উপরে একটি কোণার ব্যানার যুক্ত করেছে। চালু কর প্রদর্শন ফিতা, টেক্সট সেট করুন, এবং এটি দেখতে কেমন তা চয়ন করুন।

• পাঠ্য: লেবেল, যেমন নতুন বা বিক্রয়।
• ফিতা শৈলী: সরল, কোণ, বা ক্রস।
• ফিতা অবস্থান: এটিকে যেকোনো কোণে রাখুন, যেমন উপরের ডানে বা নীচে বামে।
• ফিতার বেধ এবং প্রস্থ: টেক্সট মাপসই ব্যান্ড আকার।

সেটিংস: লাইটবক্স, টিল্ট এবং শ্যাডো #

দ্য সেটিংস ট্যাব যেখানে আচরণ বাস করে। এগুলি হল অতিরিক্ত যা উইজেটটিকে একটি সাধারণ চিত্র থেকে আলাদা করে।

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

ইমেজ এবং ফিতা শৈলী #

দ্য শৈলী ট্যাব আকার এবং রং পরিচালনা করে। দ্য ছবি বিভাগ নিজেই ছবির চেহারা সেট করে।

• সর্বোচ্চ প্রস্থ এবং সর্বোচ্চ উচ্চতা: ছবির আকার ক্যাপ করুন।
• সীমানা ব্যাসার্ধ: বৃত্তাকার কোণ।
• সাধারণ এবং হোভার অবস্থা: বিশ্রাম এবং ঘোরাঘুরির জন্য আলাদাভাবে বক্স শ্যাডো, বর্ডার এবং ব্যাকগ্রাউন্ড সেট করুন।

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

পৃষ্ঠায় ফলাফল #

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

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

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

অ্যাডভান্সড ইমেজ উইজেটের সাথে কাজ করার জন্য টিপস #

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

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

মোড়ানো #

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