Tagged: 

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #780016

    Hi!

    We have some troubles with the layout of the blog posts at the home page. We would like that the pictures from each post were displayed with the same size, but when the title of the post is shorter than 3 lines, the picture becomes larger. We have the preview size of the images set on Portfolio (495X400), but that seems to be ignored if the title of the post is short (as it happens with the first of the posts that are currently on our home page).

    Could you tell us how can we solve this?

    Thank you very much!

    #780527

    Hey itcerp,

    These images have different aspect ratio and different sizes. To get thumbnails that have the same size and same aspect ratio, you need images that are the same size and have the same aspect ratio.

    Best regards,
    Victoria

    #780574

    Hello Victoria,

    Thank you, we’ve changed the preview to large size and now they look the same. Now, we would like to ask you, if there is a way to change the distribution of the title and the text below the thumbnails, so they are located at the same height ( referring to the posts at the home page).

    Thank you!

    Regards!

    #782684

    Hi,

    Thank you for the update.

    Please add this script in the functions.php file.

    function ava_custom_script_fix(){
    ?>
    <script>
    (function($){
    	function c() {
    			var isMobile = '';
    			if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) && 'ontouchstart' in document.documentElement)
    			{
    				isMobile =  true;
    			}
    			else
    			{
    				isMobile =  false;
    			}
    
    			if(isMobile || window.innerWidth < 767) return;
    			 // reset height
    			 $('.slide-entry-title, .slide-entry-excerpt').removeAttr('style');
    			 
    			 // get an array of all element heights
    			 var elementHeights = $('.slide-entry-title, .slide-entry-excerpt').map(function() {
    					 return $(this).height();
    			 }).get();
    
    			 // Math.max takes a variable number of arguments
    			 // apply is equivalent to passing each height as an argument
    			 var maxHeight = Math.max.apply(null, elementHeights);
    	 
    			 // set each height to the max height
    			 $('.slide-entry-title, .slide-entry-excerpt').height(maxHeight);
    	 }
    
    	 $(window).on('debouncedresize', function() {
    			 c();
    	 });
    })(jQuery);
    </script>
    <?php
    }
    add_action('wp_footer', 'ava_custom_script_fix');

    Best regards,
    Ismael

    #782734

    Hi!

    We tried adding the script at the end, but nothing happen (the titles and texts below the thumbnails continue at different heights). Any ideas?

    Thank you very much! :)

    • This reply was modified 7 years, 8 months ago by itcerp.
    #783292

    Hi!

    It is working on our end. Please provide the login details here so that we can test the script.

    Cheers!
    Ismael

    #783373

    We are going to try an alternative! We let you know if it doesn’t work!

    Thank you very much for the help! :)

    #783775

    Hi,

    Thanks for the feedback, we’ll keep the thread open in case you should need any further help on the topic.

    Best regards,
    Rikard

Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.