Shopify themes, liquid, logos, and UX
Hey I am trying to redirect my ADD TO CART button to go straight to my cart page instead of staying on product page
below is my product.liquid code if anyone knows where/what I need to change!
I am using Debut theme
<!-- spurit_stp-added -->
{% include 'spurit_stp-product-snippet' %}
<!-- /spurit_stp-added -->
{% comment %}
The contents of the product.liquid template can be found in /sections/product-template.liquid
{% endcomment %}
{% section 'product-template' %}
{% section 'product-recommendations' %}
{% if collection %}
<div class="text-center return-link-wrapper page-width">
<a href="{{ collection.url }}" class="btn btn--secondary btn--has-icon-before return-link">
{% include 'icon-arrow-left' %}
{{ 'products.product.back_to_collection' | t: title: collection.title }}
</a>
</div>
{% endif %}
<script>
// Override default values of shop.strings for each template.
// Alternate product templates can change values of
// add to cart button, sold out, and unavailable states here.
theme.productStrings = {
addToCart: {{ 'products.product.add_to_cart' | t | json }},
soldOut: {{ 'products.product.sold_out' | t | json }},
unavailable: {{ 'products.product.unavailable' | t | json }}
}
</script>
{% assign current_variant = product.selected_or_first_available_variant %}
<script type="application/ld+json">
{
"@context": "http://schema.org/",
"@type": "Product",
"@id": {{ canonical_url | append: '#product' | json }},
"name": {{ product.title | json }},
"url": {{ shop.url | append: product.url | json }},
{%- if product.featured_image -%}
{%- assign image_size = product.featured_image.width | append: 'x' -%}
"image": [
{{ product.featured_image.src | img_url: image_size | prepend: "https:" | json }}
],
{%- endif -%}
"description": {{ product.description | strip_html | json }},
{%- if current_variant.sku != blank -%}
"sku": {{ current_variant.sku | json }},
{%- endif -%}
"brand": {
"@type": "Thing",
"name": {{ product.vendor | json }}
},
"offers": [
{%- for variant in product.variants -%}
{
"@type" : "Offer",
{%- if variant.sku != blank -%}
"sku": {{ variant.sku | json }},
{%- endif -%}
"availability" : "http://schema.org/{% if product.available %}InStock{% else %}OutOfStock{% endif %}",
"price" : {{ variant.price | divided_by: 100.00 | json }},
"priceCurrency" : {{ cart.currency.iso_code | json }},
"url" : {{ shop.url | append: variant.url | json }}
}{% unless forloop.last %},{% endunless %}
{%- endfor -%}
]
}
</script>
If you want to remove ajax add to cart and want to send user to cart page after add to cart then follow this:
1. open Section->product-template.liquid -> find class "product-form__cart-submit" and remove this class.
2. open Asset->theme.scss file add below code at bottom of page:
[name="add"]{width:100%;}
Hi, someone can help. How to change the setting of the "Add to cart" button. After adding to the cart, it immediately redirects to the cart, how to cancel it?
Which theme you have and send store url,
you have to find ajax cart function in asset->theme.js file where from you can set 'location.href="/cart" in success function.
As i can see you can not redirect to cart page after adding to cart.
No, this is exactly what I wanted, thanks, I found a solution to this problem.
I'm having issues with the same problem - add to cart doesn't go to cart page. Can anyone assist?
Send your store url
Hello I am having the exact same problem. I want my customers to click on "Add to Cart" and be redirected to "View Cart" page. How should I do it?
Send your store url
mart-prestige.myshopify.com/
Thanks a lot.
GO to Asset->theme.js file and find:
this._setupCartPopup(item);
Now comment it and add below code next to this line:
location.href='/cart';
Look like this:
Hi there,
I'm looking for the same thing, I would like to redirect people to the cart after clicking on Add To Cart. I have Narrative theme, can you help?
Website: https://boostedself.com/
Thank you
Hi @Blts03
Follow this:
1. Go to Theme editor
2. Open Theme setting tab
3. Go to "Cart drawer" and un-check "Show cart drawer" option and save.
Thanks that worked!!!
In future I will likely want to test taking them directly to checkout as apposed to the cart, how would I do that?
Cheers
You can enable "dynamic buy button" from theme editor->product page.
That take user to direct checkout, but if you want with add to cart button then need custom code.
Hi there,
i need the same for my store: la-pietra.myshopify.com
Can you help me?
Regards.
for your store need to check in code cant say direct much Js error may be affecting.
so may you need an access?
Yes, Pm me
Hide this line from product page.
<input type="hidden" name="return_to" value="back" />
Hey Jasoliya,
When the customer add to cart, I want them to be redirected right to the cart for easy checkout. Now it just adds the product to cart and the customer has to go to the cart page themself.
Can this be changed? Store url: visionstore.nl
Thanks alot!
Whats is cart functionality? where is button?
go to "Winkel" Choose a product.
Then "Toevoegen aan winkelmandje" <--- that is the add to cart button.
Hi @Jasoliya
Thanks for pointing at the right direction. Would mind having look at the Express theme as well, I am trying to do the same thing but just able to find the right place to comment it out and paste that redirect function (location.href='/cart';).
Below is the theme.js file code for your easy reference:
https://codeshare.io/2Kl698
Any help would be greatly appreciated.
HI @Jack2021
In this file i cant find add to cart function.
Send me store url
@Jasoliya here is my store link: https://www.halalproteins.com/products/halal-protein
Thanks.
I checked your file but you have theme.min file its minifiled file so cant do direct in file because all code minifield, so must need to manage it by custom code. so you have to hire developer for that.
gotcha its off the shelf they minified everything so really not user friendly at all.
by any chance this is the code?
function cartAddFromForm(formData) {
var config = getDefaultRequestConfig();
delete config.headers['Content-Type'];
config.method = 'POST';
config.body = formData;
return fetchJSON('/cart/add.js', config);
}
function cartChange(line, options) {
var config = getDefaultRequestConfig();
options = options || {};
config.method = 'POST';
config.body = JSON.stringify({
line: line,
quantity: options.quantity,
properties: options.properties
});
return fetchJSON('/cart/change.js', config);
}
I dont' think this part helpful because i thing its not for product page
somebody knows how to redirect to cartpage after add to cart ?
i am using debutify theme
thx
Send me your store url
You can find option in theme editor if you have. or you have minifield code on Js code so difficult to give you answer form this code.
i dont have this option in my theme editor
how i can change this code ?
i am searching since 2 hours 😞
Yes that's because you have minifield Js code that's difficult to manage may be need developer help if you cant.
where i can find developer help ?
On this need custom adjustment so you have to hire developer
Hi UmairA , i got the same issue with redirecting to cart after clicking add to cart. can you please help me ?
here is my store
Url : https://nisantasifashion.com/
Password : 1
Hi! Can You please help me. I want when someone clicks add to cart he directly reaches cart page or checkout page in mobile .
Hello Jasoliya,
I have the StartUp theme & i am also having the same issue. When pressing the 'Add to cart' button it stays on the same page, I'd like the user to go straight to the cart page once they actually hit the 'Add to cart' button. This is the URL: https://statik-store.myshopify.com/. Thank you
Send em password or store here or Pm me
sure its arnold1995 , Please let me know when youve had a look, thank you.
Hello @ArnoldEl ,
I see that you are using Startup theme, you can find the setting to Enable cart redirection at the theme customization settings page from admin dashboard. For that you need to go to
Online Store > Themes > Startup(Your Published Theme) > click Customize button
Then you'll land on home page inside theme editor with having the settings for sections included on the home page, Just click the section for Featured Product for you I think it will be of name
Extended Warrantee just click to expand it and scroll down to find a checkbox with label Enable cart redirection, now just check it and click save.
That's all you needed.
I hope this will be helpful.
Thanks,
Nitin
hello Nitin,
unfortunately i do not have any option like that, i have checked but nothing. I think i need to code it...
@ArnoldEl Oh I see may be you are not using the latest version of that theme. You can add a latest version of that theme from the theme store if you want.
Or if you want to continue with the current then yes code needs to be added for that.
Are you ready to take your business to the next level? Look no further than the latest ...
By SarahF_Shopify Apr 15, 2024We’re keeping the ball rolling to make sure you’re always ahead of the game. So buckle ...
By JasonH Apr 8, 2024Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024