Shopify themes, liquid, logos, and UX
Hi, im having trouble changing the accent color of my abandoned cart email and inserting my logo as the header instead of just text of my store name. Here is my code:
{% capture email_title %}
{% if item_count == 1 %}
{% else %}
{% endif %}
{% endcapture %}
{% capture email_body %}
{% if billing_address.first_name %}
{% if item_count == 1 %}
<b>Yooo {{ billing_address.first_name }}</b>,
<br>
<br>
We saw you equipped something to your Arsenal but then you just left it sitting out to rust! We dont want it to rust so we're only going to reserve your item for a day or two.
<br>
<br>
If you decide to come back for it <b>put in the code "RUST" for 10% off your order!</b>
<br>
<br>
Have a nice day!
<br>- Sonic Weaponry Customer Support Team
{% else %}
<b>Yooo {{ billing_address.first_name }}</b>,
<br>
<br>
We saw you equipped some of our weaponry to your Arsenal but you forgot to take them home! If you leave them sitting in your Arsenal they might rust!
<br>
<br>
We dont want them to rust, so were gonna have to put them away in a day or two! If you see this email in time, <b>type in the code "RUST" at checkout to take them home for 10% off!</b><br>
<br>
Have a nice day!
<br>- Sonic Weaponry Arsenal Attendant
{% endif %}
{% else %}
{% if item_count == 1 %}
Yooo,
<br>
<br>
We saw you equipped something to your Arsenal but then you just left it sitting out to rust! We dont want it to rust so we're only going to reserve your item for a day or two.
<br>
<br>
If you decide to come back for it <b>put in the code "RUST" for 10% off your order!</b>
{% else %}
Yooo,
<br>
<br>
We saw you equipped some of our weaponry to your Arsenal but you forgot to take them home! If you leave them sitting in your Arsenal they might rust!
<br>
<br>
We dont want them to rust, so were gonna have to put them away in a day or two! If you see this email in time, <b>type in the code "RUST" at checkout to take them home for 10% off!</b>
{% endif %}
{% endif %}
{% endcapture %}
<!DOCTYPE html>
<html lang="en">
<head>
<title>{{ email_title }}</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" type="text/css" href="/assets/notifications/styles.css">
<style>
.button__cell { background: {{ shop.email_accent_color }}; }
a, a:hover, a:active, a:visited { color: {{ shop.email_accent_color }}; }
</style>
</head>
<body>
<table class="body">
<tr>
<td>
<table class="header row">
<tr>
<td class="header__cell">
<center>
<table class="container">
<tr>
<td>
<table class="row">
<tr>
<td class="shop-name__cell">
{%- if shop.email_logo_url %}
<img src="https://cdn.shopify.com/s/files/1/0571/1151/1240/files/sonicweap_perf_size_red_logo_6b4e9048-ad87-4e96-aac0-c763bd0e345e.png?v=1659076989" alt="Sonic Weaponry Logo" width="100">
{%- else %}
<h1 class="shop-name__text">
<a href="{{shop.url}}">{{ shop.name }}</a>
</h1>
{%- endif %}
</td>
</tr>
</table>
</td>
</tr>
</table>
</center>
</td>
</tr>
</table>
<table class="row content">
<tr>
<td class="content__cell">
<center>
<table class="container">
<tr>
<td>
<h2>{{ email_title }}</h2>
{% if custom_message != blank %}
<p>{{ custom_message }}</p>
{% else %}
<p>{{ email_body }}</p>
{% endif %}
<table class="row actions">
<tr>
<td class="empty-line"> </td>
</tr>
<tr>
<td class="actions__cell">
<table class="button main-action-cell">
<tr>
<td class="button__cell"><a href="{{ url }}" class="button__text">Items in your cart</a></td>
</tr>
</table>
{% if shop.url %}
<table class="link secondary-action-cell">
<tr>
<td class="link__cell">or <a href="{{ shop.url }}">Visit our store</a></td>
</tr>
</table>
{% endif %}
</td>
</tr>
</table>
</td>
</tr>
</table>
</center>
</td>
</tr>
</table>
<table class="row section">
<tr>
<td class="section__cell">
<center>
<table class="container">
<tr>
<td>
<h3>Complete your purchase</h3>
</td>
</tr>
</table>
<table class="container">
<tr>
<td>
<table class="row">
{% for line in subtotal_line_items %}
<tr class="order-list__item">
<td class="order-list__item__cell">
<table>
<td>
{% if line.image %}
<img src="{{ line | img_url: 'compact_cropped' }}" align="left" width="60" height="60" class="order-list__product-image"/>
{% endif %}
</td>
<td class="order-list__product-description-cell">
{% if line.product.title %}
{% assign line_title = line.product.title %}
{% else %}
{% assign line_title = line.title %}
{% endif %}
{% if line.quantity < line.quantity %}
{% capture line_display %} {{ line.quantity }} of {{ line.quantity }} {% endcapture %}
{% else %}
{% assign line_display = line.quantity %}
{% endif %}
<span class="order-list__item-title">{{ line_title }} × {{ line_display }}</span><br/>
{% if line.variant.title != 'Default Title' %}
<span class="order-list__item-variant">{{ line.variant.title }}</span><br/>
{% endif %}
{% if line.selling_plan_allocation %}
<span class="order-list__item-variant">{{ line.selling_plan_allocation.selling_plan.name }}</span><br/>
{% endif %}
{% if line.refunded_quantity > 0 %}
<span class="order-list__item-refunded">Refunded</span>
{% endif %}
{% if line.discount_allocations %}
{% for discount_allocation in line.discount_allocations %}
{% if discount_allocation.discount_application.target_selection != 'all' %}
<span class="order-list__item-discount-allocation">
<img src="{{ 'notifications/discounttag.png' | shopify_asset_url }}" width="18" height="18" class="discount-tag-icon" />
<span>
{{ discount_allocation.discount_application.title | upcase }}
(-{{ discount_allocation.amount | money }})
</span>
</span>
{% endif %}
{% endfor %}
{% endif %}
</td>
</table>
</td>
</tr>{% endfor %}
</table>
</td>
</tr>
</table>
</center>
</td>
</tr>
</table>
<table class="row footer">
<tr>
<td class="footer__cell">
<center>
<table class="container">
<tr>
<td>
<p class="disclaimer__subtext">Don't want to receive cart reminders from us? <a href="{{ unsubscribe_url }}">Unsubscribe</a></p>
</td>
</tr>
</table>
</center>
</td>
</tr>
</table>
<img src="{{ 'notifications/spacer.png' | shopify_asset_url }}" class="spacer" height="1" />
</td>
</tr>
</table>
</body>
</html>
I thought I had inserted my logo properly but it isnt showing up in the preview
Hi @sonicweaponry,
Please find 'shop-name__cell' and change code here:
<td class="shop-name__cell">
{%- if shop.email_logo_url %}
<img src="https://cdn.shopify.com/s/files/1/0571/1151/1240/files/sonicweap_perf_size_red_logo_6b4e9048-ad87-4e96-aac0-c763bd0e345e.png?v=1659076989" alt="Sonic Weaponry Logo" width="100">
{%- else %}
<h1 class="shop-name__text">
<a href="{{shop.url}}">{{ shop.name }}</a>
</h1>
{%- endif %}
</td>
=>
<td class="shop-name__cell">
<img src="https://cdn.shopify.com/s/files/1/0571/1151/1240/files/sonicweap_perf_size_red_logo_6b4e9048-ad87-4e96-aac0-c763bd0e345e.png?v=1659076989" alt="Sonic Weaponry Logo" width="100">
</td>
Hope it helps!
User | RANK |
---|---|
210 | |
166 | |
70 | |
55 | |
53 |
Make the shift from discounts to donations, and witness your business not only thrive fina...
By Holly Dec 4, 2023On our Shopify Expert Marketplace, you can find many trusted third party developers and fr...
By Arno Nov 27, 2023You've downloaded the Search & Discovery app from the Shopify App store, and as you're ...
By Skye Nov 8, 2023