تصاویر بند انگشتی در وردپرس یکبار برای همیشه 3 دیدگاه

wordpress

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

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

ابتدا دستور زیر را به فایل functions.php موجود در ریشه پوسته ی خود اضافه نمایید لازم به ذکر است قبل از هر تغییری در فایل فانکشن از آن نسخه ی پشتیبان تهیه نمایید تا در صورت بروز خطا آنرا به حالت اول بازگردانید همچنین اگر فایلی با این نام در پوسته وردپرس خود ندارید آن را با نام functions.php ایجاد کنید .

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

در خط بالا تنها به وردپرس می فهمانیم که پوسته ی ما از تصاویر بند انگشتی پشتیبانی میکند ، دستور شرطی در خط دوم نیز تنها برای نسخه های پایین تر از نسخه ۲.۹ می باشد به این معنی که اگر وردپرس شما بالاتر از نسخه ۲.۹ است ، نبود خط دوم هم اختلالی ایجاد نمیکند و میتوانید تنها از دستور پشتیبانی کردن پوسته از تصاویر بند انگشتی استفاده نمایید همانند دستور زیر :

<?php
add_theme_support( 'post-thumbnails' );
?>

تا به اینجا قابلیت تصاویر بند انگشتی به وردپرس شما اضافه شده است در مرحله ی بعد باید آنرا برای نمایش در پوسته به فایلهای مورد نظر خود همانند index , search , archive , category و … اضافه نمایید ، برای انجام این کار ابتدا فایل مورد نظر خود را برای ویرایش باز کرده و حلقه ی وردپرس را در آن پیدا کنید ( حلقه وردپرس به شکل زیر میباشد ) :

while ( have_posts() ) : the_post();

لازم به ذکر است که دستور زیر  :

<?php the_post_thumbnail(); ?>

که جهت نمایش تصاویر بند انگشتی وردپرس به کار می رود حتما” باید درون حلقه وردپرس و قبل از تابع the_content و یا the_excerpt قرار گیرد که نتیجه ویرایش به شکل زیر می شود :

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

سوالی که ممکن است برای شما هم پیش بیاید این است که در صورت انتخاب نکردنِ تصویری برای نوشته به عنوان تصویر شاخص نحو ه ی عملکرد این تابع به چه شکل است ؟

در جواب باید گفت در صورت عدم انتخابِ تصویری به عنوان بند انگشتی هیچ تصویری برای آن نوشته در برگه به نمایش در نخواهد آمد و این امر ممکن است زیبایی و چیدمان ظاهر سایت شما را بر هم بزند که در این حالت بهترین راه استفاده از دستور شرطی برای تابع تصاویر بند انگشتی وردپرس می باشد بدین گونه که در صورت نبودِ تصویر شاخص تصویری که شما در دستور شرطی به عنوان جایگزین برای نوشته هایی که تصویر شاخص ندارند انتخاب کرده اید به نمایش در می آید که نتیجه برای ایجاد دستور شرطی به شکل زیر می باشد :

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

در دستور بالا شما باید تصویری در پوشه ء تصاویر خود که در اینجا با نام images آمده است و با نام no-thumbnail بارگذاری کنید .

همانطور که میدانید تصاویری که برای استفاده در نوشته ها و … در وردپرس خود بارگذاری میکنید بصورت پیش فرض در چندین اندازه ی مختلف ایجاد می شوند بدین صورت که در تابع the_post_thumbnail میتوانید از آرگومان های مختلفی برای نمایش تصاویر خود استفاده کنید همانند :

<?php the_post_thumbnail('thumbnail'); ?>

تامب نایل که بصورت پیش فرض در اندازه ۱۵۰ × ۱۵۰ می باشد .

<?php the_post_thumbnail('medium'); ?>

مدیوم که بصورت پیش فرض در اندازه ۳۰۰ × ۳۰۰ می باشد .

<?php the_post_thumbnail('large'); ?>

لارج که بصورت پیش فرض در اندازه ۶۴۰ × ۶۴۰ می باشد .

<?php the_post_thumbnail('full'); ?>

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

برای انجام این کار دستور زیر را به فایل فانکشن پوسته وردپرس اضافه کنید :

if (function_exists('add_image_size')){
add_image_size( 'first-thumb', 300, 255, true);
add_image_size( 'secound-thumb', 400, 300, true);
add_image_size( 'third-thumb', 125, 125, true);
}

با ذخیره ی تغییرات در فایل فانکشن ۳ اندازه ی دیگر نیز برای وردپرس شما ایجاد شد که در پارامتر اول دستور بالا میتوانید نام مورد نظر خود را برای بند انگشتی بنویسید در پارامتر دوم طول و پارامتر سوم عرض تصویر را مشخص کنید همچنین پارامتر آخر که بصورت اختیاری میباشد عمل برش تصاویر را انجام می دهد در صورتی که با انجام تغییرات فوق شما به اندازه ای که در فایل فانکشن برای ایجاد بند انگشتی با اندازه دلخواه نرسیدید میتوانید برای رفع این مشکل از افزونهء Regenerate Thumbnails که تصاویر بند انگشتی را از نو بازسازی میکند استفاده نمایید و برای استفاده از تابع بند انگشتی برای سایزهای دلخواه میتوانید به شکل زیر عمل کنید : ( نمونه برای اندازه ی دلخواه )

<?php the_post_thumbnail('first-thumb'); ?>

اما در مواردی ممکن است نیاز شما به نمایش تصاویر بند انگشتی در پوسته با اندازه های متفاوت بیشتر از تعداد معمول باشد که طبیعتا” استفاده از روش بالا برای اضافه کردن اندازه های بیشتر و استفاده از توابع بند انگشتی با آرگومان های مختلف در فایل های پوسته وقت گیر و خسته کننده می باشد ، اگر شما هم در پوسته ی خود از تعداد زیادی بند انگشتی بهره می برید پیشنهاد می شود از اسکریپت Tim Thumb برای نمایش تصاویر بند انگشتی خود در بی نهایت اندازه ی مختلف و تنها با یک دستور استفاده کنید .
برای استفاده از اسکریپت Tim Thumb ابتدا نسخه فعلی آنرا از اینجا دریافت کنید و محتوای فایل دریافت شده را در ریشه ی پوسته ی خود بارگذاری کنید سپس کد زیر را به فایل فانکشن پوسته خود اضافه نمایید .

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;
}

بعد از ذخیره کردن تغییرات شما می توانید با استفاده از دستور زیر در هر کجای پوسته از تصاویر بند انگشتی با اندازه های متفاوت و دلخواه استفاده کنید :

<?php
if ( has_post_thumbnail() ) { ?>

<a href="<?php the_permalink() ?>">

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

<?php } else { ?>
<a href="<?php the_permalink() ?>">

<img src="<?php bloginfo('template_directory'); ?>/images/no-thumbnail.png"title="<?php the_title(); ?>" />

</a>

<?php } ?>

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

.post-thumb {
border:1px solid #E0E0E0;
background-color: #fff;
-webkit-box-shadow: 0 0 3px rgba(0,0,0,0.2);
-moz-box-shadow: 0 0 3px rgba(0,0,0,0.2);
box-shadow: 0 0 3px rgba(0,0,0,0.2);
float: left;
}

و در آخر دایو مربوط را به فایل های خود اضافه نمایید که نتیجه کار به شکل زیر می باشد .

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

تمامی مراحل اضافه کردن قابلیت تصاویر بند انگشتی به پوسته ی شما به پایان رسید اما هنوز مشکلی کوچک برای تعدادی از دوستان باقی مانده است ، کاربرانی که پیش از این برای نوشته های خود تصویر شاخص انتخاب نکرده بودند که در پی آن تمامی نوشته های پیشین آنان بدون تصویر بند انگشتی میباشد اگر شرایط فعلی شما نیز چنین است بهترین گزینه برای حل این مشکل استفاده از افزونه Auto Post Thumbnail می باشد که پس از دریافت افزونه از مخزن وردپرس و نصب آن میتوانید با رفتن به منوی کاربری افزونه و کلیک بر روی دکمه Generate Thumbnails برای تمامی نوشته هایی که برای آنها تصویر شاخص انتخاب نشده است بصورت خودکار تصویر بند انگشتی اضافه کنید این عمل به این صورت انجام میگیرد که افزونه به صورت خودکار تصویر اول از هر نوشته را به عنوان تصویر شاخص برای آن نوشته قرار می دهد .

موفق باشید .

منبع : ماندگار وب

نظرات

گالری عکس

سایت خوبی دارید ممنون

نیما

دستتون درد نکنه یک دنیا ممنون....

خواهش میشه.

پاسخ دهید

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


Time limit is exhausted. Please reload CAPTCHA.