آموزش تغییر اندازه تصویر شاخص در وردپرس

‏  4 دقیقه
۰۳ تیر ۱۳۹۹
آموزش تغییر اندازه تصویر شاخص در وردپرس

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

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

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

sizes

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

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

<?php add_image_size( $name, $width, $height, $crop ); ?>

این تابع چهار پارامتر دریافت می‌کند که به ترتیب نام، عرض، ارتفاع و اجازه‌ی بریدن تصاویر را تعیین می‌کنند. پارامتر $crop بولین است و مقدار true یا false می‌گیرد که به صورت پیشفرض false است. (پارامتر $crop از نسخه ی 3.9 به وردپرس اضافه شده است)

برای مثال می‌خواهیم تصاویری که آپلود می‌کنیم در سایز 170 در 200 هم ذخیره شوند و در صورت بزرگ بودن تصویر، قسمت اضافه بریده شود. برای این منظور کافیست کدهای زیر را به فایل functions.php پوسته اضافه کنید تا سایز جدید به تصاویر شما اضافه شود.

//Add New Image Size
add_image_size('post-thumbnail', 170, 200, true); //post-thumbnail
نکته :

تصاویری که از این پس آپلود می‌کنید در سایز جدید نیز ذخیره خواهند شد.

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

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

در این‌جا، نامی که هنگام اضافه‌کردن سایز جدید تعریف کردیم، در پارامتر تابع the_post_thumbnail قرار می‌گیرد.

 حذف کردن سایز تصویر

در صورتی که از سایز‌های پیش‌فرض تصاویر استفاده نمی‌کنید، می‌توانید برای جلوگیری از حجیم شدن اطلاعات سایت خود آن‌ها را حذف کنید. فیلتر intermediate_image_sizes_advanced تمامی سایزهای تصاویر تعریف شده را درون یک آرایه برمی‌گرداند که ما می‌توانیم توسط تابع unset() در PHP، سایزهای مورد نظر را حذف کنیم.

function remove_default_img($sizes) {
    unset( $sizes['medium']);
    unset( $sizes['large']); 
    unset( $sizes['thumbnail']);
    return $sizes;
}
add_filter('intermediate_image_sizes_advanced', 'remove_default_img');

افزونه‌های تغییر سایز تصاویر وردپرس

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

مطالب پیشنهادی:

جمع‌بندی:

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

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

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

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

 

نظرات کاربران

رضا

سلام خسته نباشید امیدوارم پس از تایید نظر و پاسخ به ایمیل م خبر بده 😀
من یک سوال بنظر ساده دارم !
من میخوام همه عکس هایی که توی سایتم آپلود میکنم ( همه همه همه) تبدیل به یک اندازه مثل ۷۵۰در۳۰۰ پیکسل بشوند!‌
میهوام از هر عکس فقط یه دونه باشه اون یه دونه هم همون سایزی باشه که گفتم
*****مهم مهم مهم مهم *** میخوام موقع آپلود عکس اگر عکس بزرگ بود به من اجازه بده که بگم کدوم قسمت رو برش دهد
باید چکار کنم ؟ لطفا راهنماییم کنید 🙁 🙁
خیلی ممنون میشم

وحید صالحی

دوست عزیز سوالتون رو در انجمن مطرح کنید

رضا

فکر کردم مرتبط با موضوع هست
چشم دوست عزیز

وحید صالحی

بحث ارتباط مطرح نیست ممکنه یک مطلبی خیلی موارد بهش مرتبط(مثل کدهاش) باشه از جهات مختلف… نظرات یک مطلب صرفا مختص مطالب و موارد همون مطلبه و موارد مشابه باید در انجمن مطرح بشه که به نفع خودتونه اونجا سوالاتون رو تمام کاربران سایت می بینن و درصد پاسخ گویی بهش خیلی بالاتره ولی در نظرات فقط مدیران می بینند و اگر نویسنده مطلب نباشه قطعا پاسخی نخواهید گرفت

امیر

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

add_theme_support( ‘post-thumbnails’ );
add_image_size( ‘thumb200’, 200, 170, true );
add_image_size( ‘thumb120’, 120, 60, true );
add_image_size( ‘thumb60’, 60, 30, true );
add_image_size( ‘thumb50’, 50, 50, true );
add_image_size( ‘thumb180’, 180, 90, true );

وقتی تاپیکی رو ارسال می کنم که محتوی 10 تا عکس هست

برای هر کدوم از عکس ها اندازه هارو اعمال می کنه یعنی میشه جمعا 50 تا عکس که این خوب نیست

چطوری می تونم این مشکل رو برطرف کنم

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

وحید صالحی

دوست عزیز سوالتون رو در انجمن مطرح کنید

Mohsen

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

دوست

داداش دستت در د نکنه

Mahmood Dabestani

درود بر شما.
ولی منظور بنده یه چیزی مثل کاری هست که افزونه ی seo friendly image انجام میده. یعنی به صورت خودکار ویژگی alt و title رو به تصاویر سایت اضافه می کنه.
بنده کدی یا افزونه ای میخوام که ویژگی width و height رو به تصاویر سایتم اضافه کنه.

علی امینی

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

Mahmood Dabestani

درود بر شما.
مطلب واقعا مفیدی بود.
اما در قسمتی از سایتتون به چشمم خورده بود که در مورد آنالیز وبسایت توسط Gtmetrix صحبت کرده بودید.
تو این سایت تصاویری که دارای اندازه نباشند رو مشخص میکنه و میخواد که برای اون تصاویر اندازه تعریف کنیم.
سوالی که بنده دارم اینه که من از یک تصویر بارها به عنوان تصویر شاخص تو سایتم استفاده کردم که متاسفانه اندازه براش تعریف نشده.
http://www.arize.ir
کدی نیست که بشه بوسیله ی اون همه ی تصاویر سایت رو دارای اندازه ی دلخواه کرد؟
منظور بنده برای سئو شدن تصاویر هستش نه اندازه ی تصاویری که قراره از این به بعد آپلود کنیم.
خیلی ممنون و سپاس.
😯

علی امینی

اگه منظورتون اینه که تصاویر شاخص قبلی رو هم به سایز جدید که تعریف می کنید تغییر سایز بدید باید از افزونه ی Regenerate Thumbnails استفاده کنید. ابتدا اندازه‌های مورد نیازتونو تعریف کنید و بعد از نصب و فعالسازی افزونه، گزینه ی جدیدی در قسمت ابزارها (Regen. Thumbnails) اضافه میشه. به اون قسمت برید و بعد روی دکمه ی Regenerate All Thumbnails کلیک کنید؛ صبر کنید تا همه ی تصاویر به سایز جدید تغییر اندازه بدن. کار تمومه

لقمان آوند

در خود تابع the_post_thumbnail می تونی عرض و ارتفاع رو تعین کنی .

ugd

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

وحید صالحی

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

علی امینی

جواب آقا لقمان هم صحیحه ولی اگه تصویری به اون اندازه وجود نداشته باشه، تصویر به همون اندازه ی کاملش قرار میگیره.

وحید صالحی

به مورد خوبی اشاره کردید…
ممنون