skip to Main Content

Which ways are possible to edit the live preview of the product page in Shopify with Inputboxes next to it?

Let’s say the product is a poster, and i want to add a custom text on it.

When typing into the inputbox the text changes in real time on the product.

Can this be implemented in the shopify code with the basic version of shopify?

Or does this necessarily needs an app?

ADDITIONALLY:

Let me go a bit deeper. I have a code that can generate a QR code.
Now i want that the QR code to be previewed in the product. Now position and color of the QR code is different from any product. Would that need an app?

2

Answers


  1. Yes you can to an extent.

    First the ground rules:

    • You can’t modify the product from the front-end and update the content or media in the back-end – this would be a huge security hole
    • The changes applied to the product will be visible only to the user who changed them

    The solution is to use Javascript and update the content of the front-end. If you like to store the changes for that specific user you can save them as cookie or localstorage.

    If you like to share this change to other people you will need to add a custom parameter in the URL of the page and generate the content from it and share that url.

    Each one of these steps will require some custom Javascript that will affect only the user in question, if you like to modify the product in the back-end directly you will need some kind of an app for this.

    Login or Signup to reply.
  2. On my mind it can be done if the dynamic text is applied over product image.

    Detailed code would be too long to write here but here are the steps:

    HTH

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search