w3designw3design
  • صفحه اصلی
  • وبلاگ
  • خدمات ما
    • طراحی سایت
    • سئو و بهینه سازی سایت
    • کارت ویزیت آنلاین
    • پنل پیامکی
  • نمونه کارها
  • درباره ما
  • تماس با ما
Search
  • صفحه اصلی
  • وبلاگ
  • خدمات ما
    • طراحی سایت
    • سئو و بهینه سازی سایت
    • کارت ویزیت آنلاین
    • پنل پیامکی
  • نمونه کارها
  • درباره ما
  • تماس با ما
  • درباره ما
  • وبلاگ
نمایش مطالب مرتبط در وردپرس

نمایش مطالب مرتبط در وردپرس

writer32021-01-19T07:14:22+03:30
By writer3 طراحی سایت

نمایش مطالب مرتبط در وردپرس

نمایش مطالب مرتبط در وردپرس یکی از راهکارهای بسیار کارآمد برای افزایش بازدید سایت و کم کردن bounce rate سایت شماست. خب همان‌طور که در جریان هستید شما باید برای پیشرفت کسب‌وکار خود راهکارهایی را در پیش بگیرید. یکی از بهترین راهکارهایی که دائما به‌ تمامی مدیران سایت‌ها پیشنهاد می‌شود این است که ترفندی بکار بگیرند تا کاربر زمان بیشتری را در سایت سپری کند.

به‌ بیان‌دیگر شما باید اقداماتی در پیش بگیرید تا نرخ پرش یا همان bounce rate در سایتتان به حداقل برسد و کاربر بدون هیچ مشکلی در سایت شما به‌دنبال هدف خود باشد.

یکی از مواردی که بر روی این موضوع تاثیر بسزایی دارد نمایش مطالب مرتبط است، درواقع با نمایش این مطالب مرتبط کاربر مابقی مطالب سایت شما را هم مطالعه می‌کند و در نتیجه بازدیدکننده سایت شما را برای همیشه در خاطر نگه می‌دارد و مایل می‌شود بازهم به سایت شما مراجعه کند و یا سایت شما را به افراد دیگری معرفی کند.

شما برای نمایش مطالب مرتبط در وردپرس 2 راهکار دارید که می‌توانید هر یک از آن‌ها را با توجه به نیاز سایت و یا دلخواه خود انتخاب کنید. یکی از این روش‌ها استفاده از افزونه‌هایی است که برای این کار طراحی‌شده‌اند و روش دیگر استفاده از کد می‌باشد.

امروز قصد داریم نمایش مطالب مرتبط در وردپرس بدون افزونه را توضیح دهیم تا بتوانید با یک کد بسیار ساده، مطالب ارزشمند خودتان را به کاربر معرفی کنید.

نمایش مطالب مرتبط در وردپرس

 

افزودن تصویر شاخص به قالب وردپرس

ابتدا باید برای مطالب سایتتان تصویر شاخص مشخص کنید. برای این کار فایل functions.php قالب وردپرس خود را بازکنید و کد زیر را در آن کپی کنید.

add_theme_support( ‘post-thumbnails’ );
set_post_thumbnail_size( 260, 180, true );

اگر می‌خواهید سایز تصویرنمایشی در بخش مطالب مرتبط را تغییر دهید با تغییر 260 و 180 در کد بالا می‌توانید به ترتیب پهنا و ارتفاع تصاویر را تغییر دهید و آن را به هر سایز دلخواهی تبدیل کنید.

حالا که تصویر شاخص شما ساخته شد برای ساخت اتوماتیک تصویر شاخص از مطالب سایتتون افزونه auto post thumbnail فارسی را نصب و فعال کنید.

افزودن تصویر شاخص به قالب وردپرس

 

آموزش افزودن بخش مطالب مرتبط به قالب وردپرس

خب بعدازاینکه یک تصویر شاخص برای مطلب خود با سایز دلخواه درست کردید باید وارد فایل single.php شوید که این فایل single.php درواقع شامل کدهای صفحه ادامه مطلب سایت شما است.پس از اینکه وارد این فایل شدید باید دنبال کد php endwhile بگردید، بعدازاینکه این کد را پیدا کردید کد زیر را قبل از آن قرار دهید.

<div class=”relatedposts”>
<h3>مطالب مرتبط با این نوشته</h3>
<?php
$orig_post = $post;
global $post;
$tags = wp_get_post_tags($post->ID);

if ($tags) {
$tag_ids = array();
foreach($tags as $individual_tag) $tag_ids[] = $individual_tag->term_id;
$args=array(
‘tag__in’ => $tag_ids,
‘post__not_in’ => array($post->ID),
‘posts_per_page’=>4, // Number of related posts to display.
‘caller_get_posts’=>1
);

$my_query = new wp_query( $args );

while( $my_query->have_posts() ) {
$my_query->the_post();
?>

<div class=”relatedthumb”>
<a rel=”external” href=”<? the_permalink()?>”><?php the_post_thumbnail(array(260,180)); ?><br />
<?php the_title(); ?>
</a>
</div>

<? }
}
$post = $orig_post;
wp_reset_query();
?>
</div>

آموزش افزودن بخش مطالب مرتبط به قالب وردپرس

 

دقت کنید که در کد بالا دو عدد 180 و 260 وجود دارد که شما باید در این قسمت همان عددی را وارد کنید که در کد تصویر شاخص در فایل functions.php وارد کردید. به یاد داشته باشید که این اندازه باید دقیقاً مثل یکدیگر باشد.

توجه داشته باشید که با انجام کارهایی که در بالا به آن اشاره شد مطالب شما یک ظاهر کاملاً ساده‌ای خواهد داشت و شما باید مطالب خود را به یک شکل بسیار زیبا به‌نمایش در بیاورید. که این موضوع با استفاده از کدهای CSS امکان‌پذیر است.درواقع شما این امکان را دارید که جلوه ویژه‌ای به مطالب خود با استفاده از مدهای سی‌اس‌اس دلخواه خود بدهید.

حالا که بخش مطالب مرتبط به قالب سایت شما اضافه‌‌شده برای زیباتر شدن کار می‌‌توانید کد زیر را در فایل style.css قالب وردپرس خودتان قرار دهید.

.relatedposts {width: 640px; margin: 0 0 20px 0; float: left; font-size: 12px;}
.relatedposts h3 {font-size: 20px; margin: 0 0 5px 0; }
.relatedthumb {margin: 0 1px 0 1px; float: left; }
.relatedthumb img {margin: 0 0 3px 0; padding: 0;}
.relatedthumb a {color :#333; text-decoration: none; display:block; padding: 4px; width: 150px;}
.relatedthumb a:hover {background-color: #ddd; color: #000;}

 

به همین راحتی با چند خط کد زیبا و تمیز به‌راحتی شما صاحب بخش مطالب مرتبط در وردپرس شدید. از وردپرس لذت ببرید!

Share this post

Facebook Twitter LinkedIn Google + Email

Author

writer3

دیدگاهتان را بنویسید لغو پاسخ

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *


Related Posts

تفاوت رابط کاربری و تجربه کاربری

تفاوت رابط کاربری و تجربه کاربری

تفاوت رابط کاربری و تجربه کاربری (UI و UX) چیست؟ در جهان دیجیتال امروزی، خلاقیت و تکنیک در طراحی به... read more

تفاوت نوشته و برگه در وردپرس

تفاوت نوشته و برگه در وردپرس چیست؟

تفاوت نوشته و برگه در وردپرس بعد از اینکه اقدام به نصب وردپرس در هاست خودتان می کنید و قصد... read more

ساخت چایلد تم در وردپرس

ساخت چایلد تم در وردپرس

ساخت چایلد تم در وردپرس 🔻در این مقاله به معرفی دو راهکار خیلی ساده برای ساخت چایلد تم در وردپرس... read more

ساخت آواتار در وردپرس

ساخت آواتار در وردپرس

ساخت آواتار در وردپرس اگر توجه کرده باشید در سایت‌های وردپرسی قابلیت انتخاب و تغییر پروفایل وجود ندارد مگر اینکه... read more

جدول در وردپرس

آموزش ساخت جدول در وردپرس

ایجاد جدول با ویرایشگر وردپرس ساخت جدول در وردپرس با استفاده از ویرایشگر پیش فرض وردپرس بسیار آسان است،در این... read more

افزونه های فرم ساز وردپرس

افزونه های فرم ساز وردپرس

افزونه های فرم ساز وردپرس برای هر سایت وردپرسی لازم است که یک افزونه سازنده فرم داشته باشد. صرف نظر... read more

دامنه

دامنه چیست ؟

دامنه چیست ✅دامنه همان آدرسی هست که شما با وارد کردن آن در مرورگرتان وارد یک سایت می شوید مثلا:... read more

رابط کاربری در طراحی سایت

رابط کاربری در طراحی سایت چیست؟

رابط کاربری در طراحی سایت چیست؟ رابط کاربری در طراحی سایت را این گونه میتوان تعریف کرد ،هنگامی که در... read more

افزونه Formidable Forms

افزونه Formidable Forms

افزونه Formidable Forms  افزونه Formidable Forms کارکرد بسیار آسانی دارد و شما با عمل drag and drup (یعنی روی المان... read more

مدیریت محتوا جوملا

مدیریت محتوا جوملا

مدیریت محتوا جوملا 🔹جوملا یکی از محبوبترین سیستم های مدیریت محتوای  Open Source است که با توجه به افزونه های... read more

جستجو

Follow Us

Facebook Pinterest Instagram Linkedin Telegram

آخرین مطالب

بسته نصبی قالب وردپرس
آموزش راه اندازی بسته نصبی قالب وردپرس در هاست دایرکت ادمین
افزونه ShortPixel
افزونه ShortPixel و بهینه سازی تصاویر وردپرس
افزونه‌ WPFront user Role
افزونه‌ WPFront user Role برای مدیریت نقش های کاربری در وردپرس
آموزش ساخت بسته نصب آسان در وردپرس
آموزش ساخت بسته نصب آسان در وردپرس
افزونه Ninja Forms
افزونه Ninja Forms
افزونه EWWW Image Optimizer
افزونه EWWW Image Optimizer
افزونه User Role Editor
افزونه User Role Editor و مدیریت نقش و سطح دسترسی کاربر در وردپرس
نصب وردپرس روی ساب فولدر
آموزش نصب وردپرس روی ساب فولدر دایرکت ادمین
افزونه Master Slider
افزونه Master Slider
افزونه Formidable Forms
افزونه Formidable Forms

دسته‌ها

  • آموزش
  • آموزش وردپرس
  • بازاریابی محتوا
  • برنامه نویسی
  • تبلیغات
  • دسته‌بندی نشده
  • سئو
  • سئو خارجی
  • شبکه
  • طراحی اپلیکیشن
  • طراحی سایت
  • کامپیوتر و لپ تاپ
  • گرویتی فرم
  • لینک سازی
  • نرم افزار

بایگانی‌ها

  • فوریه 2021
  • ژانویه 2021
  • دسامبر 2020
  • نوامبر 2020
  • اکتبر 2020
  • سپتامبر 2020

دسترسی سریع

  • خانه
  • وبلاگ
  • نمونه کارها
  • درباره ما
  • طراحی سایت
  • سئو و بهینه سازی
  • کارت ویزیت آنلاین
  • پنل پیامکی

عضویت در خبرنامه

    ۹۱۰۰-۱۰۱۱(۰۱۳) info@w3design.ir
    تمامی حقوق مادی و معنوی این سایت برای تیم w3design محفوظ است.