ثبت‌نام ورود

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

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

یکی از ویژگی‌های خوبی که در قالب‌های وردپرس وجود دارد استفاده از تصویر شاخص در وردپرس (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.png" />';
}
?>

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

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

set_post_thumbnail_size( 50, 50);

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

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

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

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

نظر شما در این‌باره چیست؟

  1. U6469 ۱۱ تیر ۱۳۹۹

    سلام
    بهتر است تصویر شاخص مربعی باشه؟ یا مثلاً سایز 600 در 500 باشه اشکالی نداره؟

  2. کاربر مهمان ۱۰ آذر ۱۳۹۶

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

  3. U6861 ۱۷ مرداد ۱۳۹۶

    سلام.
    خسته نباشید!
    شما یه تذکر دوستانه هم دادین!
    چطوری میتنم عملیاتیش کنم؟
    من میخوام تصاویر شاخص رو جای دیگه آپلود کنم، اما چطوری بارگزاریش کنم؟
    ممنون میشم راهنمایی بفرمایید…

    • U7658 ۱۷ مرداد ۱۳۹۶

      درود.
      بررسی کنید ببینید شاید افزونه ای برای اینکار وجود داشته باشد.

      • U6861 ۱۸ مرداد ۱۳۹۶

        ممنون بابت پاسخگویی.
        اما،
        من خونه ی آخرش اومدم سراغ شما، چون میدونستم حداقل یه جوابی دارین.
        البته پیشاپیش ممنونم از پشتیبانی خوبتون.
        قبلا سرچ کرده بودم، چیزی یافت نکردم.
        گفتم شاید تجربه شما بیشتره، یه اطلاعاتی داشته باشین که به ما بدین!

        • U7658 ۱۸ مرداد ۱۳۹۶

          درود.

          نه متاسفانه چنین امکانی موجود نیست پس.
          باید به صورت اختصاصی کدنویسی شود.
          می توانید با دپارتمان طراحی در تماس باشید : design@mihanwp.com

  4. کاربر مهمان ۱۰ تیر ۱۳۹۶

    سلام
    من برای تنظیم سایز تصویر شاخص از این کد
    add_image_size( ‘image’, 235, 148,true);

    استفاده میکنم
    اما فقط تصاویری که مربع هستن رو نشون میده تصاویری که در بعاد بزرگ تر مستطیلی هستند رو نشون نمیده
    سایز رو هم هر چقدر تغییر بده به اندازه تصویر مستطیلی تصویر شاخص رو نشون نمیده.

  5. کاربر مهمان ۲۶ دی ۱۳۹۵

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

    • رضا حسینی راد رضا حسینی راد ۲۶ دی ۱۳۹۵

      سلام نیازی به اینکار نیست! تصویر شاخص باید از طریق تصویر شاخص اضافه شود نه فیلد های دلخواه!

  6. کاربر مهمان ۱۷ دی ۱۳۹۵

    توی ویرایشگر وردپرس تصاویر فقط با سایز کامل نمایش داده میشن و تصویر ریسایز نمیشهاین اتفاق همینطوری اتفاق افتاد و قبلش همه چیز خوب بودتصاویر هم در هاست دانلود هستند چه کنیم؟ 

    • رضا حسینی راد رضا حسینی راد ۱۸ دی ۱۳۹۵

      از بخش تنظیمات > رسانه می توانید سایز را مشخص کرده و تصاویر را مجدد آپلود کنید

      • کاربر مهمان ۱۸ دی ۱۳۹۵

        سبز مشخص هست ولی وقتی انتخاب میکنم که مثلا سایز میانه باشه هیچی نشون نمیده صفحه رو هم که رفرش میکنم فقط سایز کامل رو میشه انتخاب کردو گزینهی دیگه این هم نداره

        • رضا حسینی راد رضا حسینی راد ۱۸ دی ۱۳۹۵

          پس متاسفانه راه دیگری ندارد

          • کاربر مهمان ۱۸ دی ۱۳۹۵

            خب من الان چی کار کنم تصاویر ریسایز نمیشن؟

            • رضا حسینی راد رضا حسینی راد ۱۸ دی ۱۳۹۵

              شاید به این خاطر باشه که از هاست دانلود استفاده می کنید. روش اتصال به هاست دانلود رو تغییر بدید

            • کاربر مهمان ۱۸ دی ۱۳۹۵

              فکر نکنم چون سابدامنه هم روس هاست دانلود هست و مشکلی نداره بعد من الان یک سال بیشتره دارم از هاست دانلود استفاده میکنم این اتفاق یک ماهه که افتاده تازه شما خودتون مگه از هاست دانلود استفغده نمیکنید؟

  7. کاربر مهمان ۰۹ آذر ۱۳۹۵

    با سلام ، ببخشید من عکس های سایتمو از داخل خود وردپرس آپلود نمیکنم و باید مستقیما از سی پنل هاست آپلود کنموبه همین دلیل فقط داخل هاست یه سایز از عکس موجوده و آپلود خود وردپرس نیست که عکسام در چند سایز باشن .حالا یه مشکلی که خوردم اینه که اون مربع های کوچیک اول سایتو اگه که نگاه بکنیئد میبینید که با سایز بزرگ قرار داده شدن (لود سایت خیلی کند میشه به خاطر اینکه عکس ها با سایز بزرگ 500*500 لود میشن)حالا دنبال راهی میگردم که پست های ویژه سایتم اتوماتیک عکس با سایز کوچیکو لود کنن که سرعت بارگذاری سایتم بره بالابعد از کلی تحقیق با سایت خوب شما آشنا شدم اگه راهی لطفا راهنمایی کنید خیلی ضروریهو در ضمن قالب من از تصویر شاخص پشتیبانی نمیکنه و هیچ پستی تصویر شاخص ندارهو از افزونه Auto Thumbnail استفاده کینم برای همون مربع های کوچیکواقعا ممنونم

  8. کاربر مهمان ۰۲ خرداد ۱۳۹۵

    با سلامسایت من تصویر شاخص داره اما اعمال نمیشه مشکل از کجاستtelegramfull.ir اینم سایتم