বেশিরভাগ টেক্সট লিঙ্ক হোভারে একটি কাজ করে: রঙ পরিবর্তন করুন। দ্য এলিমেন্টর ক্রিয়েটিভ লিঙ্ক উইজেট মাস্টার অ্যাডনস থেকে আপনাকে খেলার জন্য আরও অনেক কিছু দেয়: বন্ধনী যা শব্দের চারপাশে স্লাইড করে, একটি ফিল যা টেক্সট জুড়ে ছড়িয়ে পড়ে, একটি 3D ফ্লিপ (প্রো), এবং মোট 22টি হোভার ইফেক্ট আপনি একটি না খুলেই যেকোনো লিঙ্কে ড্রপ করতে পারেন। CSS ফাইল।
নীচে, আমরা উইজেট যোগ করব, প্রতিটি বিষয়বস্তু নিয়ন্ত্রণের মধ্য দিয়ে যাব, স্টাইল বিকল্পগুলি কভার করব এবং প্রভাব তালিকাটি চালাব। সম্পাদক থেকে স্ক্রিনশট প্রতিটি ধাপের সাথে আসে। প্রথমত, এখানে উইজেটটি প্যানেলে বসে।
ক্রিয়েটিভ লিঙ্ক উইজেট কি করে #
এটি একটি প্লেইন ইনলাইন লিঙ্ক নেয় এবং এটি সরাতে দেয়। দ্য ক্রিয়েটিভ বোতাম উইজেট একটি কঠিন, প্যাডেড বোতাম স্টাইল করে। ক্রিয়েটিভ লিঙ্ক হল টেক্সট-লিঙ্ক সংস্করণ: একটি “আরও পড়ুন", একটি নেভি-স্টাইল কল টু অ্যাকশন, অথবা একটি বাক্যাংশ যা আপনি একটি বাক্যের ভিতরে দাঁড়াতে চান। অ্যানিমেশনটি হোভারে জ্বলে, এবং আপনি এটি একটি ড্রপডাউন থেকে বেছে নিন।
এছাড়াও আপনি একটি ঐচ্ছিক আইকন, একটি বিকল্প লেবেল যা কিছু প্রভাব প্রকাশ করে, প্রান্তিককরণ নিয়ন্ত্রণ, এবং টাইপোগ্রাফি, সীমানা এবং লিঙ্ক অ্যানিমেশনগুলির চারপাশে নির্মিত রঙের বিকল্পগুলির একটি সেট সহ একটি স্টাইল ট্যাব পাবেন৷ এটি 10টি প্রভাব সহ বিনামূল্যের মাস্টার অ্যাডঅন প্লাগইনে রয়েছে এবং মাস্টার অ্যাডঅন প্রো অন্য 12টি আনলক করে। সম্পূর্ণ উইজেট এবং এক্সটেনশন তালিকা বাকি আছে।
বরং প্রতিটি সেটিং পড়ার আগে এটি দেখুন? এখানে উইজেট কাজ করছে।
আপনি শুরু করার আগে #
- ওয়ার্ডপ্রেস সঙ্গে এলিমেন্টর ইনস্টল এবং সক্রিয়।
- এলিমেন্টরের জন্য মাস্টার অ্যাডঅন ইনস্টল এবং সক্রিয়। এটা নতুন? দিয়ে শুরু করুন ইনস্টলেশন গাইড.
- এলিমেন্টর এডিটরে একটি পৃষ্ঠা বা টেমপ্লেট খোলা।
কিভাবে ক্রিয়েটিভ লিঙ্ক উইজেট যোগ করবেন #
এই অংশটি দ্রুত:
- Elementor দিয়ে একটি পৃষ্ঠা খুলুন এবং উপরের-বামে উইজেট প্যানেল আইকনে (গ্রিড) ক্লিক করুন।
- টাইপ করা সৃজনশীল লিঙ্ক অনুসন্ধান বাক্সে, অথবা নিচে স্ক্রোল করুন মাস্টার অ্যাডনস শ্রেণী।
- টেনে আনুন সৃজনশীল লিঙ্ক ক্যানভাসে উইজেট।
এটি স্থানধারক “Here” পাঠ্যের সাথে অবতরণ করে, আপনার সম্পাদনা করার জন্য প্রস্তুত৷।
বিষয়বস্তু সেটিংস ব্যাখ্যা করা হয়েছে #
লিঙ্কটি নির্বাচন করুন এবং খুলুন বিষয়বস্তু ট্যাব। এখানেই আপনি পাঠ্য, প্রভাব এবং লিঙ্কটি কোথায় সেট করেন।
প্রভাব #
দ্য প্রভাব ড্রপডাউন এই উইজেট ব্যবহার করার পুরো কারণ। একটি বাছাই করুন এবং লিঙ্কটি হোভারে অ্যানিমেট করে। তালিকায় 22টি বিকল্প রয়েছে। দশটি বিনামূল্যে এবং বারোটির প্রো প্রয়োজন:
বিনামূল্যে: বন্ধনী, বটম লাইন স্লাইড, বটম বর্ডার এনলার্জ, ২য় বর্ডার স্লাইড আপ, টেক্সট ফিল, থ্রি ডট, স্কেল ডাউন, মুভ আপ, ইফেক্ট 21 এবং ইফেক্ট 22।
প্রো: 3D ইফেক্ট, স্লাইড ইন, বর্ডার স্লাইড ডাউন, বর্ডার ট্রান্সলেট, ২য় টেক্সট এবং বর্ডার, রিভিল পুশ আউট, সার্কেল, বর্ডার সুইচ, ফল ডাউন, ক্রস, 3D স্লাইড এবং 3D স্লাইড ডাউন।
নামগুলি খুব বেশি কিছু দেয় না, তাই প্রত্যেকে কী করে তা দেখতে লাইভ প্রিভিউতে লিঙ্কটি ঘোরান৷ বন্ধনী এবং টেক্সট ফিল বডি কপিতে ভাল কাজ করে। 3D বিকল্পগুলি (প্রো) আরও জোরে এবং উপযুক্ত শিরোনাম বা একটি হিরো লিঙ্ক।
আইটেম প্রান্তিককরণ, লিঙ্ক প্রান্তিককরণ, এবং পিছনে পাঠ্য প্রান্তিককরণ #
আইটেম প্রান্তিককরণ পুরো উইজেটটি অবস্থান করে (বাম, কেন্দ্র, ডান)। লিঙ্ক প্রান্তিককরণ এবং ব্যাক টেক্সট অ্যালাইনমেন্ট লিঙ্ক টেক্সট এবং বিকল্প লেবেল পরিচালনা করুন যা কিছু প্রভাব নিয়ে আসে। তিনটিই প্রতিক্রিয়াশীল, তাই আপনি টগল দিয়ে ডিভাইস প্রতি সেট করতে পারেন।
লিঙ্ক টেক্সট এবং বিকল্প লিঙ্ক টেক্সট #
দ্য লিঙ্ক টেক্সট দৃশ্যমান লেবেল, বলুন “Here”। দ্য বিকল্প লিঙ্ক পাঠ্য (স্ক্রিনশটগুলিতে "গো!") হল দ্বিতীয় লেবেল যা রিভিল পুশ আউট, মুভ আপ, ক্রস, 3D স্লাইড এবং 3D স্লাইড ডাউনে অদলবদল করে৷ এটিকে সংক্ষিপ্ত রাখুন, যেহেতু এটি শুধুমাত্র অ্যানিমেশনটি রেখে যাওয়া স্থান পায়।
আইকন এবং আইকন ব্যবধান #
আপনি পাঠ্যের পাশে একটি আইকন বসতে পারেন, তারপর ফাঁকটি সেট করুন আইকন ব্যবধান. মাস্টার অ্যাডনস আটটি প্রিমিয়াম বান্ডিল করে আইকন লাইব্রেরি, তাই এলিমেন্টরের ভিতর থেকে বাছাই করার জন্য প্রচুর আছে।
লিঙ্ক URL #
গন্তব্য ড্রপ ইন লিঙ্ক URL। এর পাশের গিয়ার আইকনটিতে সাধারণ বিকল্পগুলি রয়েছে: একটি নতুন ট্যাবে খুলুন, nofollow যোগ করুন৷ একটি অন-সাইট লিঙ্কের জন্য, আপনার নিজের সাইট থেকে যেকোনো পৃষ্ঠা পেস্ট করুন।
শৈলী সেটিংস ব্যাখ্যা করা হয়েছে #
সুইচ শৈলী ট্যাব এবং খুলুন লিঙ্ক শৈলী। অ্যানিমেশনের আগে এবং পরে লিঙ্কটি এভাবেই দেখায়।
- প্রস্থ এবং আইকনের আকার: লিঙ্ক বক্স এবং আইকন তাদের নিজস্ব আকার।
- টাইপোগ্রাফি: লেবেলের জন্য ফন্ট পরিবার, আকার, ওজন এবং অক্ষরের ব্যবধান।
- লিঙ্ক প্যাডিং: লিঙ্ক এলাকার ভিতরে ব্যবধান। এটি অ্যানিমেট করার জন্য কিছু প্রভাব রুম দেয়।
- সীমানার ধরন, প্রস্থ, রঙ এবং ব্যাসার্ধ: লিঙ্ক বক্সের চারপাশে একটি সীমানা। বটম লাইন স্লাইডের মতো প্রভাবে চলমান লাইনগুলি বিজি রঙের আগে এবং পরে আসে, এই সীমানা থেকে নয়।
- বক্স ছায়া: আপনি যদি চান লিঙ্ক বক্সের গভীরতা।
সাধারণ এবং হোভার রং #
রঙ নিয়ন্ত্রণ বিভক্ত স্বাভাবিক এবং ঘোরাঘুরি করা রাজ্যগুলি। স্বাভাবিকের পাশাপাশি টেক্সট কালার এবং পটভূমির রঙ, তুমি দেখতে পাবে সামনের বিজি কালার, বিজি রঙের আগে, এবং বিজি কালারের পর। এই অতিরিক্ত স্তরগুলি হল স্লাইড এবং ফিল ইফেক্টগুলির মধ্যে অ্যানিমেট করে, তাই আপনি যখন মধ্য-অ্যানিমেশন দেখায় এমন রঙ নিয়ন্ত্রণ করতে চান তখন সেগুলি সেট করুন৷।
কর্মে একটি প্রভাব দেখা #
এখানে ক্যানভাসে বন্ধনী প্রভাব আছে। লিঙ্কটি ঘোরান এবং প্রতিটি পাশে একটি বন্ধনী স্লাইড করে, তাই “Here” "“[এখানে ক্লিক করুন]” হিসাবে পড়ে। প্রতিটি প্রভাব লাইভ প্রিভিউতে এইরকম আচরণ করে, যা আপনার প্রতিশ্রুতি দেওয়ার আগে কয়েকটি চেষ্টা করা সহজ করে তোলে।
সৃজনশীল লিঙ্ক ব্যবহার করার জন্য টিপস #
- প্রভাব স্পট মেলে। টেক্সট ফিল বা বটম লাইন স্লাইডের মতো সূক্ষ্মগুলি অনুচ্ছেদে ভালভাবে বসে। শিরোনাম এবং হিরো এলাকার জন্য 3D স্লাইড এবং ক্রস (উভয় প্রো) সংরক্ষণ করুন।
- বিজি রং দেখুন। সামনে, আগে এবং পরে ব্যাকগ্রাউন্ডগুলি আপনার টেক্সট মিড-অ্যানিমেশন ধুয়ে ফেলতে পারে, তাই পুরো প্রভাবের মাধ্যমে লিঙ্কটি পাঠযোগ্য থাকে তা পরীক্ষা করুন।
- বিকল্প লেবেল ছোট রাখুন। একটি দীর্ঘ বিকল্প লিঙ্ক টেক্সট অ্যানিমেশন ছেড়ে স্থান সঙ্কুচিত হয়।
- স্পর্শ ভুলবেন না. হোভার একটি ফোনে ফায়ার করে না, তাই বিশ্রামের অবস্থাটি নিজেই শেষ দেখতে হবে।
একটি টেক্সট লিঙ্কের পরিবর্তে একটি সম্পূর্ণ কঠিন বোতাম প্রয়োজন? এটাই ক্রিয়েটিভ বোতাম উইজেট. একটি শিরোনাম, বিবরণ, এবং বোতাম একসাথে চান? তাকান কল টু অ্যাকশন উইজেট.
প্রায়শই জিজ্ঞাসিত প্রশ্নাবলী #
Elementor Creative Links উইজেট কি?
এটি একটি মাস্টার অ্যাডঅন উইজেট যা এলিমেন্টরে অ্যানিমেটেড টেক্সট লিঙ্ক যোগ করে। একটি সাধারণ রঙ পরিবর্তনের পরিবর্তে, লিঙ্কগুলি বন্ধনী, টেক্সট ফিল এবং (প্রো সহ) সার্কেল এবং 3D স্লাইডের মতো হোভার ইফেক্ট পায়, যা কোনো কাস্টম CSS ছাড়াই ড্রপডাউন থেকে সেট করা হয়।
কয়টি লিঙ্ক প্রভাব অন্তর্ভুক্ত করা হয়েছে?
উইজেটে 22টি প্রভাব রয়েছে। বন্ধনী, বটম লাইন স্লাইড, টেক্সট ফিল, থ্রি ডটস এবং মুভ আপ সহ দশটি বিনামূল্যে। 3D ইফেক্ট, স্লাইড ইন, সার্কেল, বর্ডার সুইচ, ক্রস এবং 3D স্লাইড সহ বারোটির প্রো প্রয়োজন। আপনি প্রকাশ করার আগে এলিমেন্টর এডিটরে লাইভ প্রতিটির পূর্বরূপ দেখুন।
ক্রিয়েটিভ লিঙ্ক উইজেট বিনামূল্যে?
হ্যাঁ। ক্রিয়েটিভ লিঙ্কগুলি 10টি প্রভাব সহ এলিমেন্টর প্লাগইনের জন্য বিনামূল্যের মাস্টার অ্যাডঅনগুলির অংশ৷ মাস্টার অ্যাডঅন প্রো অন্যান্য 12টি প্রভাব যুক্ত করে। দেখুন মূল্য পৃষ্ঠা সম্পূর্ণ তুলনার জন্য।
ক্রিয়েটিভ লিঙ্ক এবং ক্রিয়েটিভ বোতামের মধ্যে পার্থক্য কি?
ক্রিয়েটিভ লিঙ্কগুলি ইনলাইন টেক্সট লিঙ্কগুলিকে অ্যানিমেট করে, যেমন একটি “আরও পড়ুন" বা একটি বাক্যে একটি বাক্যাংশ৷ ক্রিয়েটিভ বোতাম একটি কঠিন, প্যাডেড বোতাম স্টাইল করে। টেক্সট-স্টাইল কল টু অ্যাকশনের জন্য লিঙ্ক এবং ব্লক-স্টাইলের জন্য বোতামগুলি বেছে নিন।
লিঙ্ক হোভার প্রভাব মোবাইলে কাজ করে?
হোভার ইফেক্টের জন্য একটি মাউস প্রয়োজন, তাই তারা টাচস্ক্রিনে ট্রিগার করে না। বিশ্রামের অবস্থাটি সম্পূর্ণ দেখতে ডিজাইন করুন এবং লিঙ্কটি এখনও কাজ করে এবং ফোন এবং ট্যাবলেটগুলিতে ভালভাবে পড়ে।
মোড়ানো #
দ্য এলিমেন্টর ক্রিয়েটিভ লিঙ্ক উইজেট আপনার টেক্সট লিঙ্ক মুভমেন্ট দেয়: 22 হোভার ইফেক্ট (10 ফ্রি), একটি আইকন এবং অ্যানিমেশন লেয়ারের জন্য কালার কন্ট্রোল, কোন কোড ছাড়াই। একটি প্রভাব চয়ন করুন, রং সেট করুন, এবং আপনার লিঙ্কগুলি সেখানে বসে থাকা বন্ধ করুন। এখান থেকে, বাকি মাস্টার অ্যাডঅন উইজেট লাইব্রেরি একটি চেহারা মূল্য।
