Featured post showing twice on index.hbs

Themes
1

With the following code, I get my styled featured post and then a second one after.
{{!< default}}

<div class="page-hwrap page-vwrap index">
  {{#foreach posts limit="5"}}
    {{#if featured}}
    <div class="post featured" style="
      {{#if feature_image}}
           background-image: url('{{img_url feature_image}}'); background-size: cover; background-position: center; background-repeat: no-repeat;">
      {{/if}}
        <div class="post--contents">
          <p class="post--is-featured">Featured Post</p>
          <h1 class="post--title">{{title}}</h1>
          <p class="post--author--date">By {{author}} on 23/07/2018</p>
          <p class="excerpt">{{excerpt}}</p>
        </div>
      </div>
    {{/if}}
    <div class="post">
      <div class="post--contents">
        <h1 class="post--title">{{title}}</h1>
        <p class="post--author--date">By {{author}} on 23/07/2018</p>
        <p class="excerpt">{{excerpt}}</p>
      </div>
    </div>
  {{/foreach}}
</div>

image

That is what happens. As you can see, “Welcome to Ghost” shows up twice. Someone help me out?

2

That makes sense since you add the featured post and then add it again. Try this:

<div class="page-hwrap page-vwrap index">
  {{#foreach posts limit="5"}}
    {{#if featured}}
    <div class="post featured" 
      {{#if feature_image}}
           style="background-image: url('{{img_url feature_image}}'); background-size: cover; background-position: center; background-repeat: no-repeat;">
      {{/if}}
        <div class="post--contents">
          <p class="post--is-featured">Featured Post</p>
          <h1 class="post--title">{{title}}</h1>
          <p class="post--author--date">By {{author}} on 23/07/2018</p>
          <p class="excerpt">{{excerpt}}</p>
        </div>
      </div>
    {{else}}
    <div class="post">
      <div class="post--contents">
        <h1 class="post--title">{{title}}</h1>
        <p class="post--author--date">By {{author}} on 23/07/2018</p>
        <p class="excerpt">{{excerpt}}</p>
      </div>
    </div>
    {{/if}}
  {{/foreach}}
</div>
3

Thanks, but I actually figured it out