-
Posts
-
Hello Enfold Support Team,
I am trying to change the default cropped size of my featured images on single blog posts to a proper 16:9 aspect ratio, so that my 1280x720px images are displayed in full without any cropping.
I have tried two different PHP-based methods based on my research, but neither has worked on my local server environment (so caching should not be the issue).
Method 1: Modifying Existing Sizes
First, I tried to modify the existing theme sizes using the avf_modify_thumb_size filter. This was the code I used in my child theme’s functions.php (respectively in a Code Snippet Plugin):
function enfold_definitive_image_ratio_fix( $size_array ) { $size_array['entry_without_sidebar'] = array('width' => 1210, 'height' => 681); $size_array['entry_with_sidebar'] = array('width' => 845, 'height' => 475); return $size_array; } add_filter( 'avf_modify_thumb_size', 'enfold_definitive_image_ratio_fix', 10, 1 );When this code is active, the “Regenerate Thumbnails” page still shows the old default dimensions (e.g., 1210×423), so the filter does not seem to be applying correctly.
Method 2: Registering a New Size and Forcing its Use
As an alternative, I also tried registering a brand new 16:9 image size (custom-16-9-hero) and then used the avf_post_featured_image_size filter to force the theme to use it. Here is the code for that attempt:
function enfold_add_custom_image_sizes() { add_image_size( 'custom-16-9-hero', 1280, 720, true ); } add_action( 'after_setup_theme', 'enfold_add_custom_image_sizes' ); function enfold_use_custom_featured_image_size( $size ) { if ( is_singular('post') ) { return 'custom-16-9-hero'; } return $size; } add_filter( 'avf_post_featured_image_size', 'enfold_use_custom_featured_image_size', 10, 1 );With this method, the “Regenerate Thumbnails” plugin does show my new custom-16-9-hero – 1280 x 720 size and creates the files correctly after regenerating. However, the theme’s single post template still ignores the filter and continues to display the old default cropped image.
My question is:
In the latest version of Enfold, what is the definitive and correct method to ensure the featured image on a single post page is displayed at a custom 16:9 ratio?
Thank you very much for your help.
Kind regards,
Davidwhere did you found that filter: avf_post_featured_image_size ?
to bring that new added image format to the lists where you can choose the source you can use:
Edit: ok. there seems to be changed a lot on those filters – on my actual enfold theme my solution brings some errors.
add_action( 'after_setup_theme', 'my_custom_enfold_image_sizes' ); function my_custom_enfold_image_sizes() { add_image_size( 'custom-16-9-hero', 1280, 720, true ); } add_filter( 'image_size_names_choose', 'my_custom_enfold_image_size_names' ); function my_custom_enfold_image_size_names( $sizes ) { return array_merge( $sizes, array( 'custom-16-9-hero' => __( 'My Custom Featured Image' ), ) ); }Hi, thank you for your reply. I was literally just able to do it with this code:
function avf_customization_modify_thumb_size( $size ) { $size['entry_without_sidebar'] = array( 'width' => 9999, 'height' => 9999 ); $size['entry_with_sidebar'] = array( 'width' => 9999, 'height' => 9999 ); return $size; } add_filter( 'avf_modify_thumb_size', 'avf_customization_modify_thumb_size', 10, 1 );and then the regenerate thumbnails plugin worked with these new sizes.
and then i also added this in custom css, to make it fit the content area for large screens
@media only screen and (min-width: 990px) { #main > div.container_wrap.container_wrap_first.main_color.fullsize > div > main > article > div.big-preview.single-big { max-width: 800px; margin-left: auto !important; margin-right: auto !important; } }(is the css code proper? – it works for me right now but the selector is very long)
I think this php issue is solved for now. Thank you very much!!
Kind regards,
Davidthe thumbs used in elements ( masonry, or news widget, blog etc.) can be influenced by filters.
f.e.:
function custom_post_featured_image_link( $image_link, array $current_post, $size ){ if(is_single()){ $image_link = get_the_post_thumbnail( $current_post['the_id'], 'medium' ); /**** or medium, square etc. ***/ } return $image_link; // echo $image_link; if you want to get rid of link function } add_filter( 'avf_post_featured_image_link', 'custom_post_featured_image_link', 10, 3 );or in widgets ( just inspect what number they get on the sidebar)
function my_avf_newsbox_image_size( $image_size, array $args, array $instance ){ if( $args['widget_id'] == ( 'portfoliobox-3' || 'newsbox-2' || 'newsbox-4' ) ){ $image_size = 'square'; } return $image_size; } add_filter( 'avf_newsbox_image_size', 'my_avf_newsbox_image_size', 10, 3 );in combo-box:
function custom_avf_combo_box_image_size( $size, $args ){ return 'square'; } add_filter( 'avf_combo_box_image_size', 'custom_avf_combo_box_image_size', 10, 2 );you can influence in post-slider depending on context
add_filter("avf_post_slider_args", function($atts, $context) { if( $context == "index" ) { $atts['type'] = 'grid'; $atts['columns'] = 3; $atts['preview_mode'] = 'custom'; $atts['image_size'] = 'gallery'; $atts['contents'] = 'excerpt_read_more'; } if( $context == "archive" ) { $atts['type'] = 'grid'; $atts['columns'] = 4; $atts['preview_mode'] = 'custom'; $atts['image_size'] = 'gallery'; $atts['contents'] = 'excerpt_read_more'; } if( $context == "tag" ) { $atts['type'] = 'grid'; $atts['columns'] = 3; $atts['preview_mode'] = 'custom'; $atts['image_size'] = 'entry_with_sidebar'; $atts['contents'] = 'excerpt_read_more'; } return $atts; }, 10, 2);
- You must be logged in to reply to this topic.