Solved

Edit a product right from the product page?

stepis
Visitor
1 0 0

I used to have this nice black popup menu in the bottom of the page every time I would visit one of my product pages. This menu had a button "Edit Product" which would send me right to the product editing page in the Admin. Then I reinstalled my Windows, and now this popup menu is gone. Anyone know how to get it back? I'm using Debut theme.

Accepted Solution (1)

Don
Shopify Staff
2762 199 388

This is an accepted solution.

Hi there @stepis!

 

Don here from Shopify. 🙂

 

You might be referring to the online store preview mode, accessed whenever you click on the 'view' icon in your admin; such as beside the Online store sales channel or at the top of product pages in your admin.

 

This would allow you to see a preview of your storefront where you should still be able to see the black edit bar you refer to for editing your homepage, collection pages or product pages.

 

Check it out and see if you can still access that in this way!

 

 

Regards,

Don

Don | Social Care @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

View solution in original post

Replies 28 (28)

Don
Shopify Staff
2762 199 388

This is an accepted solution.

Hi there @stepis!

 

Don here from Shopify. 🙂

 

You might be referring to the online store preview mode, accessed whenever you click on the 'view' icon in your admin; such as beside the Online store sales channel or at the top of product pages in your admin.

 

This would allow you to see a preview of your storefront where you should still be able to see the black edit bar you refer to for editing your homepage, collection pages or product pages.

 

Check it out and see if you can still access that in this way!

 

 

Regards,

Don

Don | Social Care @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

seegang-berlin
Tourist
9 0 11

Hi - I'm logged-in, I went into preview and clicked through my store the link is:
https://vk20d8x1itmb86eb-28545286192.shopifypreview.com/collections/wedding/products/233
but I don't see any Edit button or similar. 
This is a very important function for me, which I used a lot on Etsy. How do I activate it?

Thank you - Jenny

 

seegang-berlin
Tourist
9 0 11

I have managed to make the front-end edit banner show up but unfortunately it comes and goes randomly.
I have no clue how to make it show up consistently.

Yes. I'm logged-in and Yes I have looked both at the Preview as well as the External view on my shop.

Jenny


 

MarcoM0857
Excursionist
34 0 115

@Don 

Although your reply was tagged as "Accepted Solution" it seems that it did not...

@stepis was referring to a same issue I am facing only in one of my PC although I use Chrome in both: Browsing my web in any page at the bottom of the screen should appear a (extremely useful) GRAY bar that allow to go to admin to "EDIT" that specific page.

This GRAY BAR does not appear in my (new) WIN10 PC.

I cleaned the PC (although was not necessary as it is just a few months old), I cleaned the Cookies, disables all extensions but NO success... The Gray bar does not appear.

I hope someone could help to supply step by step instructions how to solve this matter.

Thanks!

Arundas
Shopify Partner
72 3 96

You can create a customer account for yourself and give it an "admin" tag. Then check for the tag in your theme code to insert the Edit link. The following code can be inserted where you want the link to appear, in your product page Liquid file (product.liquid, product-template.liquid, etc.).

 

{% if customer and customer.tags contains 'admin' %}
<a href="/admin/products/{{product.id}}" target="_blank">Edit Product</a>
{% endif %}

 

When you are logged in to your own customer account, you will see the link. Others will not see this link, whether they are logged in or visiting as a guest.

See here for more details: https://community.shopify.com/c/Shopify-Design/Creating-an-Edit-Link-in-the-Product-template/m-p/175...

Note: target="_blank" will force the link to open in a new tab. That way you can close the tab when you're done saving changes and go back to the website. If you want it to open in the same tab, just remove this code.

If my reply helped you, please give it a Like and mark it as Accepted Solution.
Do you need help customizing your theme or editing code? Email me!
Arundas
Shopify Partner
72 3 96

I found another way to do this by looking for the presence of the dark Shopify icon or the dark Shopify admin bar on the website. This icon/bar shows up when you're logged in to your Shopify Admin console (I believe). This way you don't need to log in to a "customer account" tagged with "admin" as I said in the last reply.

<a id="product-admin-link" href="/admin/products/{{product.id}}" target="_blank" style="display: none;">Edit Product</a>
<script>
  $(function () { // when DOM is ready
    if($("iframe#admin-bar-iframe").length) {
      $("#product-admin-link").show();
    }
  });
</script>

 

TIP: You can combine both methods if you wish to. So that the link will appear either when the icon/bar shows up, or when you're logged in to your own customer account.

<a id="product-admin-link" href="/admin/products/{{product.id}}" target="_blank"
   {% unless customer and customer.tags contains 'admin' %}style="display: none;"{% endunless %}>Edit Product</a>
<script>
  $(function () { // when DOM is ready
    if($("iframe#admin-bar-iframe").length) {
      $("#product-admin-link").show();
    }
  });
</script>

 

Disclaimer: These code blocks are tested on Supply theme. Your mileage with other themes may vary.

If my reply helped you, please give it a Like and mark it as Accepted Solution.
Do you need help customizing your theme or editing code? Email me!
markengo
Visitor
1 0 13

I found the solution! From the admin page, you just click the view store shortcut and it pops back. Hope this helps!

Image 2020-10-29 at 2.35.13 AM.png

MarcoM0857
Excursionist
34 0 115

Not really...

MarcoM0857
Excursionist
34 0 115

Sorry... YES Markengo solution worked perfectly!

Karen_Preston
Tourist
6 0 10

Yes, this is exactly the view I browse my store through so I can edit immediately, and exactly what I can here to remember how I got there.

I use CHROME as my browser, and this behaves exactly as the initial inquiry is asking for.

OpenInternet
Visitor
1 0 0

It worked!!! Thank you very much.

NuGreen
Visitor
2 0 0

@markengo ON THE MONEY!!!!!! Please accept this digital kiss right on the face from me,

this has bugged me for a couple of years, now its sorted, well done you 🙂

JBBB
Visitor
1 0 0

Awesome this is the answer! 

houseofavi
Visitor
2 0 0

BINGO - thanks that solved it 🙂

 

lalahorse
Visitor
1 0 0

Yes! @markengo ! That is exactly right  🙂 Thank you for that solution to this very real problem 😘

lbf
Visitor
1 0 0

This is the one, thank you! 

gazmoz171
Shopify Partner
14 0 5

Hows this a solution?

Michael_1_2_3
Tourist
4 0 2

That worked!!!

adfuel
Excursionist
18 0 11

Thank you so much!  I've been so annoyed by this for months after clearing my cookies.  This is the actual solution everyone!!

namzhere
Visitor
1 0 0

@markengo Thank you! thank you so much! such a simple solution!
This feature is such a time saver to edit collections and products! 

johnguilbertc
Visitor
1 0 0

Thanks! This one works for me!

Holly131
Tourist
3 0 2

Unfortunately this doesn't always work

 

gazmoz171
Shopify Partner
14 0 5

Hi, sounds like would work prefect. However, Im not a developer and complete newbie. Can you please advise is slightly more detail? Many Thanks

chalanaviraj333
Shopify Partner
2 0 0

just follows @markengo reply

gazmoz171
Shopify Partner
14 0 5

How is that a solution whatsover. I think orig question was the so The "Edit product" button is always showing. So if your in and out of prods from admin and into preview, while in that prod preview you can click the "Edit Prod" button to go straight into said prods admin. Not just be in General admin press the eye button and then youve got the general "Edit" buttons bottom right while your in preview.

 

Surely a simple solution to this?

beastoked
Visitor
2 0 2

Don wth that was not an accepted solution. it wasnt even a solution.

M_S_D
Tourist
4 0 6
  • Using the Preview eye icon on either the theme page or the edit code page does not bring the product edit button back. Even if you close the browser completely and reopen.

  • Using the view your online store eye icon that appears when you hover over Online Store in the left-hand menu does not bring the edit button back. Even if you close the browser completely and reopen.

  • Logging out of the admin panel and back in has no effect. Even if you close the browser completely and reopen.

  • Clearing cookies and doing all of the above, each after clearing the cookies does not bring the button back.

Some of the above steps have worked for me in the past but do not currently work.

Probably a good idea to remove the big tick from the post purporting to be the solution as it doesn't seem to work anymore.

ian5991
Visitor
1 0 1

Yep, still no solved for me either, was always there, I know about the little eye to view online store, thats always worked before, but for whatever reason its doesnt want to work now.

 

My little eye next to online store is not blacked out though, its just an outline, I think this to do with it, but I dont know how to get it back, which sounds silly but its so annoying