FROM CACHE - en_header

Move back to (collection); at top left of page? (Debut Theme)

Solved
GetOrchard
Excursionist
34 2 5

Hi There,

 

I am currently trying to move my back button to the top left of the page when viewing a product.

 

Currently I have it sitting at the Top left, but I would like it a bit more 'raised' off the picture and lined up with it.

I am trying to move it to the top left, in the middle of the picture and Footer. I have attached a picture with a red box outlining around where I want it.


tes.png

 

 

 

 

 

If anyone could help me would be greatly appreciated!

Accepted Solution (1)

Accepted Solutions
Ninthony
Shopify Partner
2272 342 967

This is an accepted solution.

You can add this to the bottom of your theme.css file in your assets folder:

.return-link-wrapper {
    margin-top: 0;
}

.return-link-wrapper .btn {
    margin-bottom: 40px;
}
If my solution helped you, please like it and accept it as the solution!
If you'd like to make any edits to your store, please send me a personal message and we can discuss what you'd like to accomplish 😄

View solution in original post

Replies 22 (22)
Ninthony
Shopify Partner
2272 342 967

If you can post your url and password if password protected we can probably give you some CSS to copy. You can find the password on Online Store > Preferences > Password Protection

If my solution helped you, please like it and accept it as the solution!
If you'd like to make any edits to your store, please send me a personal message and we can discuss what you'd like to accomplish 😄
hash777
Shopify Partner
168 9 23

@GetOrchard  Hi there, pls provide url to get solution.

THANKS

hash777
Shopify Partner
168 9 23

@GetOrchard  Hi there, I don't see the back button here.

7.PNG

Pls send the url where you shown the back button. 

THANKS

GetOrchard
Excursionist
34 2 5

Currently I'm just trying to lift the button up vertically a bit

hash777
Shopify Partner
168 9 23

@GetOrchard  may be you are in draft mode as i can't see button except in your screen shots.

Ninthony
Shopify Partner
2272 342 967

Your store is password protected, you can find the password in Online Store > Preferences > Password Protection -- we need it to see your store.

If my solution helped you, please like it and accept it as the solution!
If you'd like to make any edits to your store, please send me a personal message and we can discuss what you'd like to accomplish 😄
GetOrchard
Excursionist
34 2 5

Sorry password is frawgh

Ninthony
Shopify Partner
2272 342 967

I also do not see a button, you may be previewing a different theme where you have added this button?

Ninthony_0-1623877371132.png

 

If my solution helped you, please like it and accept it as the solution!
If you'd like to make any edits to your store, please send me a personal message and we can discuss what you'd like to accomplish 😄
GetOrchard
Excursionist
34 2 5

I changed product.liquid.

I moved 

<div id="backToCollection"></div>

on top of

 {% section 'product-template' %}
{% section 'product-recommendations' %}

 

and changed the div class to text-left:

if(showCollection) {
var backToCollectionHTML = '<div class="text-left return-link-wrapper page-width"><a href="' + theme.backToCollection.collection.link + '" class="btn btn--secondary btn--has-icon-before">{% include 'icon-arrow-left' %}{{ 'products.product.back_to_collection' | t }} ' + theme.backToCollection.collection.title + '</a></div>';
var backToCollectionContainer = document.getElementById('backToCollection');
backToCollectionContainer.insertAdjacentHTML('afterbegin', backToCollectionHTML);
}

 

 

 

GetOrchard
Excursionist
34 2 5

The button was already there I just moved it up in the product.liquid when you view an item

hash777
Shopify Partner
168 9 23

@GetOrchard  send the full screenshot of your laptop while you are trying to move button up, as you said. That might help.

THANKS

GetOrchard
Excursionist
34 2 5

I don't understand what you mean by this. What do you mean by trying to move it up? I'm editing the code to move it up. Do you want me to send a picture of the code ?

GetOrchard
Excursionist
34 2 5

In order for the button to pop up you have to go into a collection, click a product in there and when you are viewing the product the button will come up. 

So for example, I go into LG > G8 > Select any product > Product Page.

This is where the back button is displayed.

hash777
Shopify Partner
168 9 23

@GetOrchard  Yes pls send me screenshot of code where you are editing the code.

GetOrchard
Excursionist
34 2 5
hash777
Shopify Partner
168 9 23

@GetOrchard  ok you want button like this . RIGHT ?

8.PNG

GetOrchard
Excursionist
34 2 5