এলিমেন্টারের সাথে কীভাবে শিরোনাম এবং পাদচরণ ব্যবহার করবেন

একটি ওয়েবসাইটের শিরোনাম এবং ফুটার অপরিহার্য উপাদান। বেশিরভাগ ক্ষেত্রে, শিরোলেখ নেভিগেশন লিঙ্কগুলি সরবরাহ করে যা একটি ওয়েবসাইটের বিভিন্ন অংশে নেভিগেট করা সহজ করে। অন্যদিকে, ফুটার গুরুত্বপূর্ণ তথ্য যে ওয়েবসাইটের দর্শক যেমন ব্যবসা প্রতিষ্ঠানের ঠিকানা বা যোগাযোগের তথ্য হিসেবে প্রয়োজন হতে পারে, কয়েক প্রাক্তন উল্লেখ রয়েছে amp les।

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

এই টিউটোরিয়ালটি আমাদের শেখাবে কিভাবে ওয়েবসাইট হেডার এবং ফুটার তৈরি করতে হয়। এলিমেন্টর প্রো ব্যবহার করা হবে (যেহেতু এলিমেন্টরের মৌলিক সংস্করণে এই উপাদানগুলি তৈরি করার জন্য সবচেয়ে গুরুত্বপূর্ণ বৈশিষ্ট্যগুলি অন্তর্ভুক্ত নয়)। তাই Elementor Pro ডাউনলোড করুন এবং নিশ্চিত করুন যে এটি চালু আছে।

কেন আপনি আপনার পৃষ্ঠা নির্মাতা হিসাবে Elementor নির্বাচন করা উচিত?

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

এলিমেন্টর হল একটি ভিজ্যুয়াল পৃষ্ঠা নির্মাতা যা ব্যবহারকারীদের মোড স্যুইচ না করে তাদের পৃষ্ঠাগুলি কীভাবে প্রদর্শিত হয় তা দেখতে দেয়৷

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

এলিমেন্টরের কিছু গুরুত্বপূর্ণ দিক নিচে দেওয়া হল যা এটিকে সার্থক করে তোলে:

  • ড্র্যাগ অ্যান্ড ড্রপ কার্যকারিতা সমর্থিত।
  • এটিতে প্রচুর সংখ্যক টেমপ্লেট রয়েছে।
  • সব মিলিয়ে 90টির বেশি উইজেট রয়েছে।
  • প্রতিক্রিয়াশীল সমর্থনের জন্য কোন কোডিং এর প্রয়োজন নেই।
  • পুনরায় করুন এবং পূর্বাবস্থায় ফেরানোর বিকল্পগুলি উপলব্ধ।
  • অটোসেভ উপলব্ধ।

এটি সাহায্য করবে যদি আপনি একটি অনন্য শিরোনাম তৈরি করার আগে আপনার পছন্দসই শিরোনাম এবং ফুটার বিভাগের সাধারণ বিন্যাস সম্পর্কে সিদ্ধান্ত নেন। প্রি-মেড হেডার সেকশন লেআউটের দিকে তাকিয়ে আপনাকে অনেক পছন্দ প্রদান করতে পারে।

আপনি বিভিন্ন হেডার বিভাগ থেকে চয়ন করতে পারেন; সবচেয়ে সাধারণ এবং আধুনিক-সুদর্শন হেডারে বাঁদিকের কোণায় একটি সাইট লোগো, মাঝখানে একটি নেভিগেশন বার এবং ডানদিকে একটি অনুসন্ধান বার বিভাগ রয়েছে৷

অফুরন্ত সম্ভাবনা আছে, এবং আপনি যে কোনো লেআউট তৈরি করতে পারেন।

আমি 7 নং প্রি-মেড হেডার টেমপ্লেট বেছে নিয়েছি; এটি একটি ওয়ার্ডপ্রেস ওয়েবসাইটে একটি শিরোনাম ব্যবহার করার জন্য সবচেয়ে সাধারণ এবং সহজ পদ্ধতি। টেমপ্লেট > হেডার > সার্চ টেমপ্লেট > কপি করা হেডারের নাম পেস্ট করুন ।

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

এই পার্টি শুরু করা যাক.

একটি হেডার কি এবং এটি কি করে?

আপনার ওয়েবপৃষ্ঠার উপরের অংশটিকে "ওয়েবসাইট হেডার" বলা হয়। শিরোনাম সাধারণত আপনার সমগ্র ওয়েবসাইট জুড়ে একই হয়. যাইহোক, কিছু ওয়েবসাইট সাইটের বিভিন্ন অংশের জন্য বিভিন্ন শিরোনাম ব্যবহার করে।

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

শিরোনামটি আপনার কোম্পানির ব্র্যান্ড পরিচয়ের প্রচারেও সহায়তা করতে পারে।

আমি কোম্পানির লোগো, ফন্ট, রং এবং সামগ্রিক ব্র্যান্ড ভাষার মতো বৈশিষ্ট্য ব্যবহার করছি।

সাইট নেভিগেশন, সাইট অনুসন্ধান, একটি শপিং কার্ট (বিক্রয় সাইটের জন্য), কল টু অ্যাকশন (CTA) বোতাম এবং অন্যান্য বৈশিষ্ট্য যা ব্যবহারকারীর অভিজ্ঞতা উন্নত করে এবং রূপান্তর হার বাড়ায় সবই হেডারে পাওয়া যায়।

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

পাদচরণগুলিকে প্রায়শই উপেক্ষা করা হয়, যা সম্ভাবনার অপচয়, কারণ সেগুলি সাইটের প্রতিটি পৃষ্ঠায় প্রদর্শিত হয়৷ তারা হেডারের জন্য সমানভাবে গুরুত্বপূর্ণ।

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

কিভাবে একটি শিরোনাম করা

আমরা এই বিভাগে একটি কাস্টমাইজড হেডার তৈরি করতে যাচ্ছি। চিন্তা করবেন না যদি এটি ভীতিজনক মনে হয়; আমরা স্ক্র্যাচ থেকে শুরু করব না। পরিবর্তে, আমরা Elementor Pro এর টেমপ্লেটগুলি ব্যবহার করব, যা Elementor এর ডিজাইন টিম দ্বারা ডিজাইন করা হয়েছে।

একটি হেডার টেমপ্লেট ডেভেলপ করা হচ্ছে

ওয়ার্ডপ্রেস অ্যাডমিন প্যানেলে, টেমপ্লেটের উপর হোভার করুন এবং আমাদের হেডার তৈরি করতে Add New-এ ক্লিক করুন

আপনি রাউট করা হয়ে গেলে একটি মডেল উইন্ডো পপ আপ হবে। ড্রপডাউন মেনু থেকে শিরোনাম নির্বাচন করুন টেমপ্লেট তৈরি :

একটি টেমপ্লেট তৈরি করুন

এটি এলিমেন্টর সম্পাদক চালু করবে। এর পরে, আপনাকে টেমপ্লেটগুলির একটি তালিকা উপস্থাপন করা হবে যা থেকে চয়ন করতে হবে৷ তাই আপনার কাছে আবেদন করে এমন একটি বেছে নিন:

একবার আপনি একটি টেমপ্লেট বাছাই করার পরে এটি এলিমেন্টর সম্পাদনা বিভাগের উপরে প্রদর্শিত হবে:

একটি লোগো তৈরি করা: প্রথম ধাপ হল একটি লোগো তৈরি করা। সাইটের লাইভ এডিটরে লোগো সেট করুন এটি হেডারে রাখতে। সাইট আইডেন্টিটিতে ক্লিক করে একটি লোগো বেছে নিন।

একবার আপনি একটি লোগোর বিষয়ে সিদ্ধান্ত নিলে, প্রকাশ

আপনি যদি Elementor ইন্টারফেস রিফ্রেশ করেন তাহলে আপনার সাইটের লোগো এখন হেডারে থাকা উচিত:

এর পরে, আপনি যে কোনও পরিবর্তন করতে পারেন।

হেডার মেনুতে পরিবর্তন করা

আমাদের যা করা উচিত তা হল মেনু পরিবর্তন করা। আপনি যদি একটি মেনু তৈরি করে থাকেন, তাহলে টেমপ্লেট স্বয়ংক্রিয়ভাবে এটিকে অন্তর্ভুক্ত করবে:

এখানে আমাদের মেনু গঠন, যা আপনি হেডার টেমপ্লেটে প্রতিফলিত দেখতে পারেন:

আপনার যদি একাধিক মেনু থাকে তবে আপনি প্রয়োজনে বিষয়বস্তু আপডেট করতে পারেন।

আপনি অন্য যেকোনো উইজেটের মতোই এর বৈশিষ্ট্য সম্পাদনা করতে পারেন।

যদি আমাদের আরও আইটেম যোগ করতে হয়, আমরা আমাদের শিরোলেখতে আরও বিভাগ যোগ করতে পারি:

একটি হেডার এবং কিছু সোশ্যাল মিডিয়া আইকন যোগ করে শুরু করা যাক:

এর পরে, আপনি আপনার পছন্দ মতো পরিবর্তন করতে পারেন। এখানে আমাদের সম্পাদনা কিভাবে পরিণত হয়েছে:

হেডার পাবলিকেশন

একবার আপনি এটি পরিবর্তন করা শেষ করলে আপনি এখন শিরোনামটি প্রকাশ করতে পারেন৷ amp আমাদের সম্পূর্ণ সাইটে হেডার ব্যবহার করব শর্ত যোগ করার পরে আমরা সেই পছন্দটি নির্বাচন করব

এবং এখানে একটি প্রাক্তন এর amp আমাদের লাইভ সাইট থেকে একটি পৃষ্ঠার Le:

একটি পাদচরণ তৈরির প্রক্রিয়াটি একটি শিরোনাম নির্মাণের মতোই মোটামুটি অনুরূপ। একটি তৈরি করতে, এই মত একটি নতুন ফুটার টেমপ্লেট তৈরি করুন:

তারপর একটি টেমপ্লেট সিদ্ধান্ত. ফুটার বিভিন্ন আকার এবং আকারে আসে। কিছু দৃঢ় তথ্য অন্তর্ভুক্ত, অন্যদের যোগাযোগ ফর্ম আছে. আপনার প্রয়োজনীয়তার জন্য উপযুক্ত একটি টেমপ্লেট নির্বাচন করুন।

আমাদের ওয়েবসাইটের জন্য আমরা যে টেমপ্লেটটি বেছে নিয়েছি তা নিম্নরূপ:

আপনি সম্পাদনা শুরু করার সাথে সাথে আপনি শিরোনামটি দেখতে পাবেন (যদি আপনি শর্ত সেট করেন যে এটি সমস্ত পৃষ্ঠায় প্রদর্শিত হবে)।

প্রয়োজন অনুযায়ী ফুটার পরিবর্তন করুন; এইভাবে আমাদের পুনর্বিবেচনা দেখায়:

ফুটারটি শেষ হওয়ার পরে প্রকাশ করুন:

সমাপ্ত পণ্য

এখানে সমাপ্ত ফলাফল দেখায় কিভাবে. হেডার এবং ফুটার উভয়ই এখন আমাদের ওয়েবসাইটে ব্যবহার করা হয়:

এটি সবচেয়ে গুরুত্বপূর্ণ পর্যায়, এবং আপনাকে অবশ্যই নিশ্চিত করতে হবে যে আপনার শিরোনাম এবং ফুটার বিভাগগুলি প্রতিক্রিয়াশীল। যেহেতু একটি পূর্ণ-প্রস্থ মেনু সাধারণত মোবাইলের দৃশ্যের সাথে খাপ খায় না, তাই আপনাকে অবশ্যই জানতে হবে যে আপনার ডিজাইনটি মোবাইলের স্ক্রিনে কীভাবে প্রদর্শিত হবে। Elementor সাইডবার বিভাগের নীচে প্রতিক্রিয়াশীল সুইচগুলি মোবাইল এবং ট্যাব সংস্করণগুলি পরিবর্তন করতে পারে৷

আপনি বিভিন্ন উপায়ে আপনার হেডার এবং ফুটারের প্রতিক্রিয়াশীলতা পরীক্ষা করতে পারেন। উদা amp le, আপনি Browserstack, CrossBrowser টেস্টিং, এবং Google Resizer মতো সরঞ্জামগুলি ব্যবহার তা নিশ্চিত করার জন্য আপনার ওয়েব পেজ সম্ভব প্রতিক্রিয়াশীল হিসাবে পারবেন না। আপনি বিভিন্ন ডিভাইসের সাথে পরীক্ষা করে নিজেও এটি করতে পারেন।

একটি বন্ধ জিনিস আনা

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

একটি মন্তব্য ত্যাগ করুন

আপনার ইমেইল ঠিকানা প্রচার করা হবে না. প্রয়োজনীয় ক্ষেত্রগুলি চিহ্নিত করা হয়েছে *