ایجاد تصویر شاخص در وردپرس با استفاده از timthumb

ایجاد تصویر شاخص در وردپرس با استفاده از timthumb

ایجاد تصویر شاخص در وردپرس با استفاده از timthumb

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

شاید برای شما سوال باشه ، یا یک فرد تازه کار باشید که ندانید تصویر شاخص چیست و چه کاربردی دارد به شما توضیحی در این مورد ارائه می کنم

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

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

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

تصویر شاخص (Featured Image) در وردپرس به تصویری گفته می‌شود که به عنوان نمایه بصری یک پست، صفحه، یا محتوای خاصی از سایت شما انتخاب می‌شود. این تصویر معمولاً در بالای پست‌ها، صفحات وبلاگ یا محتوای خاص دیگری نمایش داده می‌شود و نقشی کلیدی در جذابیت و تاثیرگذاری بصری سایت دارد.

تصویر شاخص یکی از مهم‌ترین عناصر بصری سایت است که توجه کاربران را جلب می‌کند. به دلیل این‌که اولین بخشی است که بازدیدکنندگان هنگام مشاهده پست یا صفحه می‌بینند، انتخاب مناسب تصویر شاخص می‌تواند تأثیر زیادی بر تجربه کاربری و میزان تعامل بازدیدکنندگان داشته باشد. این تصاویر همچنین در شبکه‌های اجتماعی هنگام به اشتراک‌گذاری محتوا نمایش داده می‌شوند، که می‌تواند به افزایش کلیک‌ها و بازدیدها کمک کند.

ابعاد تصویر شاخص بسته به قالب وردپرس متفاوت است. هر قالب ممکن است اندازه‌های خاص خود را برای تصاویر شاخص تعریف کند، اما معمولاً تصاویری با رزولوشن مناسب (مثلاً 350×350 پیکسل) برای بیشتر قالب‌ها کاربردی هستند. بهینه‌سازی تصاویر از نظر حجم و کیفیت بسیار مهم است، زیرا تصاویر حجیم می‌توانند سرعت بارگذاری سایت را کاهش دهند.

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

timthumb چیست :

دیدید زمانی که شما یک کد نویسی انجام می دهید به فرض مثال کد های مانند تگ P یا هر تگ دیگری که در هر زبان برنامه نویسی استفاده می کنید که به عنوان یک شروع کننده کد می باشد و آن کد با آن کد باز می شود و با آن کد بسته می شود در کل یعنی باز و بسته بودن آن خط کد بستگی به آن خط کد نویسی دارد ، چه کد تو کدی شد این بخش 🙂

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

چطور می توانید کد نویسی timthumb را انجام دهیم :

خب بریم سراغ اصل مطلب شما برای اینکه بتوانید کد نویسی این بخش را انجام دهید باید بر روی اینجا کلیک کنید و بعد از آن وارد یک صفحه می شوید که در آن یک فایل کد نویسی شده به شما تحویل داده می شود که این کد ها توسط گوگل به شما داده می شود و این همان خط کد های timthumb می باشد

اگر که فایل دانلود شد که هیچ ، اگر که فایل دانلود نشد شما باید کلید های ctrl+s را بزنید و فایل مورد نظر را با نام timthumb.php ذخیره کنید و بعد از آن در هاست خود در پوشه قالب خود آپلود کرده و بعد از آن باید وارد فایل Functions.php قالب خود شوید و بعد از آن کد زیر را در این فایل قرار دهید.

function get_image_url(){
$image_id = get_post_thumbnail_id();
$image_url = wp_get_attachment_image_src($image_id,'full');
$image_url = $image_url[0];
echo $image_url;
}

خب حالا دیگر با کد بالا قالب سایت شما از عکس یا تصویر شاخص timthumb پشتیبانی می کند و شما باید تکیه کد زیر را در هر قسمتی که می خواهید تصویر شاخص مطالب سایت شما نمایش داده شود قرار دهید تا بتوانید آن تصویر را در سایت نمایش دهید

<img src="<?php bloginfo('template_directory'); ?>/timthumb.php?src=<?php get_image_url(); ?>&h=200&w=200&zc=1" title="<?php the_title(); ?>" />

در کد بالا شما با تغییر دادن عدد 200 می توانید عرض تصویر شاخص و طول تصویر شاخص خود را مشخص کنید در کد بالا W به معنای پهنای تصویر و H به معنای ارتفاع تصویر می باشد و شما می توانید با تغییر هر کدام پهنا و ارتفاع آن تصویر را ویرایش کنید و نمایش دهید.

به همین راحتی شما می توانید تصویر شاخص خود را با کد نویسی timthumb انجام دهید.

موفق و پیروز باشید.

مهران حسینی راد وب‌سایت
من مهران حسینی راد هستم ! از سال 94 در زمینه طراحی سایت با وردپرس در حال فعالیت هستم و با تیم های محبوب زیاد فعالیت داشته ام تا اینکه تصمیم گرفتم میهن آکادمی راه اندازی کنم و تجربه این 9 سال فعالیتم را با شما به اشتراک بگذارم

دیدگاهتان را بنویسید