Continue Browsing button help

Highlighted
New Member
2 0 0

Hello Shopify Community,

I was wondering if anyone can help me with the Continue Browsing button. When I click this button, it still stays on the same page. But when I click twice, it takes me to the previous item/page, which is what I want. I just want to be able to click this button once.

Here is the link to my Shopify store's empty cart: https://necessitiesto.myshopify.com/cart

------------------------------------------------------------------------------------------------

Here is the cart-template.liquid code:

<div data-section-id="{{ section.id }}" data-section-type="cart">
<div class="page-width">
{% if cart.item_count > 0 %}

<h1 class="small--text-center">{{ 'cart.general.title' | t }}</h1>
<form action="{{ routes.cart_url }}" method="post" novalidate class="cart">
<table class="responsive-table cart-table">
<thead class="cart__row visually-hidden">
<th colspan="2">{{ 'cart.label.product' | t }}</th>
<th>{{ 'cart.label.quantity' | t }}</th>
<th>{{ 'cart.label.total' | t }}</th>
</thead>
<tbody id="CartProducts">
{% for item in cart.items %}
<tr class="cart__row responsive-table__row">
<td class="cart__cell--image text-center">
<a href="{{ item.url | within: collections.all }}" class="cart__image">
<img src="{{ item | img_url: '240x240' }}" alt="{{ item.title | escape }}">
</a>
</td>
<td>
<a href="{{ item.url }}" class="h5">
{{ item.product.title }}
</a>
{% unless item.variant.title contains 'Default' %}
<p>{{ item.variant.title }}</p>
{% endunless %}

{% assign property_size = item.properties | size %}
{% if property_size > 0 %}
{% for p in item.properties %}
{% assign first_character_in_key = p.first | truncate: 1, '' %}
{% unless p.last == blank or first_character_in_key == '_' %}
{{ p.first }}:
{% if p.last contains '/uploads/' %}
<a href="{{ p.last }}">{{ p.last | split: '/' | last }}</a>
{% else %}
{{ p.last }}
{% endif %}

{% endunless %}
{% endfor %}
{% endif %}

<p>
<a href="{{ routes.cart_change_url }}?line={{ forloop.index }}&amp;quantity=0">{{ 'cart.general.remove' | t }}</a>
</p>
</td>
<td class="cart__cell--quantity">
<label for="Updates_{{ item.key }}" class="cart__quantity-label medium-up--hide">{{ 'cart.label.quantity' | t }}</label>
<input type="number" name="updates[]" id="Updates_{{ item.key }}" class="cart__quantity" value="{{ item.quantity }}" min="0" data-line="{{ forloop.index }}" aria-label="{{ 'cart.label.quantity' | t }}">
</td>
<td class="cart__cell--total">
{%- if item.original_line_price != item.final_line_price -%}
<span class="visually-hidden">{{ 'products.product.regular_price' | t }}</span>
<del class="cart__item-total">{{ item.original_line_price | money }}</del>
<span class="visually-hidden">{{ 'products.product.sale_price' | t }}</span>
<span class="cart__item-total">{{ item.final_line_price | money }}</span>
{%- else -%}
<span class="cart__item-total">{{ item.original_line_price | money }}</span>
{%- endif -%}
{%- if item.unit_price_measurement -%}
{% include 'product-unit-price', product_variant: item %}
{%- endif -%}

{%- if item.line_level_discount_allocations != blank -%}
<ul class="order-discount order-discount--cart order-discount--list order-discount--title" aria-label="{{ 'customer.order.discount' | t }}">
{%- for discount_allocation in item.line_level_discount_allocations -%}
<li class="order-discount__item">
{%- include 'icon-saletag' -%}{{ discount_allocation.discount_application.title }} (-{{ discount_allocation.amount | money }})
</li>
{%- endfor -%}
</ul>
{%- endif -%}
</td>
</tr>
{% endfor %}
</tbody>
</table>
<div class="grid cart__row">
{% if section.settings.cart_notes_enable %}
<div class="grid__item medium-up--one-half">
<label for="CartSpecialInstructions">{{ 'cart.general.note' | t }}</label>
<textarea name="note" id="CartSpecialInstructions" class="cart__note">{{ cart.note }}</textarea>
</div>
{% endif %}
<div class="grid__item cart__buttons text-right small--text-center{% if section.settings.cart_notes_enable %} medium-up--one-half{% endif %}">

<div id="CartFooter">
{%- if cart.cart_level_discount_applications != blank -%}
<div id="cartDiscountTotal" class="order-discount-cart-wrapper">
{%- for discount_application in cart.cart_level_discount_applications -%}
<span class="order-discount order-discount--title order-discount--cart">
{%- include 'icon-saletag' -%}<span class="visually-hidden">{{ 'customer.order.discount' | t }}:</span><span data-cart-discount-title>{{- discount_application.title -}}</span>
</span>
<span class="order-discount order-discount--cart"><strong>-<span data-cart-discount-amount>{{ discount_application.total_allocated_amount | money }}</span></strong></span>
{%- endfor -%}
</div>
{%- endif -%}

<p class="h3 cart__subtotal" id="CartSubtotal">{{ cart.total_price | money }}</p>
</div>

{%- capture taxes_shipping_checkout -%}
{%- if shop.taxes_included and shop.shipping_policy.body != blank -%}
{{ 'cart.general.taxes_included_and_shipping_policy_html' | t: link: shop.shipping_policy.url }}
{%- elsif shop.taxes_included -%}
{{ 'cart.general.taxes_included_but_shipping_at_checkout' | t }}
{%- elsif shop.shipping_policy.body != blank -%}
{{ 'cart.general.taxes_and_shipping_policy_at_checkout_html' | t: link: shop.shipping_policy.url }}
{%- else -%}
{{ 'cart.general.taxes_and_shipping_at_checkout' | t }}
{%- endif -%}
{%- endcapture -%}

<p class="cart__taxes rte">{{ taxes_shipping_checkout }}</p>
<button type="submit" name="update" class="btn--secondary update-cart">{{ 'cart.general.update' | t }}</button>
<button type="submit" name="checkout" class="btn">{{ 'cart.general.checkout' | t }}</button>
<a href="javascript&colon;history.back()" title="Continue shopping" class="btn">Continue Shopping</a>
</div>
</div>
</form>
{% else %}
<div class="page-empty text-center">
<h1>{{ 'cart.general.title' | t }}</h1>
<p class="cart--empty-message">{{ 'cart.general.empty' | t }}</p>
<hr>
<p class="cart--continue-message">

<a href="javascript&colon;history.back()" title="Continue Browsing" class="btn">Continue Browsing</a>
</p>
<p class="cart--cookie-message">{{ 'cart.general.cookies_required' | t }}</p>
</div>
{% endif %}
</div>

<script id="CartProductTemplate" type="text/template">
{% raw %}
{{#items}}
<tr class="cart__row responsive-table__row">
<td class="cart__cell--image text-center">
<a href="{{ url }}" class="cart__image">
<img src="{{ img }}" alt="{{ name }}">
</a>
</td>
<td>
<a href="{{ url }}" class="h5">
{{{ name }}}
</a>
{{#if variation}}
<p>{{variation}}</p>
{{/if}}

{{#properties}}
{{#each this}}
{{#if this}}
<p>{{@key}}: {{this}}</p>
{{/if}}
{{/each}}
{{/properties}}

<p>
<a href="{% endraw %}{{ routes.cart_change_url }}{% raw %}?line={{ line }}&amp;quantity=0">{% endraw %}{{ 'cart.general.remove' | t }}{% raw %}</a>
</p>
</td>
<td class="cart__cell--quantity">
<label for="Updates_{{ key }}" class="cart__quantity-label medium-up--hide">
{% endraw %}{{ 'cart.label.quantity' | t }}{% raw %}</label>
<input type="number" name="updates[]" id="Updates_{{ key }}" value="{{ itemQty }}" min="0" data-line="{{ line }}" aria-label="{% endraw %}{{ 'cart.label.quantity' | t }}{% raw %}">
</td>
<td class="cart__cell--total">
{{#if discountsApplied}}
<span class="visually-hidden">{% endraw %}{{ 'products.product.regular_price' | t }}{% raw %}</span>
<del class="cart__item-total">{{{originalLinePrice}}}</del>
<span class="visually-hidden">{% endraw %}{{ 'products.product.sale_price' | t }}{% raw %}</span>
<span class="cart__item-total">{{{linePrice}}}</span>
{{else}}
<span class="cart__item-total">{{{originalLinePrice}}}</span>
{{/if}}
{{#if discountsApplied}}
<ul class="order-discount order-discount--cart order-discount--list order-discount--title" aria-label="{% endraw %}{{ 'customer.order.discount' | t }}{% raw %}">
{{#each discounts}}
<li class="order-discount__item">
{% endraw %}{%- include 'icon-saletag' -%}{% raw %}{{ this.discount_application.title }} (-{{{ this.formattedAmount }}})
</li>
{{/each}}
</ul>
{{/if}}
{{#if unitPrice}}
<span class="visually-hidden">{% endraw %}{{ 'products.product.unit_price_label' | t }}{% raw %}</span>
<span class="product-unit-price">
{% endraw %}
{%- capture unit_price_separator -%}
<span aria-hidden="true">/</span><span class="visually-hidden">&nbsp;{{ 'general.accessibility.unit_price_separator' | t }}&nbsp;</span>
{%- endcapture -%}
{% raw %}

<span>{{{ unitPrice.price }}}</span>{% endraw %}{{- unit_price_separator -}}{% raw %}{{#if unitPrice.addRefererenceValue }}{{{ unitPrice.reference_value }}}{{/if}}{{{ unitPrice.reference_unit }}}
</span>
{{/if}}
</td>
</tr>
{{/items}}
{% endraw %}
</script>

<script id="CartFooterTemplate" type="text/template">
{% raw %}
{{#if cartDiscountsApplied}}
<div id="cartDiscountTotal" class="order-discount-cart-wrapper">
{{#each cartDiscounts}}
<span class="order-discount order-discount--title order-discount--cart">
{% endraw %}{%- include 'icon-saletag' -%}<span class="visually-hidden">{{ 'customer.order.discount' | t }}{% raw %}:</span>{{ this.title }}
</span>
<span class="order-discount order-discount--cart"><strong>-{{{ this.formattedAmount }}}</strong></span>
{{/each}}
</div>
{{/if}}
<p class="h3 cart__subtotal" id="CartSubtotal">{{{totalPrice}}}</p>
{% endraw %}
</script>
</div>

<script type="application/json" id="CartJson-{{ section.id }}">
{{ cart | json }}
</script>

 

------------------------------------------------------------------------------------------------------------------------------------------

And here is the theme.liquid code:

<!doctype html>
<html class="no-js" lang="{{ shop.locale }}">
<head>

<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,initial-scale=1">
<meta name="theme-color" content="{{ settings.color_header_bg }}">

{% if settings.favicon != blank %}
<link rel="shortcut icon" href="{{ settings.favicon | img_url: '32x32' }}" type="image/png">
{% endif %}

<link rel="canonical" href="{{ canonical_url }}">
<title>
{{ page_title }}{% if current_tags %}{% assign meta_tags = current_tags | join: ', ' %} &ndash; {{ 'general.meta.tags' | t: tags: meta_tags }}{% endif %}{% if current_page != 1 %} &ndash; {{ 'general.meta.page' | t: page: current_page }}{% endif %}{% unless page_title contains shop.name %} &ndash; {{ shop.name }}{% endunless %}
</title>

{% if page_description %}
<meta name="description" content="{{ page_description | escape }}">
{% endif %}

{% include 'social-meta-tags' %}

<script>
document.documentElement.className = document.documentElement.className.replace('no-js', 'js');
</script>

{{ 'theme.scss.css' | asset_url | stylesheet_tag }}

<script>
window.theme = window.theme || {};

theme.strings = {
stockAvailable: {{ 'products.product.stock_available' | t: count: '1' | json }},
addToCart: {{ 'products.product.add_to_cart' | t | json }},
soldOut: {{ 'products.product.sold_out' | t | json }},
unavailable: {{ 'products.product.unavailable' | t | json }},
noStockAvailable: {{ 'products.product.stock_unavailable' | t | json }},
willNotShipUntil: {{ 'products.product.will_not_ship_until' | t: date: '[date]' | json }},
willBeInStockAfter: {{ 'products.product.will_be_in_stock_after' | t: date: '[date]' | json }},
totalCartDiscount: {{ 'cart.general.savings_html' | t: price: '[savings]' | json }},
addressError: {{ 'sections.map.address_error' | t | json }},
addressNoResults: {{ 'sections.map.address_no_results' | t | json }},
addressQueryLimit: {{ 'sections.map.address_query_limit_html' | t | json }},
authError: {{ 'sections.map.auth_error_html' | t | json }},
slideNumber: {{ 'homepage.hero.slide_number' | t: slide_number: '[slide_number]' | json }}
};
</script>

<script src="{{ 'lazysizes.min.js' | asset_url }}" async="async"></script>

{% if request.page_type contains 'customers/' %}
<script src="{{ 'shopify_common.js' | shopify_asset_url }}" defer="defer"></script>
{% endif %}

<script src="{{ 'vendor.js' | asset_url }}" defer="defer"></script>

{% if request.page_type == 'product' or request.page_type == 'cart' or request.page_type == 'index' %}
<script>
window.theme = window.theme || {};
theme.moneyFormat = {{ shop.money_format | json }};
</script>
{% endif %}

<script src="{{ 'theme.js' | asset_url }}" defer="defer"></script>

{{ content_for_header }}
</head>

<body class="template-{{ request.page_type | handle }}" >

<a class="in-page-link visually-hidden skip-link" href="#MainContent">
{{ 'general.accessibility.skip_to_content' | t }}
</a>

{% section 'header' %}

<div class="page-container page-element is-moved-by-drawer">
<main class="main-content" id="MainContent" role="main">
{{ content_for_layout }}
</main>

{% section 'footer' %}
</div>

<script id="QuantityTemplate" type="text/template">
{% raw %}
<div class="js-qty">
<input type="text" value="{{ value }}" id="{{ key }}" name="{{ name }}" pattern="[0-9]*" data-line="{{ line }}" class="js-qty__input" aria-live="polite">
<button type="button" class="js-qty__adjust js-qty__adjust--minus" aria-label="{% endraw %}{{ 'cart.label.decrease_quantity' | t }}{% raw %}">
{% endraw %}{% include 'icon-minus' %}{% raw %}
<span class="icon__fallback-text">−</span>
</button>
<button type="button" class="js-qty__adjust js-qty__adjust--plus" aria-label="{% endraw %}{{ 'cart.label.increase_quantity' | t }}{% raw %}">
{% endraw %}{% include 'icon-plus' %}{% raw %}
<span class="icon__fallback-text">+</span>
</button>
</div>
{% endraw %}
</script>

{% if request.page_type == 'product' %}
<div id="ProductModal" class="modal">
<div class="modal__inner">
<img src="" id="ProductZoomImg" class="product-modal__image">
</div>
<button type="button" class="modal__close js-modal-close text-link">
{% include 'icon-close' %}
<span class="icon__fallback-text">{{ 'general.accessibility.close_modal' | t | json }}</span>
</button>
</div>
{% endif %}

<ul hidden>
<li id="a11y-refresh-page-message">{{ 'general.accessibility.refresh_page' | t }}</li>
<li id="a11y-selection-message">{{ 'general.accessibility.selection_help' | t }}</li>
<li id="a11y-slideshow-info">{{- 'homepage.hero.navigation_instructions' | t -}}</li>
</ul>
<script>
if(Storage !== undefined) {

var defaultLink = "/collections/all";

{% if template contains 'collection' %}
sessionStorage.collection = "{{ collection.url }}";
{% endif %}

{% if template contains 'cart' %}
if( !sessionStorage.collection ) {
sessionStorage.collection = defaultLink;
}
document.getElementById("continue-shopping").href = sessionStorage.collection;
{% endif %}

}
</script>
</body>
</html>

Hope someone can help me with this.

Thanks in advance,

Anna

0 Likes
Highlighted

Hello @annato 

I just tested on chrome (ios), and I do not reproduce the problem. can you specify browser and version please

Thx

Belgacem Ben ltaif
Web consultant /Shopify Expert/ CTO Powerful Consulting
If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
https://about.me/benltaif
0 Likes
Highlighted
New Member
2 0 0

The browser is Google Chrome Version 79.0.3945.88 for IOS

0 Likes