Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • June 8, 2020 at 9:14 pm #1220649
    wrightella1

    I need to change the image crop/proportions for my blog posts as they are cutting off my images, here is an example, both on the individual posts page as well as the news feed post page see links in content links below

    thanks

    also – my fly out menu at the top is showing a different size when you hover on the genetics vs about menu at the top of the page, the genetics is showing up really large and I changed my menu a few weeks ago. I didnt make any changes to my menu appearance

    June 15, 2020 at 2:25 am #1222538
    Mike

    Hey wrightella1,
    Sorry for the late reply, you can modify the image sizes in the /enfold/functions.php file, starting at line 166.
    After making your changes you will have to Regenerate Thumbnails.

    For your burger menu font sizes, Please try this code in the General Styling > Quick CSS field or in the WordPress > Customize > Additional CSS field:

    @media only screen and (max-width: 990px) { 
	#top #wrap_all #av-burger-menu-ul span.avia-menu-text,#top #wrap_all #av-burger-menu-ul li {
		font-size: 16.5px !important;
	}
}

    After applying the css, Please clear your browser cache and check.

    Best regards,
    Mike

    June 22, 2020 at 6:34 pm #1224659
    Terve

    Hi Mike, can I just copy the whole thing line 166-205 to my functions.php in my child theme and change sizes and/or add a few more sizes?
    I do not want to mess with the parent themses functions.php. Will this copied and modified code in the child theme then override the code in the parent theme?

    June 24, 2020 at 11:48 am #1225144
    Mike

    Hi,
    Sorry for the late reply, that should work, please try.

    Best regards,
    Mike

    June 24, 2020 at 2:32 pm #1225224
    Terve

    Will do and report back, thanks Mike. This will probably take some days due to other priorities.

    June 25, 2020 at 10:12 am #1225432
    Terve

    Hi Mike, it worked almost perfectly and I need your further advice. I copied everything from line 166-205 which then included this at the end:

    Code >>>>

    avia_backend_add_thumbnail_size($avia_config);

    if ( ! isset( $content_width ) ) $content_width = $avia_config[‘imgSize’][‘featured’][‘width’];

    <<<< Code

    When I saved I got an error that function avia_backend_add_thumbnail_size was undefined (of course as I have not copied to my child theme)
    So, I commented it out just to test. The result is that the new image sizes I need is created perfectly, but I can’t choose them from the GUI. It must of course be because that function above is not run. I think maybe the most nice way to do this is to call the origignal function in the parent, but I am not quite sure how to do that. Then I am not sure exactely what the if condition does directly under the call of that function and what I should do with it.

    Feels like I am almost there, just need some more help…….

    June 27, 2020 at 10:03 pm #1226140
    Mike

    Hi,
    To create an image size try using this function instead in your functions.php

    add_image_size( 'small-square', 200, 200, true );
add_filter( 'image_size_names_choose', 'my_custom_sizes' );
function my_custom_sizes( $sizes ) {
    return array_merge( $sizes, array(
        'small-square' => __( 'Small Square' ),
    ) );
}

    For this example it creates the size small_square, 200px square and cropped, and then adds it to your image choices, just adjust for your size(s) and then Regenerate your Thumbnails.
    2020-06-27_155329.png

    Best regards,
    Mike

    June 29, 2020 at 9:46 am #1226336
    Terve

    Thanks Mike, that works perfectly! Below you can see my implementation of three new picture sizes (for other people too see that needs more than one):

    add_image_size( ‘Top-banner-mobile’, 414, 119, false ); /* Top banner for mobile as background image in color section */
    add_image_size( ‘eg-four-three’, 400, 300, true ); /* Cropped image to fit Essential grid 4:3 aspect ratio Mobile or > 2 column desktop */
    add_image_size( ‘eg-sixteen-nine’, 400, 225, true ); /* Cropped image to fit Essential grid 16:9 aspect ratio (video) Mobile or > 2 column desktop */

    add_filter( ‘image_size_names_choose’, ‘my_custom_sizes’ );

    function my_custom_sizes( $sizes ) {
    return array_merge( $sizes, array(
    ‘Top-banner-mobile’ => __( ‘Top Banner Mobile’ ), ‘eg-four-three’ => __( ‘Essential grid 4:3’ ),
    ‘eg-sixteen-nine’ => __( ‘Essential grid 16:9’ )) );
    }

    June 30, 2020 at 1:09 pm #1226727
    Mike

    Hi,
    Glad we were able to help and thanks for sharing your solution, we will close this now. Thank you for using Enfold.

    For your information, you can take a look at Enfold documentation here
    For any other questions or issues, feel free to start new threads in the Enfold forum and we will gladly try to help you :)

    Best regards,
    Mike

  • Author
    Posts
Viewing 9 posts - 1 through 9 (of 9 total)
  • The topic ‘image size proportions for the blog posts’ is closed to new replies.