মঙ্গলবার,  সকাল ১০:২৪  ♦  ১৯শে মার্চ, ২০২৪ ইং, ৫ই চৈত্র, ১৪৩০ বঙ্গাব্দ ( বসন্তকাল )
মঙ্গলবার,  সকাল ১০:২৪  ♦  ১৯শে মার্চ, ২০২৪ ইং, ৫ই চৈত্র, ১৪৩০ বঙ্গাব্দ ( বসন্তকাল ), ৯ই রমযান, ১৪৪৫ হিজরী  ♦
ওয়ার্ডপ্রেস টিপস

শেয়ার

iftekharul
  • 44 টি টিপস
About Author
(পদবী - ধ্রুপদী)

আমি ইফতেখার, TiPS4BLOG এর সম্পাদক এবং লেখক। আপনাদের দারুন আর মানসম্মত টিপস নিয়মিত উপহার দেওয়াই আমার লক্ষ্য।

৮ বছর ৬ মাস ১৮ দিন আগে
iPhone SE 2

iPhone SE 2 লঞ্চ করতে চলেছে Apple, মধ্যবিত্তের সাধ্যের মধ্যে

অক্টো. 5, 2019 9:27:35 অপরাহ্ন ( ৪ বছর ৫ মাস ১৬ দিন আগে )

আপনি সম্প্রতিকালে কোন মতামত প্রদান করেন নাই।

404 Error Page
ব্লগার ৮০২৬ বার

কিভাবে ব্লগার ব্লগে কাস্টম ৪০৪ এরর পেজ স্টাইল করবেন

অ-
অ+

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

বিজ্ঞাপন

আমরা জানি যে ব্লগার ২০১২ সাল হতে প্রতিনিয়ত অনেক নতুন নতুন ফিচার নিয়ে আসছে। বর্তমানে ব্লগার ব্লগ আগের তুলনায় অনেক বেশি উন্নত। এই সমস্ত নতুন ফিচারের মধ্যে Errors and redirections একটি। আপনি এই ফিচারটি Settings >> Search preferences এর অধীনে পাবেন, যেখানে আপনি ৪০৪ এরর পেজ সেট করতে পারবেন।

আজকের টিপসে আমি দেখাবো কিভাবে একটি তথ্যবহুল ৪০৪ এরর পেজ প্রদর্শন করতে হয় ব্লগার ব্লগে। সুতরাং, যারা ব্লগার ব্লগ দিয়ে তাদের ব্লগ পরিচালনা করে থাকেন তাদের জন্য আশা করি এই টিপসটি অনেক উপকারে আসবে।

৪০৪ এরর পেজ কি?

৪০৪ এরর একটি HTTP স্ট্যান্ডার্ড স্ট্যাটাস কোড, যার অর্থ পাওয়া যায়নি। পাওয়া যায়নি এরর সার্ভার পাওয়া যায়নি এররের মতো না। এটা নির্দেশ করে যে, যখন কোন ক্লায়েন্ট সার্ভারের সাথে যোগাযোগের চেষ্টা করে, হয় সার্ভার অনুরোধটি খুঁজে পায় না অথবা অনুরোধটি সম্পন্ন করার জন্য কনফিগার করা হয়নি। ফলশ্রুতিতে, যদি কেউ কোন একটি পেজের জন্য অনুরোধ করে, যেটা আসলে নেই, ৪০৪ এরর পেজ প্রদর্শিত হয়, যেখানে বলা হয় পেজটি খুঁজে পাওয়া যায়নি। এর কারন হতে পারে, হয়তো পেজটি মুছে ফেলা হয়েছে, যেটা আর বিদ্যমান নেই অথবা URL এ কোন ভুল হয়েছে। যেহেতু কোন পেজ প্রদর্শনের জন্য খুঁজে পাওয়া যায় না, তাই উত্তরে ওয়েব সার্ভার একটা ৪০৪ এরর পেজ পাঠায়।

ব্লগারে ৪০৪ এরর পেজ

ডিফল্টভাবে, ব্লগার নিচের ছবির মতো এরর পেজ ম্যাসেজ দিয়ে থাকে।

blogger default 404 page

আপনি চাইলে আপনার পছন্দ অনুযায়ী ম্যাসেজ দিতে পারেন, আবার এটাকে অনেক সুন্দর ভাবেও প্রদর্শন করতে পারেন যদি আপনি শুধুই ম্যাসেজের থেকে আরও বেশি কিছু চান। ম্যাসেজ পরিবর্তন করার জন্য Settings >> Search preferences >> Custom Page Not Found এ নেভিগেট করুন এবং তারপরে Edit বাটনে ক্লিক করুন। একটা টেক্সটএরিয়া বক্স ওপেন হবে, যেখানে এরর পেজ ম্যাসেজটি লিখতে হবে। তো দেরি না করে লিখে ফেলুন আপনার মনের মতো করে এরর পেজ ম্যাসেজ এবং লেখা শেষ হলে Save changes বাটনে ক্লিক করুন। ব্যাস! অর্ধেক কাজ হয়ে গেলো।

errors and redirections

এখন, ব্লগার নিচের ছবির মতো এরর পেজ ম্যাসেজ প্রদর্শন করবে। দেখুন, আপনি যেই ম্যাসেজটি লিখেছিলেন সেটাই প্রদর্শিত হচ্ছে।

custom error message

এরর পেজটি দেখার জন্য এড্রেস বারে টাইপ করুন আপনার ব্লগের ডোমেইন নাম এবং তারপর /৪০৪ (যেমন https://yourDomainName.com/404)। আপনি চাইলে অন্য যেকোনো সংখ্যা বা টেক্সট লিখতে পারেন, যা আপনার ব্লগ বা ওয়েবসাইটে বিদ্যমান নেই।

স্টাইল করুন ৪০৪ এরর পেজ

যদি আপনি পাঠকদের একটি সঠিক দিকনির্দেশনা দিতে চান যা শুধুই ম্যাসেজের থেকে আরও বেশি কিছু হবে, তাহলে নিচের পদক্ষেপগুলো অনুসরণ করে ৪০৪ এরর পেজটি স্টাইল করুনঃ

দিকনির্দেশনা

১)     Template পেজে যান এবং Edit HTML বাটনে ক্লিক করুন।

২)     এডিটর বক্সের ভিতরে ক্লিক করে কী-বোর্ডে Ctrl+F চেপে লিখুন </head> এবং তারপর এন্টার চাপুন। ঠিক </head> ট্যাগটির পূর্বে নিচের CSS কোডটি বসিয়ে দিন।

<b:if cond='data:blog.pageType == "error_page"'>
<style type='text/css'>
.status-msg-wrap {
font-size: 100%;
margin: none;
position: static;
width: 100%;
}
.status-msg-border {
display:none
}
.status-msg-body {
padding: none;
position: static;
text-align: inherit;
width: 100%;
z-index: auto;
}
.status-msg-wrap a {
padding: none;
text-decoration: inherit;
}
</style>
</b:if>

৩)     বসানো হয়ে গেলে Save template বাটনে ক্লিক করে টেম্পলেটটি সংরক্ষণ করুন।

এখন, ৪০৪ এরর পেজটি নিচের ছবির মতো প্রদর্শিত হবে।

custom error page after css

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

১)     প্রথমে Settings >> Search preferences >> Custom Page Not Found এ নেভিগেট করুন এবং তারপরে Edit বাটনে ক্লিক করুন।

২)     টেক্সটএরিয়া বক্সের মধ্যে নিচের কোডটি পেস্ট করুন।

<span style="font-size: 150px; color: #007193;"><strong>404</strong></span>
<span style="font-size: x-large;">Page Not Found!</span>
<h2><span style="color: #ff0000;">Oops! </span>Looks like we have made a mistake, the page you are looking for is not here.</h2>
<p>It seems something has gone wrong, the page you are looking for cannot be found in our database. May be, the page you are looking for either does not exist or there has been an error in the URL.</p>
<p><b>In the meantime</b></p>
<ol style="line-height: 20px;">
	<li>Try returning to the<a href="/"> homepage</a> or</li>
	<li>Check out the sidebar where you will be able to find some of my featured and popular articles and my lovely sponsors.</li>
	<li>You can also search something below:
		<form id="searchform" action="/search" method="get">
			<input style="width: 50%; padding: 2px;" type="text" name="q" value="Search" onfocus="if (this.value == &quot;Search&quot;) {this.value = &quot;&quot;}" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Search&quot;;}" />
			<input type="button" value="Search" />
		</form>
	</li>
	<li>You may also want to try looking through the archive, as you may just find something else to read instead.</li>
	<li>Lastly, If you feel you have reached this page as an error on my part,
please <a href="https://bangla.tips4blog.com/contact-us/">Contact</a> me.</li>
</ol>

৩)     এখানে আপনাকে একটা পরিবর্তন করতে হবে। যোগাযোগ করার জন্য যেই URL (https://bangla.tips4blog.com/contact-us/) টি দেওয়া আছে আপনার যোগাযোগ পেজের লিংকের সাথে সেটা প্রতিস্থাপন করুন।

এখন ফলাফল দেখার জন্য আপনার ব্লগের যেই পেজটি বিদ্যমান নেই সেটা পরিদর্শন করুন। উদাহরণস্বরূপ, আপনি https://YourDomain.com/404 পেজটি দেখতে পারেন। YourDomain.com এর জায়গায় আপনার ডোমেইনের নাম হবে। আমার মনে হয় পেজটি এখন আগের তুলনায় অনেক বেশি উন্নত হয়েছে। পেজটিতে এখন পাঠকদের জন্য একটি সঠিক দিকনির্দেশনা আছে যে তারা কি কি পদক্ষেপ নিতে পারে। এতে করে পাঠকেরা আর বিভ্রান্ত হবে না। উপরন্তু, তারা আপনার ব্লগের অন্যান্য টিপসগুলোর প্রতি আগ্রহী হবে।

এরর পেজের শিরোনাম পরিবর্তন করুন

ডিফল্টভাবে, ব্লগার এরর পেজের শিরোনাম হিসেবে আপনার ব্লগের শিরোনাম প্রদর্শন করে। আপনি চাইলে আপনার মতো করে শিরোনামটি পরিবর্তন করতে পারেন। এটা করার জন্য আবারও Template পেজে গিয়ে Edit HTML বাটনে ক্লিক করুন। নিচের কোডটি খুঁজে বের করুনঃ

<title>data:blog.pageTitle</title>

এখন, উপরের কোডটি নিচের কোড দ্বারা প্রতিস্থাপন করুনঃ

<!-- Start www.tips4blog.com: Changing the Blogger Title Tag &nbsp;-->
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<title><data:blog.pageTitle/></title>
<b:else/>
<b:if cond='data:blog.pageType == &quot;error_page&quot;'>
<title>Oops! Page Not Found</title>
<b:else/>
<title><data:blog.pageName/> ~ <data:blog.title/></title>
</b:if>
</b:if>
<!-- End www.tips4blog.com: Changing the Blogger Title Tag &nbsp;-->

ব্যাস! হয়ে গেলো। এরি মধ্যে আপনি কাস্টম ৪০৪ এরর পেজ ডিজাইন করে ফেলেছেন। ডিজাইনটি আরও সুন্দর করে তৈরি করার জন্য আপনি উপরের কোডগুলো নাড়াচাড়া করতে পারেন যদি আপনার প্রোগ্রামিং এর উপর জ্ঞান থাকে। আপনার দেখার সুবিধার্থে একটি DEMO দেওয়া হল।

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

Ads by T4B
বিজ্ঞাপন

নির্বাচিত টিপস মনোনয়ন

1

টিপসটি উপভোগ করেছেন?

এই টিপস এবং এরকম আরও টিপসের আপডেট পেতে হলে TiPS4BLOG নিউজলেটারে সাবস্ক্রাইব করতে ভুলবেন না!

আপনি আরো পছন্দ করতে পারেন

মতামত বন্ধ