কী টেকঅ্যাওয়ে
- Elementor এবং Elementor Pro-এর কোনো টাইমলাইন উইজেট নেই, তাই একটি Elementor অনুভূমিক টাইমলাইনে একটি অ্যাডন উইজেট বা কাস্টম CSS সহ একটি হাতে তৈরি সারি কন্টেইনার প্রয়োজন।
- মাস্টার অ্যাডনস টাইমলাইন উইজেট একটি নিয়ন্ত্রণ সহ উল্লম্ব থেকে অনুভূমিক দিকে স্যুইচ করে, টাইমলাইন স্টাইল, টাইমলাইন বিভাগের অধীনে বিষয়বস্তু ট্যাবে পাওয়া যায়।
- মাস্টার অ্যাডনস উইজেটে একটি অনুভূমিক টাইমলাইন হল একটি ক্যারোজেল, এবং এর নেভিগেশন নিয়ন্ত্রণ ছয়টি বিকল্প অফার করে: তীর এবং বিন্দু, তীর এবং ভগ্নাংশ, তীর, বিন্দু, অগ্রগতি এবং কিছুই নয়।
- টাইমলাইন উইজেটে ক্যারোজেল সেটিংসের মধ্যে রয়েছে একটি ক্যারোজেল বা কভারফ্লো লেআউট, 5000 ms এর ডিফল্ট গতি সহ অটোপ্লে, হোভারে বিরতি, স্ক্রল করার জন্য স্লাইড, সেন্টার স্লাইড এবং লুপ।
- অনুভূমিক বিন্যাস শুধুমাত্র কাস্টম টাইমলাইন আইটেমগুলির সাথে কাজ করে, কারণ ব্লগ পোস্টগুলি থেকে নির্মিত একটি পোস্ট টাইমলাইন উল্লম্ব থাকে৷।
একটি এলিমেন্টর অনুভূমিক টাইমলাইন আপনার তারিখগুলিকে বাম থেকে ডানে রাখে, প্রতিটি কার্ডের উপরে লাইনে একটি বিন্দু এবং এটি বরাবর সরানোর জন্য তীরগুলি সহ। এলিমেন্টর এর নিজস্ব কোনো টাইমলাইন উইজেট নেই, তাই এই নির্দেশিকাটি ব্যবহার করে মাস্টার অ্যাডঅনগুলিতে টাইমলাইন উইজেট, যেখানে অনুভূমিক বিন্যাস একটি একক ড্রপডাউন।
নীচের ছয়টি ধাপ একটি সাধারণ উল্লম্ব টাইমলাইন থেকে শুরু হয় এবং একটি কার্যকরী ক্যারোজেল দিয়ে শেষ হয়। প্রতিটি স্ক্রিনশট এলিমেন্টর 4.3 থেকে একটি পরীক্ষার পৃষ্ঠায় উইজেট সহ আসে। আপনি যদি এখনও একটি টাইমলাইন স্থাপন না করে থাকেন, তাহলে সম্পূর্ণ টাইমলাইন টিউটোরিয়াল প্রথমে মৌলিক বিষয়গুলো কভার করে।
বিষয়বস্তুর সারণী
যখন একটি অনুভূমিক টাইমলাইন ভাল পছন্দ
একটি অনুভূমিক টাইমলাইন ব্যবহার করুন যখন আপনার কাছে অল্প ধাপ এবং সীমিত উল্লম্ব স্থান থাকে। তিনটি কার্ড সহ একটি উল্লম্ব টাইমলাইন স্ক্রলিং এর একটি পূর্ণ পর্দার চেয়ে বেশি সময় নিতে পারে। একই তিনটি কার্ড পাশাপাশি এক সারিতে ফিট করে, যে কারণে অনুভূমিক লেআউটগুলি হোম পেজ এবং ল্যান্ডিং পৃষ্ঠাগুলিতে প্রদর্শিত হয়, যখন উল্লম্বগুলি দীর্ঘ পৃষ্ঠাগুলির জন্য উপযুক্ত।
| ফ্যাক্টর | অনুভূমিক সময়রেখা | উল্লম্ব সময়রেখা |
|---|---|---|
| সেরা দৈর্ঘ্য | 3 থেকে 8 আইটেম | যেকোনো দৈর্ঘ্য |
| স্থান এটা প্রয়োজন | এক সারি | প্রতিটি আইটেম সঙ্গে বৃদ্ধি |
| দর্শকরা কীভাবে সরে যায় | তীর, বিন্দু বা সোয়াইপ | পৃষ্ঠা স্ক্রোল করা হচ্ছে |
| সাধারণ ব্যবহার | প্রক্রিয়া পদক্ষেপ, পণ্য রোডম্যাপ, বার্ষিক হাইলাইট | কোম্পানির ইতিহাস, চেঞ্জলগ, দীর্ঘ গল্প |
| মাস্টার অ্যাডঅন উত্স | কাস্টম টাইমলাইন আইটেম | কাস্টম আইটেম বা ব্লগ পোস্ট |
একটি অনুভূমিক টাইমলাইন হল এক ধরনের ক্যারোজেল। আপনি যদি নিশ্চিত না হন যে দুটি পদের মধ্যে কোনটি আপনার ডিজাইনের সাথে খাপ খায়, এলিমেন্টরে ক্যারোজেল বনাম স্লাইডার পার্থক্য ব্যাখ্যা করে।
এলিমেন্টরে কীভাবে একটি অনুভূমিক টাইমলাইন তৈরি করবেন
আপনার এলিমেন্টর এবং মাস্টার অ্যাডঅন ইনস্টল করা দরকার, তারপর সম্পাদকে ছয়টি ধাপ। নিচের কোন কিছুর জন্য কাস্টম CSS প্রয়োজন নেই।
ধাপ 1: টাইমলাইন উইজেট যোগ করুন
Elementor দিয়ে আপনার পৃষ্ঠা খুলুন, এর জন্য উইজেট প্যানেল অনুসন্ধান করুন টাইমলাইন এবং পৃষ্ঠায় টেনে আনুন। এটি তিনটি নমুনা আইটেম সহ একটি উল্লম্ব টাইমলাইন হিসাবে আসে। ছেড়ে দিন টাইমলাইন প্রকার চালু কাস্টম টাইমলাইন, কারণ অনুভূমিক বিন্যাস শুধুমাত্র কাস্টম আইটেমগুলির জন্য দেওয়া হয়।
ধাপ 2: টাইমলাইন স্টাইলকে অনুভূমিক এ স্যুইচ করুন
বিষয়বস্তু ট্যাবে, খুলুন টাইমলাইন বিভাগ এবং পরিবর্তন টাইমলাইন স্টাইল উল্লম্ব টাইমলাইন থেকে অনুভূমিক সময়রেখা। কার্ডগুলি একটি সারিতে চলে যায়, লাইনটি উপরের দিকে চলে যায় এবং প্রতিটি পয়েন্ট তার কার্ডের উপরে তারিখ সহ বসে থাকে। প্যানেলে দুটি নতুন বিভাগ উপস্থিত হয়েছে: নেভিগেশন এবং ক্যারোজেল সেটিংস।
ধাপ 3: আইটেমগুলি সম্পাদনা করুন
অধীনে একটি সারি ক্লিক করুন আইটেম এটি খুলতে। প্রতিটি আইটেম তিনটি ছোট ট্যাব আছে: বিষয়বস্তু, মিডিয়া এবং শৈলী।
- প্রদর্শন বিন্দুর উপরে কী বসে তা নির্ধারণ করে: একটি তারিখ বা একটি কাস্টম লেবেল যেমন “phase 1”৷।
- তারিখ এবং তারিখ বিন্যাস তারিখ এবং কিভাবে লেখা হয় সেট করুন।
- লিঙ্ক পুরো কার্ড ক্লিকযোগ্য করে তোলে।
- বিষয়বস্তু সম্পাদক শিরোনাম এবং বিবরণ ধারণ করে। কোন পৃথক শিরোনাম ক্ষেত্র নেই, তাই প্রথম লাইন শিরোনাম।
- দ্য মিডিয়া ট্যাব কার্ডে একটি ছবি যোগ করে।
প্রশস্ত ছবি এখানে লম্বা ছবি থেকে ভালো কাজ করে। তিনটি লম্বা ফটো টেক্সটটিকে স্ক্রিনের অনেক নিচে ঠেলে দেয়।
ধাপ 4: নেভিগেশন চয়ন করুন
খোলা নেভিগেশন বিভাগ এবং দর্শকরা টাইমলাইনের মধ্য দিয়ে কীভাবে চলে তা বেছে নিন। নেভিগেশন ড্রপডাউনে ছয়টি বিকল্প রয়েছে।
| নেভিগেশন বিকল্প | দর্শনার্থীরা যা দেখেন | জন্য ভাল |
|---|---|---|
| তীর এবং বিন্দু | পূর্ববর্তী এবং পরবর্তী তীর এবং প্রতি স্লাইডে একটি বিন্দু | বেশিরভাগ টাইমলাইন |
| তীর এবং ভগ্নাংশ | তীর প্লাস একটি কাউন্টার যেমন 2 /6 | দীর্ঘ সময়রেখা যেখানে বিন্দু ভিড় করে |
| তীর | শুধুমাত্র তীর | পরিষ্কার লেআউট |
| বিন্দু | শুধু বিন্দু | স্পর্শ-প্রথম ডিজাইন |
| অগ্রগতি | একটি বার যা ক্যারোজেল অগ্রসর হওয়ার সাথে সাথে পূর্ণ হয় | প্রক্রিয়া পদক্ষেপ |
| কোনোটিই নয় | শুধুমাত্র সোয়াইপ বা অটোপ্লে | আলংকারিক রেখাচিত্রমালা |
ড্রপডাউনের নীচে আপনি চালু করতে পারেন গতিশীল বুলেট?, এর সাথে একটি স্ক্রলবার যোগ করুন স্ক্রলবার দেখান?, অবস্থান সেট করুন এবং পরবর্তী এবং পূর্ববর্তী আইকনগুলি অদলবদল করুন। মোবাইলে তীর লুকাবেন? ডিফল্টরূপে চালু থাকে, যা ফোন দর্শকদের সোয়াইপ এবং ডট দিয়ে ছেড়ে দেয়।
ধাপ 5: ক্যারোজেল আচরণ সেট করুন
খোলা ক্যারোজেল সেটিংস টাইমলাইন কিভাবে চলে তা নিয়ন্ত্রণ করতে।
- বিন্যাস: একটি সমতল সারির জন্য ক্যারোজেল, বা ঘূর্ণন, প্রসারিত এবং গভীরতা নিয়ন্ত্রণ সহ একটি 3D প্রভাবের জন্য কভারফ্লো।
- অটোপ্লে এবং অটোপ্লে গতি: ডিফল্ট গতি 5000 ms, তাই প্রতি পাঁচ সেকেন্ডে একটি নতুন স্লাইড।
- হোভারে বিরতি দিন: পয়েন্টার টাইমলাইনে থাকাকালীন অটোপ্লে বন্ধ করে।
- স্ক্রোল করার জন্য স্লাইড: প্রতি ক্লিকে কতগুলি কার্ড সরানো হয়, প্রতি ডিভাইসে সেট করা হয়।
- কেন্দ্র স্লাইড, কার্সার ধরুন এবং বিনামূল্যে মোড টেনে আনুন টেনে আনার অনুভূতির জন্য।
- লুপ: শেষের পরে প্রথম আইটেমে ফিরে আসে।
- অ্যানিমেশন গতি (এমএস): প্রতিটি স্লাইড ট্রানজিশন কতক্ষণ সময় নেয়, ডিফল্টরূপে 500।
একটি বাস্তব টাইমলাইনের জন্য, অটোপ্লে সম্পর্কে দুবার চিন্তা করুন। তারিখগুলির একটি অর্ডার আছে, এবং একটি কার্ড যা কেউ পড়ার সময় দূরে সরে যায় তা বিরক্তিকর। হোভারে বিরতি সহ অটোপ্লে একটি ন্যায্য মধ্যম স্থল।
ধাপ 6: তীর, পয়েন্ট এবং কার্ড স্টাইল করুন
স্টাইল ট্যাবে স্যুইচ করুন। এটিতে দশটি বিভাগ রয়েছে: ক্যারোজেল আইটেম, লেআউট, ছবি, পোস্ট, কার্ড, তীর, তারিখ, লাইন, পয়েন্ট এবং নেভিগেশন।
- কার্ড: প্যাডিং, সীমানা ব্যাসার্ধ, শিরোনাম এবং বিষয়বস্তুর রঙ, প্লাস ফোকাসড কার্ডের জন্য একটি পৃথক চেহারা।
- তারিখ: প্রতিটি পয়েন্টের উপরে তারিখ বা লেবেলের টাইপোগ্রাফি এবং রঙ।
- লাইন: ট্র্যাকের রঙ এবং বেধ।
- পয়েন্ট: আকার এবং রঙ সহ একটি সাধারণ বিন্দু, একটি আইকন বা একটি চিত্র।
- নেভিগেশন: তীর, বিন্দু এবং স্ক্রলবারের জন্য রঙ এবং আকার।
পৃষ্ঠাটি প্রকাশ করুন এবং এটি একটি ফোনে পরীক্ষা করুন। প্রতি সারিতে কার্ডগুলি ছোট স্ক্রিনে ড্রপ হয়, তাই পাঠ্যটি এখনও ফিট করে কিনা তা পরীক্ষা করুন।
পাশাপাশি উল্লম্ব বিন্যাস চান? দ্য এলিমেন্টর টাইমলাইন উইজেট পৃষ্ঠা প্রতিটি লেআউট, প্রান্তিককরণ এবং শৈলী বিকল্প এক জায়গায় তালিকাভুক্ত করে।
ভিডিও টিউটোরিয়াল
এই ভিডিওটি একটি খালি পৃষ্ঠা থেকে একটি টাইমলাইন তৈরি করে এবং এটিকে 3:44 এ অনুভূমিক ক্যারোসেলে স্যুইচ করে৷।
চারটি জিনিস যা ভুল হয়ে যায়
একটি অনুভূমিক টাইমলাইনের সাথে বেশিরভাগ সমস্যা এটিকে উল্লম্বের মতো আচরণ করা থেকে আসে।
- অনেক আইটেম। গত আট বা তার বেশি, দর্শকরা ক্লিক করা বন্ধ করে দেয়। একটি উল্লম্ব টাইমলাইন ব্যবহার করুন বা বছরের মধ্যে গল্পটি ভাগ করুন।
- অসম কার্ড উচ্চতা। একটি দীর্ঘ বর্ণনা সারি প্রসারিত। টেক্সট ট্রিম করুন বা ক্যারোজেল সেটিংসে অটো হাইট চালু করুন।
- প্রথম কার্ডের উপরে তীর। যদি তীরগুলি বিষয়বস্তুর উপরে বসে থাকে, তাহলে নেভিগেশন বিভাগে অবস্থান পরিবর্তন করুন।
- ব্লগ পোস্ট প্রত্যাশিত. পোস্ট টাইমলাইন টাইপ উল্লম্ব। একটি সারিতে পোস্টের জন্য, ব্যবহার করুন ব্লগ উইজেট ক্যারোজেল মোডে।
আরও পড়ুন: 20 এলিমেন্টর স্লাইডার টেমপ্লেট, যার মধ্যে একটি টাইমলাইন স্লাইডার ডিজাইন রয়েছে।
প্রায়শই জিজ্ঞাসিত প্রশ্নাবলী
আমি কি Elementor Pro ছাড়া Elementor এ একটি অনুভূমিক টাইমলাইন তৈরি করতে পারি?
হ্যাঁ। Elementor Pro একটি টাইমলাইন উইজেটও অন্তর্ভুক্ত করে না, তাই Pro এখানে কোন পার্থক্য করে না। একটি অ্যাডন থেকে একটি টাইমলাইন উইজেট যোগ করুন যেমন মাস্টার অ্যাডনস, টাইমলাইন স্টাইলকে অনুভূমিক টাইমলাইনে সেট করুন এবং আইটেমগুলি একটি ক্যারোজেল হয়ে যায়।
আমি কিভাবে এলিমেন্টরের একটি অনুভূমিক টাইমলাইনে তীর যোগ করব?
বিষয়বস্তু ট্যাবে নেভিগেশন বিভাগটি খুলুন এবং তীর এবং বিন্দু, তীর এবং ভগ্নাংশ বা তীর নির্বাচন করুন। তারপরে আপনি তীরের অবস্থান সেট করতে পারেন এবং একই বিভাগ থেকে পরবর্তী এবং পূর্ববর্তী আইকনগুলি প্রতিস্থাপন করতে পারেন।
একটি অনুভূমিক টাইমলাইন অটোপ্লে করতে পারেন?
হ্যাঁ। ক্যারোজেল সেটিংসের অধীনে অটোপ্লে চালু করুন এবং মিলিসেকেন্ডে অটোপ্লে গতি সেট করুন। ডিফল্ট হল 5000, যা প্রতি স্লাইডে পাঁচ সেকেন্ড। একজন দর্শক পড়ার সময় হোভারে বিরতি এটি বন্ধ করে দেয়।
একটি অনুভূমিক সময়রেখা প্রতিক্রিয়াশীল?
হ্যাঁ। এটি একটি ক্যারোজেল, তাই এটি ট্যাবলেট এবং ফোনে কম কার্ড দেখায় এবং দর্শকরা সরানোর জন্য সোয়াইপ করে। স্ক্রলে স্লাইডের প্রতি ডিভাইসে আলাদা মান রয়েছে।
আমি কি একটি অনুভূমিক টাইমলাইনে ব্লগ পোস্ট দেখাতে পারি?
পোস্ট টাইমলাইন টাইপের সাথে নয়, যা শুধুমাত্র উল্লম্ব। কাস্টম টাইমলাইন আইটেম হিসাবে হাতে পোস্ট যোগ করুন, অথবা একটি পোস্ট ক্যারোজেল ব্যবহার করুন।
চূড়ান্ত চিন্তা
একটি এলিমেন্টর অনুভূমিক টাইমলাইন একটি সেটিং এবং দুটি বিভাগে নেমে আসে: টাইমলাইন স্টাইল অনুভূমিক টাইমলাইনে সেট করা হয়, তারপরে এর ছয়টি বিকল্প সহ নেভিগেশন এবং অটোপ্লে, লুপ এবং গতির জন্য ক্যারোজেল সেটিংস। এটি তিন থেকে আটটি ছোট কার্ডে রাখুন এবং একটি ফোনে পরীক্ষা করুন।
দ্য টাইমলাইন উইজেট পৃষ্ঠা উভয় লেআউটের লাইভ ডেমো রয়েছে, একটি সহ অনুভূমিক রোডম্যাপ ডেমো.
সম্পর্কিত পড়া
2 প্রতিক্রিয়া
যে বিন্দুটি অনুভূমিক বিন্যাস শুধুমাত্র কাস্টম টাইমলাইন আইটেমগুলির সাথে কাজ করে, পোস্ট টাইমলাইন নয়, মিস করা সহজ এবং একটি বিল্ড দেরিতে ভাঙবে৷ টাইমলাইন স্টাইল স্যুইচ করার আগে, নিশ্চিত করুন যে প্রতিটি আইটেম একটি কাস্টম, যেহেতু ব্লগ-পোস্ট-চালিত টাইমলাইনগুলি উল্লম্ব থাকে৷ একটি ব্যবহারিক পরিবর্তন: তীর এবং বিন্দুগুলিতে নেভিগেশন সেট করুন, তারপর একটি সংকীর্ণ ফোন প্রস্থে পরীক্ষা করুন, কারণ ক্যারোজেল তীরগুলি কার্ডগুলিকে ভিড় করতে পারে এবং বিন্দুগুলি পাঠকদের জন্য সোয়াইপিংকে আরও পরিষ্কার করে তোলে৷।
এই সহায়ক টিপস শেয়ার করার জন্য আপনাকে ধন্যবাদ! the আপনি একেবারে সঠিক যে টাইমলাইন আইটেমের ধরন পরীক্ষা করা এবং ছোট স্ক্রিনে লেআউট পরীক্ষা করা অপ্রত্যাশিত সমস্যাগুলি এড়াতে সাহায্য করতে পারে। আমরা আপনাকে এটি নির্দেশ করার এবং অন্যান্য মাস্টার অ্যাডঅন ব্যবহারকারীদের আরও ভাল, আরও প্রতিক্রিয়াশীল টাইমলাইন তৈরি করতে সহায়তা করার প্রশংসা করি। আমাদের সম্প্রদায়ের অংশ হওয়ার জন্য ধন্যবাদ!