এলিমেন্টর গ্রিড লাইন ওভারলে (প্রো): সারিবদ্ধ লেআউটের জন্য একটি ডিজাইন গ্রিড

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

Enable on সহ গ্রিড লাইন প্যানেল এবং এলিমেন্টর এডিটরের পাশে একটি স্বচ্ছ ধূসর গ্রিড কালার পিকার একটি কলাম ওভারলে দেখাচ্ছে

এলিমেন্টরে গ্রিড লাইন কিভাবে ব্যবহার করবেন

গ্রিড লাইন হল একটি প্রতি-পৃষ্ঠা সেটিং, তাই আপনি এটিকে শুধুমাত্র যেখানে প্রয়োজন সেখানেই চালু করেন। এটা দেখ গ্রিড লাইন এক্সটেনশন ডক্স.

  1. মাস্টার অ্যাডনস প্রো সক্রিয় সহ, যান মাস্টার অ্যাডঅন > এক্সটেনশন এবং সুইচ অন গ্রিড লাইন.
  2. Elementor এ একটি পৃষ্ঠা খুলুন এবং ক্লিক করুন পৃষ্ঠা সেটিংস উপরের বারে আইকন।
  3. উপর সেটিংস ট্যাব, প্রসারিত করুন গ্রিড লাইন এবং সেট সক্ষম করা চালু।
  4. সেট কলাম, সর্বোচ্চ প্রস্থ এবং নর্দমা আপনার নকশা মেলে, এবং একটি যোগ করুন অফসেট যদি আপনার লেআউটের সাইড মার্জিন থাকে।
  5. সেই স্ক্রিনের মান সেট করতে ট্যাবলেট এবং মোবাইল ভিউতে স্যুইচ করুন।
  6. কলামগুলির বিপরীতে আপনার বিভাগ এবং উইজেটগুলি লাইন আপ করুন। প্রকাশিত পৃষ্ঠায় গ্রিড প্রদর্শিত হয় না।
এলিমেন্টর পোস্ট সেটিংসে গ্রিড লাইন সেটিংস কলাম, সর্বোচ্চ প্রস্থ, অফসেট, নর্দমা এবং একটি হালকা কলাম ওভারলে সহ একটি পৃষ্ঠার পাশে z-সূচক

কলাম, নর্দমা, প্রস্থ এবং অফসেট

পৃষ্ঠা সেটিংসে গ্রিড লাইন বিভাগে একটি আছে সক্ষম করা সুইচ, গ্রিডের রঙ (ডিফল্টরূপে একটি হালকা স্বচ্ছ ধূসর), কলাম 1 থেকে 12 পর্যন্ত, সর্বোচ্চ প্রস্থ, অফসেট, নর্দমা এবং জেড-সূচক। কলাম, সর্বোচ্চ প্রস্থ, অফসেট এবং গটার ডেস্কটপ, ট্যাবলেট এবং মোবাইলে বিভিন্ন মান নিতে পারে।

  • ডিফল্ট: 12টি কলাম, 1140px সর্বাধিক প্রস্থ এবং ডেস্কটপে একটি 15px নর্দমা, ট্যাবলেটে 1025px এবং 10px, মোবাইলে 768px এবং 8px৷।
  • আপনার থিম মেলে: আপনার সাইটের বিষয়বস্তুর প্রস্থে সর্বোচ্চ প্রস্থ সেট করুন যাতে কলামগুলি আসল লেআউটের সাথে সারিবদ্ধ হয়।
  • দৃশ্যমানতা: স্বচ্ছতার সাথে একটি রঙ চয়ন করুন যাতে আপনার সামগ্রী পাঠযোগ্য থাকে এবং Z-সূচক 999 এ রাখুন যাতে গ্রিডটি ডিজাইনের উপরে বসে।

এলিমেন্টরে গ্রিডের বিপরীতে একটি লেআউট পরীক্ষা করার উপায়

Elementor এর নিজস্ব কোন ডিজাইন গ্রিড ওভারলে নেই। এই স্বাভাবিক বিকল্প।

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

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

অন্যান্য সম্পাদক সাহায্যকারী: কোন উপাদান (বিনামূল্যে) এবং পজিশনিং (বিনামূল্যে)।

গ্রিড লাইনের জন্য প্রায়শই জিজ্ঞাসিত প্রশ্ন

গ্রিড লাইন সম্পর্কে ব্যবহারকারীদের সবচেয়ে বেশি জিজ্ঞাসিত প্রশ্নগুলি জানুন এবং এক জায়গায় উত্তরগুলি খুঁজুন৷।
গ্রিড কি প্রভাবিত করে কিভাবে আমার সাইট সামনের প্রান্তে দেখায়?

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

নর্দমা হল কলামের মধ্যবর্তী স্থান। অফসেট হল স্ক্রিনের প্রান্ত এবং যেখানে গ্রিড শুরু হয় তার মধ্যবর্তী স্থান। ম্যাক্স প্রস্থের সাথে একসাথে তারা আপনাকে আপনার থিমের বিষয়বস্তুর প্রস্থ এবং কলামের ব্যবধান অনুলিপি করতে দেয়।

আমি কি এলিমেন্টরের নিজস্ব ফ্লেক্সবক্স কন্টেইনার সিস্টেমের সাথে এটি ব্যবহার করতে পারি?

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

নং গ্রিড লাইন মাস্টার অ্যাডনস প্রো এর অংশ।

ট্রেন্ডিং এলিমেন্টর উইজেট এবং এক্সটেনশন

কম সময়ে অত্যাধুনিক ওয়েবসাইট তৈরি করুন।

এলিমেন্টরের জন্য মাস্টার অ্যাডনস গ্লাসমরফিজম এক্সটেনশন: ব্লার ভ্যালু কন্ট্রোল সহ ফ্রস্টেড গ্লাস কার্ড 20px এ সেট করা হয়েছে

গ্লাসমরফিজম

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

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

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

নিদর্শন

হোম 70+ ফ্রি এলিমেন্টর ব্যাকগ্রাউন্ড প্যাটার্ন প্যাটার্নস হল একটি ফ্রি মাস্টার অ্যাডঅন এক্সটেনশন যা যোগ করে।।।
বিস্তারিত দেখুন
এলিমেন্টরের জন্য মাস্টার অ্যাডঅন পোস্ট/পেজ ডুপ্লিকেটর এক্সটেনশন: ওয়ার্ডপ্রেস পেজ লিস্টে এমএ ডুপ্লিকেটর সারি লিঙ্ক একটি ল্যান্ডিং পেজ তৈরি করে - [ডুপ্লিকেটেড #128] ড্রাফ্ট

পোস্ট/পেজ ডুপ্লিকেটর

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

রিডিং প্রোগ্রেস বার

হোম ওয়ার্ডপ্রেসে একটি রিডিং প্রোগ্রেস বার যোগ করুন (এলিমেন্টর) রিডিং প্রোগ্রেস বার একটি বিনামূল্যে।।।
বিস্তারিত দেখুন