Items are being displayed duplicated

[Sunpills]

Hi Guys! I'm trying to use Klaviyo app for Shopify, and I have a list of items in a e-mail with liquid that are being displayed duplicated. I need some help in identifying why is it duplicated. The e-mail template code is below:

<table align="center" bgcolor="#F5F5F5" border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
	<tbody>
		<tr>
			<td align="center" valign="top">
			<table align="center" bgcolor="#FEFFFF" border="0" cellpadding="0" cellspacing="0" class="width_100" role="presentation" width="640">
				<tbody>
					<tr>
						<td align="center" class="edge" valign="top">
						<div style="margin:0 auto">
						<table align="center" border="0" cellpadding="0" cellspacing="0" class="deviceWidth" role="presentation" width="470">
							<tbody>
								<tr>
									<td height="15" style="mso-line-height-rule:exactly; line-height:15px; font-size:15px;">&nbsp;</td>
								</tr>
								<tr>
									<td align="center" valign="top">
                    {% for item in event.extra.fulfillments.0.line_items -%}
                      {%- for line_item in event.extra.line_items -%}
                        {%- if line_item.product_id == item.product_id %}
									<table align="center" border="0" cellpadding="0" cellspacing="0" class="deviceWidth" role="presentation" width="470">
										<tbody>
											<tr>
												<td align="center" style="font-family:Arial, Helvetica, sans-serif; font-size:16px; color:#010101; line-height:26px; font-weight:700; padding:0px 0px 15px 0px;" valign="top">ITEMS</td>
											</tr>
											<tr>
												<td align="center" style="padding:10px 0px 15px 0px;" valign="top">
												<table align="center" border="0" cellpadding="0" cellspacing="0" class="deviceWidth" role="presentation" width="470">
													<tbody>
														<tr>
															<td align="left" valign="middle" width="45%">
                              <img alt="Logo" border="0" height="126" src="{{ line_item.product.images.0.thumb_src }}" style="display:block; line-height:0;" width="126" /></td>
															<td align="center" valign="top" width="10%">&nbsp;</td>
															<td align="right" valign="middle" width="45%">
															<table align="center" border="0" cellpadding="0" cellspacing="0" class="deviceWidth" role="presentation" width="225">
																<tbody>
																	<tr>
																		<td align="right" style="font-family:Arial, Helvetica, sans-serif; font-size:15px; color:#010101; line-height:24px; font-weight:700;" valign="top">{{ line_item.product.title }}</td>
																	</tr>
																	<tr>
																		<td align="right" style="font-family:Arial, Helvetica, sans-serif; font-size:15px; color:#010101; line-height:24px; font-style:italic;" valign="top">{{ line_item.variant_title }}</td>
																	</tr>
																	<tr>
																		<td align="right" style="font-family:Arial, Helvetica, sans-serif; font-size:15px; color:#010101; line-height:24px;" valign="top">Quantity: {{ line_item.quantity | floatformat: 0 - }}<br />
																		${{ line_item.price | floatformat: 2 }}</td>
																	</tr>
																</tbody>
															</table>
															</td>
														</tr>
													</tbody>
												</table>
												</td>
											</tr>
                      {% endif -%}
                         {%- endfor %}
                            {%- endfor %}

there is this { % for % } that I'm not getting if it's correct or not

[NomtechSolution · Accepted solution]

To fix this issue, you need to close the nested {% for %} loop after the closing </tr> tag.

Here's the modified code with the proper loop closure:

{% for item in event.extra.fulfillments.0.line_items -%}
  {%- for line_item in event.extra.line_items -%}
    {%- if line_item.product_id == item.product_id %}
      <table align="center" border="0" cellpadding="0" cellspacing="0" class="deviceWidth" role="presentation" width="470">
        <tbody>
          <tr>
            <td align="center" style="font-family:Arial, Helvetica, sans-serif; font-size:16px; color:#010101; line-height:26px; font-weight:700; padding:0px 0px 15px 0px;" valign="top">ITEMS</td>
          </tr>
          <tr>
            <td align="center" style="padding:10px 0px 15px 0px;" valign="top">
              <table align="center" border="0" cellpadding="0" cellspacing="0" class="deviceWidth" role="presentation" width="470">
                <tbody>
                  <tr>
                    <td align="left" valign="middle" width="45%">
                      <img alt="Logo" border="0" height="126" src="{{ line_item.product.images.0.thumb_src }}" style="display:block; line-height:0;" width="126" />
                    </td>
                    <td align="center" valign="top" width="10%">&nbsp;</td>
                    <td align="right" valign="middle" width="45%">
                      <table align="center" border="0" cellpadding="0" cellspacing="0" class="deviceWidth" role="presentation" width="225">
                        <tbody>
                          <tr>
                            <td align="right" style="font-family:Arial, Helvetica, sans-serif; font-size:15px; color:#010101; line-height:24px; font-weight:700;" valign="top">{{ line_item.product.title }}</td>
                          </tr>
                          <tr>
                            <td align="right" style="font-family:Arial, Helvetica, sans-serif; font-size:15px; color:#010101; line-height:24px; font-style:italic;" valign="top">{{ line_item.variant_title }}</td>
                          </tr>
                          <tr>
                            <td align="right" style="font-family:Arial, Helvetica, sans-serif; font-size:15px; color:#010101; line-height:24px;" valign="top">Quantity: {{ line_item.quantity | floatformat: 0 }}<br />
                            ${{ line_item.price | floatformat: 2 }}</td>
                          </tr>
                        </tbody>
                      </table>
                    </td>
                  </tr>
                </tbody>
              </table>
            </td>
          </tr>
        </tbody>
      </table>
    {% endif %}
  {%- endfor %}
{%- endfor %}

[Sunpills]

I'll try it! Thank you very much!