Как задать миниатюры точного размера для сайта на wordpress?
Как обрезать и при этом одновременно уменьшить по возможности размер фото для миниатюр, чтобы те смотрелись в теме одинаково хорошо.
Например на демо версии темы все фотографии имеют размер 900х600рх, главное чтобы размер миниатюры был при этом 16х9, чтобы было на всю ширину поста или по высоте не слишком высоким.
Обычно миниатюры задаются размером по максимальным значениям, например, 1024х1024, 150х150, ...
При таком варианте я думаю фото может нарушить пропорции в соотношении 16х9.
Тот самый образец.
Важно чтобы старые миниатюры обрезались под размер и новые загружаемые также обрезались.
Дополнение:
в теме есть код отвечающий за отображение миниатюры
if ( ! function_exists( 'zakra_post_thumbnail' ) ) : /** * Displays an optional post thumbnail. * * Wraps the post thumbnail in an anchor element on index views, or a div * element when on single views. */ function zakra_post_thumbnail( $image_size = 'post-thumbnail ) { if ( post_password_required() || is_attachment() || ! has_post_thumbnail() ) { return; } ?> <div class="zak-entry-thumbnail"> <?php if ( is_singular() ) : the_post_thumbnail(); else : ?> <a class="zak-entry-thumbnail__link" href="<?php the_permalink(); ?>" aria-hidden="true"> <?php the_post_thumbnail( $image_size, array( 'alt' => the_title_attribute( array( 'echo' => false, ) ), ) ); ?> </a> <?php endif; // End is_singular(). ?> </div><!-- .zak-entry-thumbnail --> <?php } endif; |
if ( ! function_exists( 'zakra_post_thumbnail' ) ) : /** * Displays an optional post thumbnail. * * Wraps the post thumbnail in an anchor element on index views, or a div * element when on single views. */ function zakra_post_thumbnail( $image_size = 'post-thumbnail ) { if ( post_password_required() || is_attachment() || ! has_post_thumbnail() ) { return; } ?> <div class="zak-entry-thumbnail"> <?php if ( is_singular() ) : the_post_thumbnail(); else : ?> <a class="zak-entry-thumbnail__link" href="<?php the_permalink(); ?>" aria-hidden="true"> <?php the_post_thumbnail( $image_size, array( 'alt' => the_title_attribute( array( 'echo' => false, ) ), ) ); ?> </a> <?php endif; // End is_singular(). ?> </div><!-- .zak-entry-thumbnail --> <?php } endif;
заменив который на это я получаю то что указано, указав точную обрезку миниатюр в обычных настройках вордпресс
if ( ! function_exists( 'zakra_post_thumbnail' ) ) : /** * Displays an optional post thumbnail. * * Wraps the post thumbnail in an anchor element on index views, or a div * element when on single views. */ function zakra_post_thumbnail( $image_size = 'thumbnail' ) { if ( post_password_required() || is_attachment() || ! has_post_thumbnail() ) { return; } ?> <div class="zak-entry-thumbnail"> <?php if ( is_singular() ) : the_post_thumbnail(); else : ?> <a class="zak-entry-thumbnail__link" href="<?php the_permalink(); ?>" aria-hidden="true"> <?php the_post_thumbnail( $image_size, array( 'alt' => the_title_attribute( array( 'echo' => false, ) ), ) ); ?> </a> <?php endif; // End is_singular(). ?> </div><!-- .zak-entry-thumbnail --> <?php } endif; |
if ( ! function_exists( 'zakra_post_thumbnail' ) ) : /** * Displays an optional post thumbnail. * * Wraps the post thumbnail in an anchor element on index views, or a div * element when on single views. */ function zakra_post_thumbnail( $image_size = 'thumbnail' ) { if ( post_password_required() || is_attachment() || ! has_post_thumbnail() ) { return; } ?> <div class="zak-entry-thumbnail"> <?php if ( is_singular() ) : the_post_thumbnail(); else : ?> <a class="zak-entry-thumbnail__link" href="<?php the_permalink(); ?>" aria-hidden="true"> <?php the_post_thumbnail( $image_size, array( 'alt' => the_title_attribute( array( 'echo' => false, ) ), ) ); ?> </a> <?php endif; // End is_singular(). ?> </div><!-- .zak-entry-thumbnail --> <?php } endif;
Но проблема в том что копирование файла в дочернюю тему где расположен этот код не работает в дочерней теме, его нужно как-то иначе сделать или переписать каким-то образом и добавить в functions.
Дополнительно:
почитайте этот вопрос (может поможет)
//получаем в шаблоне: $attachment_src=wp_get_attachment_image_src(get_post_thumbnail_id(),'mysize'); |
//получаем в шаблоне: $attachment_src=wp_get_attachment_image_src(get_post_thumbnail_id(),'mysize');
Помимо добавления кода в functions темы
add_filter('wp_handle_upload_prefilter','add_handle_upload'); if(!function_exists('add_handle_upload')){ function add_handle_upload($file){ add_image_size('mysize',600,200,array('center','center')); return $file; }} |
add_filter('wp_handle_upload_prefilter','add_handle_upload'); if(!function_exists('add_handle_upload')){ function add_handle_upload($file){ add_image_size('mysize',600,200,array('center','center')); return $file; }}
надо еще добавить с тему код где выводится миниатюра, так?
надо еще добавить с тему код где выводится миниатюра, так?
верно. место, где будет выводиться в цикле все это, необходимо добавить код. Например это архивная страница ( по умолчанию archive.php )
//получаем в шаблоне: $attachment_src=wp_get_attachment_image_src(get_post_thumbnail_id(),'mysize'); |
//получаем в шаблоне: $attachment_src=wp_get_attachment_image_src(get_post_thumbnail_id(),'mysize');
Т.е. редактировать тему, если она самописная, в противном случае через создание дочерней ( копируем в дочернюю тему archive.php и редактируем ).
if ( ! function_exists( 'zakra_post_thumbnail' ) ) : /** * Displays an optional post thumbnail. * * Wraps the post thumbnail in an anchor element on index views, or a div * element when on single views. */ function zakra_post_thumbnail( $image_size = '-post-thumbnail' ) { if ( post_password_required() || is_attachment() || ! has_post_thumbnail() ) { return; } ?> <div class="zak-entry-thumbnail"> <?php if ( is_singular() ) : the_post_thumbnail(); else : ?> <a class="zak-entry-thumbnail__link" href="<?php the_permalink(); ?>" aria-hidden="true"> <?php the_post_thumbnail( $image_size, array( 'alt' => the_title_attribute( array( 'echo' => false, ) ), ) ); ?> </a> <?php endif; // End is_singular(). ?> </div><!-- .zak-entry-thumbnail --> <?php } endif; |
if ( ! function_exists( 'zakra_post_thumbnail' ) ) : /** * Displays an optional post thumbnail. * * Wraps the post thumbnail in an anchor element on index views, or a div * element when on single views. */ function zakra_post_thumbnail( $image_size = '-post-thumbnail' ) { if ( post_password_required() || is_attachment() || ! has_post_thumbnail() ) { return; } ?> <div class="zak-entry-thumbnail"> <?php if ( is_singular() ) : the_post_thumbnail(); else : ?> <a class="zak-entry-thumbnail__link" href="<?php the_permalink(); ?>" aria-hidden="true"> <?php the_post_thumbnail( $image_size, array( 'alt' => the_title_attribute( array( 'echo' => false, ) ), ) ); ?> </a> <?php endif; // End is_singular(). ?> </div><!-- .zak-entry-thumbnail --> <?php } endif;
вот эта строка отвечает за вывод миниатюры если прописать точные ее размеры в админке
function zakra_post_thumbnail( $image_size = '-post-thumbnail' ) |
function zakra_post_thumbnail( $image_size = '-post-thumbnail' )
указав вот так в родительской
function zakra_post_thumbnail( $image_size = 'thumbnail' ) |
function zakra_post_thumbnail( $image_size = 'thumbnail' )
код отвечающий за это находится в папке /inc/
ну файлы по типу archive.php имеют, как правило, стандартные строки кода, и в зависимости от условий инклудятся (/inc/ от того папка так названа) те или иные файлы
в дочерней теме так не работает.
Это уже протестировано давно и не один раз. Если нет в теме велосипедов, то все отлично должно работать. увы но это проблема Вашей темы (100%). Надо с темой разбираться...
function zakra_post_thumbnail
такой функции в движке ВП нет. смотрите внутрянку этой функции в файлах темы ...
можно оформить все на языке движка WP
можно оформить все на языке движка WP
можно, но я не программист чтобы так оформить.
В дочерних темах обычно еще добавляют код в functions что нужно переписать в родительской теме.
Что-то типа этого
function zakra_post_thumbnail( $image_size = 'thumbnail' ) { $attachment_src = wp_get_attachment_image_src(get_post_thumbnail_id(),'mysize'); } |
function zakra_post_thumbnail( $image_size = 'thumbnail' ) { $attachment_src = wp_get_attachment_image_src(get_post_thumbnail_id(),'mysize'); }
Ответы:
Функция add_image_size()
- что-то не обрезает миниатюры в записях, прописав
function wpdocs_theme_setup() { add_image_size( 'custom-size', 900, 600, array( 'center', 'top' ) ); // Hard crop left top } add_action( 'after_setup_theme', 'wpdocs_theme_setup' );
function wpdocs_theme_setup() { add_image_size( 'custom-size', 900, 600, array( 'center', 'top' ) ); // Hard crop left top } add_action( 'after_setup_theme', 'wpdocs_theme_setup' );
- Возможно вы просто не правильно их выводите.
Попробуйте: wp_get_attachment_image() - mikitachyzhyk, в родительской теме прописано так и находится в папке /inc/ и файле template-tags.php
if ( ! function_exists( 'zakra_post_thumbnail' ) ) : /** * Displays an optional post thumbnail. * * Wraps the post thumbnail in an anchor element on index views, or a div * element when on single views. */ function zakra_post_thumbnail( $image_size = '-post-thumbnail' ) { if ( post_password_required() || is_attachment() || ! has_post_thumbnail() ) { return; } ?> <div class="zak-entry-thumbnail"> <?php if ( is_singular() ) : the_post_thumbnail(); else : ?> <a class="zak-entry-thumbnail__link" href="<?php the_permalink(); ?>" aria-hidden="true"> <?php the_post_thumbnail( $image_size, array( 'alt' => the_title_attribute( array( 'echo' => false, ) ), ) ); ?> </a> <?php endif; // End is_singular(). ?> </div><!-- .zak-entry-thumbnail --> <?php } endif;
if ( ! function_exists( 'zakra_post_thumbnail' ) ) : /** * Displays an optional post thumbnail. * * Wraps the post thumbnail in an anchor element on index views, or a div * element when on single views. */ function zakra_post_thumbnail( $image_size = '-post-thumbnail' ) { if ( post_password_required() || is_attachment() || ! has_post_thumbnail() ) { return; } ?> <div class="zak-entry-thumbnail"> <?php if ( is_singular() ) : the_post_thumbnail(); else : ?> <a class="zak-entry-thumbnail__link" href="<?php the_permalink(); ?>" aria-hidden="true"> <?php the_post_thumbnail( $image_size, array( 'alt' => the_title_attribute( array( 'echo' => false, ) ), ) ); ?> </a> <?php endif; // End is_singular(). ?> </div><!-- .zak-entry-thumbnail --> <?php } endif;
есть несколько способов это сделать. Можно обрезать миниатюры вручную в редакторе. Но это чёрная работа. Можно при помощи плагинов. Regenerate Thumbnails или Force Regenerate Thumbnails. Первый исправит ранее загруженные изображения. Этот плагин провоцирует wordpress менять размер миниатюры удаляя прежние размеры. Чем этот плагин лучше предыдущего то что он удаляет прежние прежние размеры, а тот только изменяет. Оба совместимы с woocommerse.
- Эти плагины меняют миниатюры для медиабиблиотеки что в админке сайта, но не влияют на изменение фото в записях никак
Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.
Пока нет других ответов. Будьте первым, кто поможет автору.
Ответить на вопрос