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


একটি ছবিতে চারটি মার্কার প্রকার
দ্য টাইপ করা একটি মার্কারের বিষয়বস্তু ট্যাবে নিয়ন্ত্রণ আপনাকে চারটি আকার দেয় এবং আপনি একটি একক চিত্রের মধ্যে চারটি মিশ্রিত করতে পারেন।
কোনোটিই নয় একটি খালি রঙিন বিন্দু ছেড়ে। এটি ঘন ডায়াগ্রামের জন্য সবচেয়ে পরিষ্কার বিকল্প যেখানে লেবেল একে অপরের সাথে সংঘর্ষ করবে।
টেক্সট মার্কার ভিতরে একটি ছোট স্ট্রিং প্রিন্ট করে। সংখ্যাগুলি এখানে ভাল কাজ করে, কারণ 01, 02 এবং 03 একটি পণ্যের শট জুড়ে একটি নির্দেশিত সফর হিসাবে পড়া হয় যেখানে লেখার জন্য কোন কিংবদন্তি নেই। দীর্ঘ স্ট্রিংগুলি বিন্দুটিকে একটি বড়িতে পরিণত করে, যা আপনি "কোলোন নং 5" এর মতো কিছুর জন্য চান।
আইকন লাইব্রেরি থেকে যেকোন ফন্ট অসাধারণ আইকন নেয়, তাই একটি পাতা উপাদানের জন্য এবং একটি রেটিং এর জন্য একটি তারকা দাঁড়াতে পারে।
ছবি আপনার মিডিয়া লাইব্রেরি থেকে একটি ছবির জন্য মার্কার অদলবদল করে। পণ্য থাম্বনেইল এবং অবতার সেরা পড়া; ব্যস্ত কিছু মার্কার আকারে মাশ হয়ে যায়।
প্রতিটি চিহ্নিতকারীও একটি গ্রহণ করে লিঙ্ক। যখন টুলটিপগুলি হোভারে খোলে বা আপনি যেখানে টুলটিপগুলি বন্ধ করে দিয়েছেন সেখানে ব্রেকপয়েন্টগুলিতে সেই লিঙ্কটি জ্বলে। ট্রিগার অন ক্লিক চালু থাকাকালীন এটি ফায়ার হয় না, কারণ ট্যাপটি ইতিমধ্যেই নেওয়া হয়েছে৷।
শতাংশ দ্বারা প্রতিটি মার্কার রাখুন
দ্য অবস্থান ট্যাব দুটি স্লাইডার ধারণ করে, অনুভূমিক অবস্থান এবং উল্লম্ব অবস্থান, উভয়ই চিত্রের শতাংশে পরিমাপ করা হয়। 50 এবং 24 সেট করা একটি মার্কারকে মাঝখানের এক চতুর্থাংশ নিচে রাখে। কোন ড্র্যাগ-অন-ক্যানভাস প্লেসমেন্ট নেই, তাই আপনি সংখ্যাগুলি নাজ করুন এবং পূর্বরূপ দেখুন।
শতাংশ হল যা একটি ফোনে মার্কারদের সৎ রাখে। বেস ইমেজ তার কন্টেইনারের সাথে স্কেল করে এবং প্রতিটি মার্কার তার আপেক্ষিক স্থান রাখে, তাই বোতলের ক্যাপে পিন করা একটি লেবেল এখনও বোতলের ক্যাপে 390px চওড়া থাকে, যেখানে একটি পিক্সেল অফসেট বন্ধ হয়ে যেত।
একই ট্যাব প্রতি-মার্কার বহন করে প্রদর্শন করা, যা সেই এক মার্কারের জন্য গ্লোবাল টুলটিপ সাইডকে ওভাররাইড করে। এটি সাহায্য করে যখন একটি মার্কার ডান প্রান্তের কাছে বসে এবং এর টুলটিপ ছবিটি বন্ধ করে দেয়: এটিকে বামে সেট করুন এবং বাকিটি উপরে ছেড়ে দিন।
ডিফল্টরূপে মার্কার পালস। দ্য পালস প্রভাব অক্ষম করুন হটস্পট বিভাগের নীচের অংশে স্যুইচ করলে প্রতিটি মার্কারের জন্য একবারে অ্যানিমেশন বন্ধ হয়ে যায়, যা সাধারণত পনেরটি পিন সহ একটি ফ্লোর প্ল্যানের প্রয়োজন হয়।


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

এলিমেন্টর প্রো হটস্পট বনাম মাস্টার অ্যাডঅন ইমেজ হটস্পট
Elementor Pro তার নিজস্ব হটস্পট উইজেট পাঠায়। আপনি যদি ইতিমধ্যেই Elementor Pro-এর জন্য অর্থ প্রদান করেন, তাহলে প্রথমে সেটি পরীক্ষা করে দেখুন, কারণ আপনার এটির প্রয়োজন নাও হতে পারে।
| বৈশিষ্ট্য | এলিমেন্টর প্রো হটস্পট | মাস্টার অ্যাডঅন ইমেজ হটস্পট |
|---|---|---|
| দাম | এলিমেন্টর প্রো প্রয়োজন | মাস্টার অ্যাডনস প্রো প্রয়োজন |
| মার্কার প্রকার | কাস্টম আকার সহ লেবেল পাঠ্য এবং একটি আইকন | কোনটিই নয়, পাঠ্য, আইকন বা চিত্র |
| মার্কার অ্যানিমেশন | সিকোয়েন্সড অ্যানিমেশন সহ সফট বিট, প্রসারিত বা ওভারলে | পালস চালু বা বন্ধ |
| টুলটিপ সামগ্রী | বিন্যাস সহ সমৃদ্ধ পাঠ্য | শুধুমাত্র প্লেইন টেক্সট |
| টুলটিপ ট্রিগার | হোভার, ক্লিক বা কিছুই না | হোভার, অথবা ক্লিকে ট্রিগার দিয়ে ক্লিক করুন |
| টুলটিপ অ্যানিমেশন | একটি সময়কাল সেটিং সহ বিবর্ণ এবং স্লাইড শৈলী | Shift-Away, Shift-Toward, Fade, Scale, Perspective, plus arrow, অফসেট এবং দূরত্ব |
| মোবাইল | ডিভাইস অবস্থান প্রতি | ট্যাবলেট এবং মোবাইল বা মোবাইলে টুলটিপ অক্ষম করুন |
এলিমেন্টর প্রো সমৃদ্ধ টুলটিপ টেক্সট এবং মার্কার অ্যানিমেশনে জিতেছে। আপনি যদি ইমেজ মার্কার চান বা ইতিমধ্যেই Elementor Pro ছাড়া Master Addons Pro ব্যবহার করেন তাহলে মাস্টার অ্যাডঅন হল বাছাই। সম্পর্কিত: বিনামূল্যে টুলটিপ উইজেট, দ টুলটিপস এক্সটেনশন (প্রো), চিত্র তুলনা এবং ইমেজ হোভার প্রভাব.
যেখানে একটি ইমেজ হটস্পট তার স্থান অর্জন করে
শপ-দ্য-লুক ফটোগ্রাফি সুস্পষ্ট এক। একটি একক লাইফস্টাইল শট, পণ্য প্রতি একটি ইমেজ মার্কার, প্রতিটি আইটেমের নামকরণের একটি টুলটিপ এবং এর পণ্য পৃষ্ঠার মাধ্যমে একটি লিঙ্ক। এটি থাম্বনেইলের গ্রিডের চেয়ে ভাল কাজ করে কারণ দর্শকরা তাদের মূল্য দেখার আগে টুকরোগুলিকে একসাথে স্টাইল করা দেখে।
একটি বিশেষ টেবিল ছাড়া চশমা শান্ত ব্যবহার। ক্যামেরা বডি, ঘড়ি এবং যন্ত্রপাতিতে, সংখ্যাযুক্ত মার্কারগুলি আপনার চয়ন করা ক্রমে বস্তুর চারপাশে একটি পাঠককে হেঁটে যায় এবং কাউকে ফটোতে টেবিলের 4 সারি ম্যাপ করতে হবে না।
তারপর ফ্লোর প্ল্যান, ক্যাম্পাস ম্যাপ এবং লেবেলযুক্ত ডায়াগ্রাম রয়েছে। পালস ইফেক্ট অক্ষম করার সাথে বিন্দু, ক্লিকে ট্রিগার করার জন্য টুলটিপ সেট করা হয়েছে এবং প্রতিটি মার্কারে একটি লিঙ্ক পুরো পৃষ্ঠায় নির্দেশ করছে। পনেরটি পিন সেভাবে পাঠযোগ্য থাকে; পনেরটি স্পন্দন বড়ি করে না।














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

গ্লাসমরফিজম

ধারক অতিরিক্ত

নিদর্শন
![এলিমেন্টরের জন্য মাস্টার অ্যাডঅন পোস্ট/পেজ ডুপ্লিকেটর এক্সটেনশন: ওয়ার্ডপ্রেস পেজ লিস্টে এমএ ডুপ্লিকেটর সারি লিঙ্ক একটি ল্যান্ডিং পেজ তৈরি করে - [ডুপ্লিকেটেড #128] ড্রাফ্ট](https://d1asvmc6qcowgk.cloudfront.net/wp-content/uploads/2026/09/15102930/post-page-duplicator-768x403.webp)
পোস্ট/পেজ ডুপ্লিকেটর

