Sign in

Questions about {{#each}} with posts & featuredPosts

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #3244
    Niketas

    Hi! I’m creating an header that show only the 3 latest featured posts but I have some problem.

    That’s the template: https://postimg.cc/N5yTKFT4

    The big image is the latest featured post and the other two are the 2° and the 3° latest featured posts. How can I recreate that with {{#each featuredPosts}} ?

    As you can see the big and the small sections have different css, but how can I tell to Publii to show the latest as big and the other two as small?

     

     

    #3248
    BobBob
    Support

    You can do this by checking the order of the posts and applying the correct image size:

    {{#if featuredPosts}}
        <ol class="container">
            {{#each featuredPosts}}
                <li>
                    {{#featuredImage}}
                        {{#if url}}
                            <img
                                {{#checkIf @index '==' 0}}
                                   src="{{urlLg}}"
                                {{else}}
                                   src="{{urlXs}}"
                                {{/checkIf}}
                                {{#if @config.site.responsiveImages}}
                                   {{responsiveImageAttributes 'featuredImage' srcset.listing sizes.listing}}
                                {{/if}}
                                {{ lazyload "lazy" }}
                                height="{{height}}"
                                width="{{width}}"
                                alt="{{alt}}">
                        {{/if}}
                    {{/featuredImage}}
                </li>
            {{/each}}
        </ol>
    {{/if}}
    

    More about the image settings:  https://getpublii.com/dev/how-images-work-in-publii/#advanced

    --
    Do you appreciate the support you've received today? If so, consider donating to the Publii team by clicking here; we'll be sure to use your donation to make Publii even better!

    #3266
    Niketas

    Thank you Bob! I’m trying to create an internal search bar without google custom search. I did it creating a js function that filter an {{#each posts}} list but I have a problem. The {{#each posts}} work perfectly in the homepage but it wont work in other pages. There is a way to create a list of each post in a different page ( such as a blog post ) ?

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