هیچ چیز برای یک کاربر ناامیدکنندهتر از این نیست که به دنبال محتوایی جذاب باشد، اما با یک صفحه خالی یا پیام خطا مواجه شود. خطای 404 زمانی برای کاربران نمایش داده میشود که یک لینک تغییر کرده یا محتوای آن به کلی حذف شده باشد. اما این پایان ماجرا نیست؛ وجود خطای 404 بر سئو سایت تاثیر منفی دارد. پس باید راهی را انتخاب کنیم که مانع این کار شود.
آیا می خواهید قالب صفحه 404 خود را در وردپرس ارتقا دهید؟ تصمیم درستی گرفتهاید. بهبود صفحه پیش فرض 404 وردپرس می تواند به ایجاد تجربه کاربری بهتر، کاهش نرخ پرش و افزایش نمایش صفحات کمک کند. در این مقاله، ما به شما نشان می دهیم که چگونه قالب صفحه 404 خود را در وردپرس به صورت مرحله به مرحله سفارشی کنید و آن را از یک بنبست، به یک راهنما تبدیل کنید.
آیا می خواهید قالب صفحه 404 خود را در وردپرس ارتقا دهید؟
بهبود صفحه پیش فرض 404 وردپرس می تواند به ایجاد تجربه کاربری بهتر، کاهش نرخ پرش و افزایش نمایش صفحات کمک کند. در این مقاله، ما به شما نشان می دهیم که چگونه قالب صفحه 404 خود را در وردپرس به صورت مرحله به مرحله سفارشی کنید.
چرا باید قالب صفحه 404 را بهبود بخشید؟
اکثر بازدیدکنندگانی که صفحه 404 را مشاهده می کنند، وب سایت وردپرس شما را به سرعت ترک می کنند. این کار باعث افزایش نرخ پرش وب سایت شما می شود و تجربه کاربری ضعیفی ایجاد می کند و حتی می تواند بر رتبه بندی موتورهای جستجو شما نیز تأثیر منفی بگذارد.
با بهبود صفحه 404 وردپرس خود، می توانید بازدیدکنندگان را به پست های محبوب هدایت کنید، بازدید از صفحه را افزایش داده و نرخ خروج از سایت را کاهش دهید در نتیجه بازدیدکنندگان را به خوانندگان و مشتریان طولانی مدت خود تبدیل کنید.
وقتی بازدیدکننده ای در سایت شما باقی بماند احتمال بیشتری دارد که خرید کند، پست های بیشتری بخواند یا به لیست ایمیل شما بپیوندد.
از مهمترین تاثیرات بهبود قالب صفحه 404 این است که می تواند SEO وردپرس شما را بهبود ببخشد، بنابراین ترافیک بیشتری در موتورهای جستجو خواهید داشت.
توجه: ایجاد یک صفحه 404 سفارشی مهم است اما شما باید آدرس هایی که باعث ایجاد صفحه 404 برای بازدیدکنندگان می شود را پیگیری کنید و مسیرهای مناسب را برای بهبود رتبه بندی SEO تنظیم کنید.
با توجه به این موارد، به 2 روش بهبود قالب صفحه 404 در وردپرس می پردازیم. با ما همراه باشید.
روش 1. ایجاد صفحه 404 با المنتور
در این روش با استفاده از صفحه ساز المنتور صفحه 404 را به راحتی ایجاد می کنیم.
برای شروع وارد پیشخوان وردپرس شوید و پس از نصب افزونه ی المنتور و المنتور پرو از قسمت قالب ها » افزودن را انتخاب کنید و نوع قالب را تکی و از لیست کشویی نوع پست را “صفحه خطا 404” قرار دهید. سپس یک نام برای قالب بگذارید و ایجاد قالب را بزنید.
برای ویرایش تصاویر صفحه 404 مطابق این آموزش از نرم افزار فتوشاپ استفاده می کنیم. یک تصویر با رنگ بندی متفاوت را انتخاب می کنیم و با ابزارهای فتوشاپ هر تصویر را به 8 قسمت مساوی تقسیم کرده و ذخیره می کنیم.
برای این کار می توانید هم از ابزار Ruler به صورت دستی و هم از قسمت View > New Guide تقسیم بندی را انجام دهید. بعد از تقسیم تصویر از نوار ابزار سمت چپ ابزار Slice Tool را انتخاب کنید و بر روی Slice From Guide کلیک کنید. برای ذخیره سازی تصاویر
File > Save for web را بزنید.حالا که تصاویر آماده شده آن ها را در سایت خود آپلود کنید.
به قالبی که با عنوان صفحه 404 ایجاد کردید باز گردید و یک بخش 8 ستونه ایجاد کنید و از ابزارک های المنتور, ابزارک کنترل کاروسل را در ستون اول قرار دهید.
در تنظیمات این کنترل کاروسل نوع پوسته را “کاروسل” و نوع حرکت کاروسل را بر روی “مکعب” قرار دهید. از تب تنظیمات اضافی, صفحه بندی و فلش ها را غیرفعال کنید و پخش خودکار و چرخش بینهایت را در حالت فعال قرار دهید. از بخش استایل هم می توانید به دلخواه تغییرات مورد نظر خود را اعمال کنید.
بعد از اتمام تنظیمات کاروسل، آیتم های دیگری نیز به کاروسل اضافه کنید و تصویر آن را تصویر مشابهی که رنگ آن متفاوت است قرار دهید. کاروسل را کپی کرده و به ستون های دیگر پیست کنید و تصاویر را مطابق تصویر اصلی که قسمت بندی شده بود تغییر دهید.
همانطور که می بینید بین ابزارک های کاروسل فاصله هایی وجود دارد که می خواهیم این فاصله ها را از بین ببریم. بنابراین بر روی بخش یا سکشن کلیک کنید و از تب طرح بندی, بخش کشیده را فعال کنید و فاصله ستون ها را بر روی بدون فاصله قرار دهید تا تصاویر به یکدیگر بچسبند.
برای مشاهده ی ویدئوی این آموزش به آموزش ایجاد صفحه 404 با المنتور مراجعه کنید.
روش 2. با افزودن کد یک صفحه سفارشی 404 در وردپرس ایجاد کنید
در این روش با استفاده از کدهای php یک صفحه ی 404 ایجاد خواهیم کرد. این روش برای مبتدیان چندان مناسب نیست زیرا باید کد اضافه کنند و فایل های قالب وردپرس را تغییر دهند.
ابتدا باید یک فایل جدید در پوشه قالب وردپرس خود ایجاد کرده و نام آن را 404.php قرار دهید. اگر قالب شما از قبل دارای فایل 404.php است، آن فایل را ویرایش کنید.
برای ویرایش این فایل، باید با یک سرویس گیرنده FTP یا ابزار مدیریت فایل به حساب هاست وردپرس خود متصل شده و آن را ویرایش کنید. پس از اتصال به وب سایت خود، می توانید فایل 404.php خود را در پوشه قالب وردپرس مشاهده کنید.
توجه: قبل از سفارشی سازی قالب وردپرس خود، توصیه می کنیم از سایت وردپرس خود نسخه پشتیبان تهیه کنید.
در ادامه چند نمونه از مواردی که می تواند در صفحه 404 مورد استفاده قرار بگیرد را آموزش می دهیم.
نمایش محبوب ترین پست ها در صفحه 404
اولین کاری که باید انجام دهید این است که افزونه رایگان WordPress Popular Posts را نصب و فعال کنید. این یکی از بهترین افزونه های پست های محبوب وردپرس است.
پس از فعال سازی، باید این قطعه کد را به فایل 404.php, جایی که می خواهید پست های محبوب نمایش داده شود اضافه کنید.
<?php wpp_get_mostpopular(); ?>
نمایش بیشترین نظرات پست ها در صفحه 404
برای افزودن پست هایی که بیشترین نظرات را دارند، از همان افزونه ای که در بالا فعال کرده اید استفاده کنید. به سادگی کد زیر را در جایی که می خواهید پست ها با بیشترین نظرات را نمایش دهید اضافه کنید.
<?php wpp_get_mostpopular(“range=all&order_by=comments”); ?>
نمایش پست های اخیر در صفحه 404
روش های مختلفی برای نمایش پست های اخیر در وردپرس وجود دارد. ساده ترین راه این است که کد php زیر را در قالب 404 خود اضافه کنید تا پست های اخیر شما نمایش داده شود.
<?php wp_get_archives( array( ‘type’ => ‘postbypost’, ‘limit’ => 10, ‘format’ => ‘custom’, ‘before’ => ”, ‘after’ => ‘<br />’ ) ); ?>
نمایش پست های تصادفی در صفحه 404
اگر می خواهید یک لیست تصادفی از پست ها در وردپرس نمایش داده شود، می توانید با اضافه کردن کدی که در زیر قرار دارد یک لیست تصادفی از پست های سایت خود ایجاد کنید.
<ul>
<?php
$posts = get_posts(‘orderby=rand&numberposts=5’);
foreach($posts as $post) { ?>
<li><a href=”<?php the_permalink(); ?>” title=”<?php the_title(); ?>“><?php the_title(); ?></a>
</li>
<?php } ?>
</ul>
نمایش آرشیو ماهانه با فشرده سازی آرشیوها
اگر محتوای زیادی در وب سایت خود دارید، یک راه بسیار عالی برای سازماندهی این کار نمایش آرشیو ماهانه است. برای نمایش آرشیوهای ماهانه در صفحه 404 کافی است افزونه ی Compact Archives را نصب و فعال کنید.
پس از فعال شدن و راه اندازی افزونه، کافی است کد زیر را به فایل 404.php خود اضافه کنید؛
<p><strong>By Date</strong></p>
<ul>
<?php compact_archive($style=’block’); ?>
</ul>
هنگامی که کاربر وارد صفحه 404 شما می شود، آرشیو پست های فشرده شما را مشاهده می کند. در تصویر زیر نحوه نمایش آن در صفحه 404 ما نشان داده شده است.
نمونه قالب 404 برای وردپرس
در اینجا یک نمونه فایل 404.php بر اساس صفحه 404 قالب پیش فرض “بیست, بیست و یک” وردپرس قرار داده شده است؛
<?php
/**
* The template for displaying 404 pages (not found)
*
* @link https://codex.wordpress.org/Creating_an_Error_404_Page
*
* @package WordPress
* @subpackage Twenty_Twenty_One
* @since Twenty Twenty-One 1.0
*/
get_header();
?>
<header class=”page-header alignwide”>
<h1 class=”page-title”><?php esc_html_e( ‘Nothing here’, ‘twentytwentyone’ ); ?></h1>
</header><!– .page-header –>
<div class=”error-404 not-found default-max-width”>
<div class=”page-content”>
<p><?php esc_html_e( ‘It looks like nothing was found at this location. Maybe try a search?’, ‘twentytwentyone’ ); ?></p>
<?php get_search_form(); ?>
<h4>While you’re here, check out some of our popular content:</h4>
<div class=”col1″>
<div class=”col-header”>
<strong>Popular</strong>
</div>
<?php wpp_get_mostpopular(); ?>
</div>
<div class=”col2″>
<div class=”col-header”>
<strong>Comments</strong>
</div>
<?php wpp_get_mostpopular(“range=all&order_by=comments”); ?>
</div>
<div class=”col3″>
<div class=”col-header”>
<strong>Recent</strong>
</div>
<?php wp_get_archives( array( ‘type’ => ‘postbypost’, ‘limit’ => 5, ‘format’ => ‘custom’, ‘before’ => ”, ‘after’ => ‘<br />’ ) ); ?>
</div>
</div><!– .page-content –>
</div><!– .error-404 –>
<?php
get_footer();
این قالب 404 را با قالب پیش فرض در بیست, بیست و یک مقایسه کنید. متوجه خواهید شد که بلافاصله پس از فرم جستجو، کد سفارشی خود را برای نمایش پست های محبوب، بیشترین نظرات و پست های اخیر اضافه کرده ایم.
پس از آن CSS های سفارشی زیر را به قالب وردپرس اضافه کنید تا آن را به صورت ستون نمایش دهد؛
.col1, .col2, .col3 {
width:30%;
float:left;
padding:0px 10px 10px 10px;
margin:0px;
}
.col3:after{
clear:both;
}
.col-header {
background:#28303D;
color:#D1E3DD;
margin:0px;
padding:1px;
text-align:center;
}
این نتیجه نهایی پس از اضافه کردن کدهای سفارشی صفحه 404 بالا است.
سخن پایانی
امیدواریم این مقاله به شما در بهبود قالب صفحه 404 در وردپرس کمک کرده باشد. اگر مشکل یا سوالی در رابطه با این مقاله دارید از طریق دیدگاه های این بخش با ما در میان بگذارید.
