اضافه کردن تصویر شاخص در وردپرس با کد تصویر شاخص

یکی از ویژگی‌های خوبی که در قالب‌های وردپرس وجود دارد استفاده از تصویر شاخص در وردپرس (thumbnail) است. زمانی که شما مطلبی را در سایت خود منتشر می‌کنید این امکان را دارید که برای مطلب خود تصویر شاخص انتخاب کنید. می‌توان گفت تقریباً تمام قالب‌های وردپرس که کاربران از آن‌ها استفاده می‌کنند از این قابلیت پشتیبانی می‌کنند.

امروز می‌خواهیم آموزش اضافه کردن تصویر شاخص به قالب وردپرس  را به شما عزیزان آموزش دهیم. برای اضافه کردن تصویر شاخص به قالب وردپرس باید چند قطعه کد PHP در قسمت فانکشن (Function.php) اضافه کنید؛ و کدها را درون حلقه نوشته قرار دهید. جهت کسب اطلاعات بیشتر در این زمینه با ما تا پایان مقاله همراه باشید.

شما می‌توانید این کار را به‌راحتی انجام دهید. ما در این آموزش این کار را به ساده‌ترین شکل ممکن به شما کاربران عزیز آموزش خواهیم داد.

قرار دادن تصویر شاخص برای مطالب کمک می‌کند که کاربران مفهوم مطالب را بهتر و دقیق‌تر متوجه شوند. درواقع کاربر با دیدن تصویر شاخصی که شما برای مطلب خود انتخاب کرده‌اید می‌تواند کلیت موضوع را درک کند.

شما برای اینکه بفهمید قالب مورداستفاده در سایت شما از تصویر شاخص پشتیبانی می‌کند یا خیر تنها کافی است به بخش ویرایشگر قالب خود مراجعه کنید. سپس با ایجاد یک پست جدید باید در آن، در قسمت تنظیمات بخش تصاویر شاخص را پیدا کنید. در غیر این صورت قالب شما از تصویر شاخص پشتیبانی نمی‌کند.

نمونه قرارگیری تصویر شاخص در سایت را می‌‌‌‌‌توانید در تصویر زیر مشاهده کنید.

تصویر شاخص در وردپرس

تصویر شاخص یکی از ویژگی‌های وردپرس است که در بین کاربران وردپرس از اهمیت خاصی برخوردار می‌باشد. تصویر شاخص به شما این امکان را می‌دهد که یک تصویر بندانگشتی برای مطالب خود قرار داده؛ و آن را در لیست نوشته‌ها مانند برترین مطالب سایت و یا آخرین مطالب سایت نمایش دهید. یکی از مزیت‌هایی که تصویر شاخص دارد این است که باعث می‌شود سایت شما زیباتر جلوه کند.

این قابلیت مفید در نسخه 3 وردپرس به کاربران معرفی شد و از آن پس استقبال زیادی از آن شد. همچنین شما امکان این را دارید که اندازه عکس انتخابی خود را در هر میزان که می‌خواهید انتخاب کرده و در سایت خود قرار دهید. شما هیچ‌گونه محدودیتی در انتخاب تصاویر ندارید و می‌توانید هر عکسی که دوست داشته باشید را به‌عنوان تصویر شاخص قرار دهید.

انتخاب تصویر شاخص هم به‌ظاهر سایت شما کمک می‌کند و آن را زیبا می‌کند و هم اینکه در سئو سایت شما تأثیر زیادی دارد. شما باید در نظر داشته باشید که همواره برای مطالب سایت خود از تصاویر یونیک استفاده نمایید. نکته مهمی که ممکن است برخی از مدیران سایت‌ها به آن توجه نکنند اهمیت تصویر شاخص بر سئو سایت آن‌ها است.

درواقع یکی از روش‌هایی که شما می‌توانید توسط آن سایت خود را بهینه‌سازی کنید قرار دادن تصویر شاخص است. یکی از نکته‌هایی که باید به آن توجه داشته باشید این است که از تصاویر مرتبط به مطلب خود استفاده کنید. چراکه استفاده از تصاویر نامرتبط در آینده تأثیر منفی بر سئو سایت شما خواهد گذاشت.

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

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

خب در قدم اول کدهای زیر را در فایل فانکشن (Function.php) قالب خود اضافه کنید.

<?php
if (function_exists('add_theme_support')) {
add_theme_support( 'post-thumbnails' );
}
?>

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

The post Thumbnail تصویر شاخص پست را در مکان های مختلف قالب نمایش می دهد.

کد را برای شما عزیزان قرار داده‌‌‌‌‌ایم:

while ( have_posts() ) : the_post();
<?php the_post_thumbnail(); ?>
<?php the_content(); ?>

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

<?php
if ( has_post_thumbnail() ) {
the_post_thumbnail();
}
else {
echo '<img src="' . get_bloginfo( 'stylesheet_directory' ) . '/images/no-thumbnail.webp" />';
}
?>

فایل No-thumbnail.webp را در پوشه Images موجود در قالب سایتتان قرار دهید.

همچنین شما این امکان را دارید که اندازه تصویر شاخص را در سایتتان تغییر دهید. برای انجام این کار باید از کد زیر استفاده نمایید. این کد را باید به فایل functions.php خود اضافه نمایید.

set_post_thumbnail_size( 50, 50);

نتیجه‌‌‌‌‌گیری نهایی

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

حتماً این نکته را در نظر داشته باشید که قبل از شروع به پست گذاری روی سایت‌های خود آپلود را به هاست دانلود متصل کنید؛ تا تصاویر شاخص سایتتان از هاست دانلود دریافت شوند. این کار باعث کاهش مصرف پهنای باند و فضای مصرفی هاست اصلی سایت شما می‌شود.

روز پرسود و پردرآمدی داشته باشید. ?

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

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