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

    Hi,

    is it possible to show at the search results page:

    – a read more link below the manual/custom excerpt
    – the featured image (post thumbnail) of the posts?

    Thank you.

    #638826

    Concerning the featured image in search results, this solution from the forum works for me – partly:

    https://kriesi.at/support/topic/add-featured-image-to-search-results/#post-249161

    My custom CSS for this are:

    .search-result-counter {
        height: 100px;
        padding: 0;
        width: 100px;
    }
    .search-result-counter img {
    	width: 100%;
    	height: 100%;
    	border-radius: 100px;
    }
    #top .template-search.content .entry-content-wrapper { 
    	padding-left: 120px; 
    	}

    But the featured image, shown in the search counter is distorted/stretched instead of being cropped:

    and then take a look please here:

    <span class="search-result-counter ">
    <img class="attachment- size- wp-post-image" width="1310" height="400" sizes="(max-width: 1310px) 100vw, 1310px" srcset="https://xyz.de/studio/wp-content/uploads/sites/2/2016/05/slider_ambiente-mint_1310x400.jpg 1310w, https://xyz.de/studio/wp-content/uploads/sites/2/2016/05/slider_ambiente-mint_1310x400-300x92.jpg 300w, https://xyz.de/studio/wp-content/uploads/sites/2/2016/05/slider_ambiente-mint_1310x400-768x235.jpg 768w, https://xyz.de/studio/wp-content/uploads/sites/2/2016/05/slider_ambiente-mint_1310x400-1030x315.jpg 1030w, https://xyz.de/studio/wp-content/uploads/sites/2/2016/05/slider_ambiente-mint_1310x400-705x215.jpg 705w, https://xyz.de/studio/wp-content/uploads/sites/2/2016/05/slider_ambiente-mint_1310x400-450x137.jpg 450w" alt="slider_ambiente-mint_1310x400" src="https://xyz.de/studio/wp-content/uploads/sites/2/2016/05/slider_ambiente-mint_1310x400.jpg">
    </span>

    outputs obviously image sizes of:

    https://xyz.de/wp-content/uploads/sites/2/2016/05/slider_ambiente-mint_1310x400.jpg 1310w, 
    https://xyz.de/wp-content/uploads/sites/2/2016/05/slider_ambiente-mint_1310x400-300x92.jpg 300w, 
    https://xyz.de/wp-content/uploads/sites/2/2016/05/slider_ambiente-mint_1310x400-768x235.jpg 768w, 
    https://xyz.de/wp-content/uploads/sites/2/2016/05/slider_ambiente-mint_1310x400-1030x315.jpg 1030w, 
    https://xyz.de/wp-content/uploads/sites/2/2016/05/slider_ambiente-mint_1310x400-705x215.jpg 705w, 
    https://xyz.de/wp-content/uploads/sites/2/2016/05/slider_ambiente-mint_1310x400-450x137.jpg 450w

    I don’t know, where these image sizes, genereated there, are coming from.
    Here are all image sizes with my SimpleImageSizes-Plugin:

    But the custom CSS for the search-counter is 100x100px.
    I use the SimpleImageSizes-Plugin – but how should I “tell” the code snippet mentioned above, to use this 100x100px size for the image?

    Guess, this is the same problem, that someone had here – unfortunately not solved:

    The problem seems to be, that the featured image, that come to the search-counter are not properly rendered/cropped/made smaller …
    Interesting is, that in the search popup in the menu, the featured images are OK:

    Any idea please?
    Thank you.

    #639617

    Hi,

    Thank you for using Enfold.

    Regarding the image size, just look for this line of code:

    $searchthumb    = get_the_post_thumbnail( $post_id, $size, $attr );
    

    Replace the size attribute.

    Best regards,
    Ismael66

    #639746

    Thank you, Ismael, but what should I change there, dont’ understand, sorry …?

    For example, I could create an image size for the search thumbnail with the SimpleImageSize-Plugin, let’s say “searchthumb100” for example, which I could make 100x100px.
    But where and how in this line of code, you mentioned, should I add this new image size “searchthumb100”?

    #639866

    I got it, Ismael.
    I googled a bit and found this:
    https://developer.wordpress.org/reference/functions/get_the_post_thumbnail/

    So I used the SimpleImageSize-Plugin to create a search-thumbnail size; I called it “searchthumb100” with 100x100px size.

    Then in loop-search.php in line 33 I added this size:

    $searchthumb = get_the_post_thumbnail( $post_id, $size='searchthumb100', $attr );

    and it works fine now:

    Thanks for pointing me into the right direction.

    #640091

    Hi,

    Great, thanks for sharing. So you are all good now?

    Regards,
    Rikard

    #640249

    Thanks, Rikard, the only thing is for me still how to show a read more link below the manual/custom excerpt – see question (1) of my first post here. I wasn’t able to solve this, if you could assist me for this …
    Thank you.

    #640702

    Hi,

    Edit the loop-search.php file. Look for this code around line 99:

     echo $excerpt;
    

    .. replace it with:

     echo $excerpt;
    		    echo '
    <div class="read-more-link"><a href="'.get_permalink().'" class="more-link">'.__('Read more','avia_framework').'<span class="more-link-arrow">  &rarr;</span></a></div>
    ';
    

    Best regards,
    Ismael

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