Shopify themes, liquid, logos, and UX
I switched to the Debut theme. On each product page, it shows that this is available for pickup with the address, which happens to be my home address. I want to continue to offer local pickup, but only show the information for those that actually purchase. As far as I can tell, there is no way to hide this. It is also ugly and adds more junk to the page.
I cannot figure out if I should go to settings within the theme, Shopify settings, product page settings in the theme (not there), or shipping options (not there) other than getting rid of the option to offer local pickup.
I just switched to Debut and spent a lot of time customizing it and keeping the same settings from the previous theme, but this feature is really bugging me that I have no control over it.
I don't mind using code but please don't suggest an app.
Can you provide a screenshot and your website URL. I will check and provide you solution here.
This is on EVERY product page. Totally extraneous and useless. I have no idea why this is a feature that seemingly has no way of being turned off. When you click on 'view store information' it links to a map in a pop up window. I hate this so much. I really do not understand why this is here. I just got rid of local pick up for now, which is a bummer, until I can find a way to remove this.
Please provide your store URL.
Hi, I am having the same problem. Did you figure it out?
A youtube video explaining exactly how to solve this issue. It worked for me.
I would like to know how to disable this, too.
Hi go to setting >Shipping and delivery> store local pick up "put it off"
Did you ever get this solved? I am also having this problem. Thanks!
Would love a solution for this as well. If we can't completely hide it, at least there has to be a way to choose the location that is shown on the product pages. I have 4 locations and there's 1 I would prefer to be shown (if it cannot be removed completely) but it seems to be picking a random location to display.
Agree that it's ugly and adds junk to the page, as the product description gets pushed down.
Hello,
I am also trying to solve this problem on my website. Did anyone find a solution?
Hi, our problem is the same, 4 locations and it's not working right plus this icon is hideous anyway.
Did anyone find another solution? The Out Of The Sandbox one doesn't work for the Impulse theme..
I am having the exact same issue. I have found a half-way fix by going into my theme > actions > edit languages. Then I just removed all the text from the fields that had the pick up note. However, i'm still left with this annoying green check mark on the product page. but it's better than all the text.
I'm looking for a solution to this bug as well. I want the 'in store pickup' available as a shipping option, but NOT on every product page.
Thanks
Matt
Matt, I am using the Turbo theme by Out of the Sandbox and they were able to tell me how to make that change in the theme code files (and it worked for me). This was their instructions:
"In your Online Store > Themes, click on the "Actions" dropdown and choose "Edit Code". When you're in the code editor, search for the styles.css.liquid (sometimes styles.scss.liquid) and scroll to the very bottom of that file. Paste the following code:
/* Remove local pickup information */
.surface-pick-up-embed {
display: none !important;
}
/* end */
"
Depending on what theme you have, the language of .surface-pick-up-embed might be a little different, but if you search pick up in your .css file, you should be able to figure out what the equivalent is in your theme.
looks like that did the trick. Don't know how the code worked, and was a little nervous putting it at the absolute bottom of the file, but voila.. 😉
Thanks
Matt
}
.surface-pick-up-embed {
display: none !important;
}
Did not work for me.... i pasted at the bottom of the style liquid file a you suggested. Any other suggestions?
Use below code in custom css. It should work.
/* Remove local pickup information */
.pickup-availability-button {
display: none !important;
}
/* end */
Nice, this worked for our Turbo theme as well. Thank you sharing!
Bit of an update for 2023. Go to your theme settings (the part where you do your live customization), scroll down to custom css and paste it there. It worked for me on Retina 7.1.0.
Hi all,
I think I found a solution. I am using the standard DEBUT theme by Shopify.
"In your Online Store > Themes, click on the "Actions" dropdown and choose "Edit Code". When you're in the code editor, search for the store-availability.liquid file in Sections and add the "comment" tag to the whole liquid file i.e.
add {% comment %} to the beginning of the file (first line)
and
add {% endcomment %} to the end of the file (last line)
So far have not found any residual effect, so try it and comment here if it affects other areas.
Voila! Enjoy!
This concept worked for me on Sense 14.0. It was the pickup-availability.liquid file for me though to remove it from the product page.
Thanks!
The solution posted by @RussellH (from OotS) is the correct way to do it.
Paste this at the bottom of your theme's CSS file (within the 'assets' section).
/* Remove local pickup information */
.surface-pick-up-embed {
display: none !important;
}
/* end */
If you're not using an OotS theme, then you may need to slightly edit the code. The part that says "surface-pick-up-embed" is what you would need to edit.
To find what that should be for your theme, go to the product page in Google chrome and then right-click on the element and select "inspect".
From there, you'll want to try and find the 'class' name, so that you can replace the 'surface-pick-up-embed' part.
This is how it looked for the theme I was working with:
So for this theme, the class was "store-availability" ... so I went ahead and edited the code to now be:
/* Remove local pickup information */
.store-availability {
display: none !important;
}
/* end */
... and now the section is hidden (not showing on product pages).
I hope this helps! 🙂
★ Did my post help? If yes, then please like and accept solution. ★
https://stephens.world
support@stephensworld.ca
Hi Stephen,
Thanks for your detailed instructions. The text is gone but the green tick is still showing, any way to remove? Ash
This works perfectly. Except for a little green check mark... Any suggestions on that ?
When using the Dawn theme, you should add the code to base.css
The class is: pickup-availability-info
So the code looks like:
/* Remove local pickup information */
.pickup-availability-info {
display: none !important;
}
/* end */
I contacted Shopify support for a solution. They have created an option to toggle the visibility of the pick-up info. The bad news is that this is custom made for my account. I have asked for the code or the make the solution available for the community, but that's not how it works, apparently. So what you can do is contact Support and ask for the adjustment (part of the Shopify Theme Support).
hey all! Solution for the dawn theme.
Simply change the
pickup-availability {
display: block;
}
to -->>>
pickup-availability {
display: none !important;
}
You can find the appropriate css file under Assests > Base CSS > component.pickup-availability.css
Hope it works!
Great, this works !! And it's an easy solution. Thanks.
This is the one, thank you!
Brilliant! Thanks mate
You have selected a class inside the container with the green checkbox. To hide all parts of the pickup availability look up the code to find the "larger" class. The green checkmark was an "m-svg-icon" for me, so 2 lines up was the class for the whole area of the webpage. Once I changed the class to the "larger" container, all of the components were hidden.
Totally agree. Putting this on each product page is an example of some programmer who doesn't actually use the product and thinks his/her "improvement" is helpful. It is not. Pickup should be an available option at checkout/shipping, not on the product page.
Thanks to prior comments, I was able to figure it out for debut theme.
To get rid of annoying local pickup option on product page:
In Online Store > Themes > Actions/Edit Code > Assets/theme.css, paste the following code at the bottom of the file (for debut theme):
/* Remove local pickup information */
.store-availability-information {
display: none !important;
}
/* end */
Tried many of the options above. This was the one that worked for the Focal theme.
I have two products in one listing one I make in my studio that has pickup, and one that is made at the local printer (no pickup) people were assuming the longer lead time item had the same lead time as my studio product because it said "pickup ready in 5+ days". They also read 5+ days as 1 week processing time, which it is actually 12 days. So it was causing disappointment. Thank goodness it is removed!! THANK YOU for this post.
Hi everyone,
Sorry I tried the above and it didnt work.
I am currently new and using dawn theme- hoping to not have my personal address visible online at check out for Local Pickup.
Was hoping to share the address once payment has been made.
Does anyone know what I need to do to make it happen?
Thank you for your help!
I just got it to work. I am using the update for the theme Dubut, but you can see if you have the same options in your code area. When you go into 'Edit Code', open 'assets', I had a section called 'pickup-availablity.jc. Pate in the new coding at the bottom of this page. This worked for me.
/* Remove local pickup information */
.store-availability-information {
display: none !important;
}
/* end */
Isn't it annoying?! I just customised my new theme too and noticed that my home address is on every product. I am now googling how I can delete this text.
Before people change the code, just check if your theme has a default product page in design view. I am using the Impulse theme. On the default product page, I just scrolled down to the block called "Buy buttons" which also contains the "Add to Cart" box. There was a box for "Enable pickup availability feature". I just unchecked that box and the store pickup address was no longer displayed on the product page.
Hey Community! As we jump into 2025, we want to give a big shout-out to all of you wh...
By JasonH Jan 7, 2025Hey Community! As the holiday season unfolds, we want to extend heartfelt thanks to a...
By JasonH Dec 6, 2024Dropshipping, a high-growth, $226 billion-dollar industry, remains a highly dynamic bus...
By JasonH Nov 27, 2024