ট্যাব

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

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

নীচে, ডেমো ভিডিওতে দেখানো একই লেআউট পছন্দগুলি ব্যবহার করে স্ক্র্যাচ থেকে কীভাবে এটি সেট আপ করবেন তা আমি আপনাকে নিয়ে যাব।

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

এর মূল অংশে, এই উইজেটটি ট্যাব লেবেলের একটি সেট এবং একটি বিষয়বস্তু এলাকা তৈরি করে। যখন কেউ একটি লেবেলে ক্লিক করে, ম্যাচিং প্যানেলটি উপস্থিত হয়।

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

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

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

উন্নত ট্যাব উইজেট যোগ করুন #

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

একটি প্রিসেট লেআউট চয়ন করুন #

চেহারা পরিবর্তন করার দ্রুততম উপায় হল শৈলী প্রিসেট কন্টেন্ট ট্যাবে ড্রপডাউন। আপনার কাছে চারটি বিকল্প আছে, এবং শেষেরটির জন্য প্রো প্রয়োজন:

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

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

ট্যাব এবং বিষয়বস্তু কনফিগার করুন #

একবার আপনি একটি লেআউট বাছাই করেছেন, প্রসারিত করুন বিষয়বস্তু ট্যাব তালিকা দেখতে বিভাগ। প্রতিটি আইটেমের নিজস্ব সেটিংস প্যানেল আছে। আপনি ট্যাবগুলিকে ডুপ্লিকেট, মুছে বা পুনরায় সাজাতে পারেন এবং আঘাত করতে পারেন৷ আইটেম যোগ করুন যখন আপনার আরও প্রয়োজন।

প্রতি-ট্যাব সেটিংস #

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

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

দ্বিতীয় ট্যাবের জন্য, ডেমো একটি আইকনে স্যুইচ করে। আইকন টাইপ চয়ন করুন এবং লেবেলের সাথে মেলে এমন কিছু চয়ন করুন। এই ক্ষেত্রে, একটি স্পিডোমিটার-স্টাইল আইকন "বেটার পারফরম্যান্স।”" এর জন্য ভাল কাজ করে

একটি ট্যাবের (প্রো) ভিতরে একটি সংরক্ষিত বিভাগ লোড করুন #

মাস্টার অ্যাডনস প্রো দিয়ে, পরিবর্তন করুন বিষয়বস্তুর প্রকার প্রতি সংরক্ষিত বিভাগ এবং আপনার Elementor লাইব্রেরি থেকে যেকোনো টেমপ্লেট বেছে নিন। ডেমো একটি ট্যাবের ভিতরে একটি সম্পূর্ণ FAQ অ্যাকর্ডিয়ন লোড করে, যার মানে আপনার প্যানেলে শিরোনাম, অ্যাকর্ডিয়ন, ফর্ম বা অন্য কিছু থাকতে পারে যা আপনি একটি টেমপ্লেট হিসাবে সংরক্ষণ করেছেন।

ট্যাব এবং বিষয়বস্তু শৈলী #

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

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

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

উন্নত সেটিংস #

দ্য উন্নত ট্যাবে সাধারণ এলিমেন্টর নিয়ন্ত্রণ রয়েছে যা আপনি আশা করেন: মার্জিন, প্যাডিং, প্রবেশদ্বার অ্যানিমেশন, প্রতিক্রিয়াশীল দৃশ্যমানতা, কাস্টম CSS এবং বৈশিষ্ট্য। পজিশনিং সামঞ্জস্য করতে বা নির্দিষ্ট স্ক্রিনের আকারে ট্যাবগুলি লুকাতে এগুলি ব্যবহার করুন।

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

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

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

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

ভাল ট্যাব জন্য টিপস #

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

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

মোড়ানো #

দ্য উন্নত ট্যাব উইজেট নির্মাণ একটি কঠিন উপায় এলিমেন্টর উন্নত ট্যাব একাধিক লেআউট এবং সমৃদ্ধ সামগ্রী প্যানেল সহ। আপনি যে ডিজাইনটি চান তা না পাওয়া পর্যন্ত প্রতি-ট্যাব ইমেজ, আইকন বা সংরক্ষিত বিভাগগুলির সাথে প্রিসেটগুলিকে মিশ্রিত করুন এবং মেলান৷।

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