Hi,
Does anybody know how I could add information pop-ups to product pages on my Shopify store - in the same way as the Apple Store has them: https://www.apple.com/uk/shop/buy-iphone/iphone-15-pro
…like the ‘Need help choosing a model?’ grey box, so when the visitor clicks on the box a pop up appears containing information.
Is there an app that would do this? Or could someone tell me what code could achieve this?
Any help greatly appreciated!! Thanks in advance!
Hi @Losbeat ,
This is Theodore from PageFly - Shopify Page Builder App.
You can add info popups to your Shopify store product pages just like you would in an Apple Store using Shopify apps like "Pop Convert - Popups, Banners & quot; or “Popper - create smart popups” andquot;. These programs offer user-friendly interfaces with customizable options for creating different types of pop-ups, including for offers, collecting emails or providing specific product information. They integrate directly with Shopify, enabling easy deployment and management of your store and dashboard. If these applications do not meet your specific requirements, you can also consider custom coding custom solutions. However, this may require technical knowledge of HTML, CSS and JavaScript or the services of a professional developer. Whichever method you choose, it’s important to design your popups to match your brand and aesthetic, so they’re not distracting, and to carefully test their functionality and responsiveness across devices.
I’ll be so happy if my suggestion can help to solve your problem. If you have any further questions, please feel free to tell me.
Best regards,
Theodore | PageFly
Modals / popups customizations come up occasionally though implementation varies by theme so if there’s code you need to research your specific theme.
For a lot of themes this is done by customizing either a pre-existing “size-guide” block/section/feature , or repurposing newsletter popups or product quick view features.
If a theme already has a “size-guide” popup feature all you may need to do is change the wording assign a page with the relevant content to the feature and also probably use an alternate template per product to have per product info.
For apps also research FAQ apps or product specifications apps.
If you need this customization then contact me by email for services.
Contact info in forum signature.
ALWAYS please provide context, examples: store url, theme name, post url(s) , or any further detail in ALL correspondence.
You can definitely recreate something like that info popup on Shopify - where a small box opens a detailed explanation or guide when clicked.
There are two main ways:
1. Using code (if you’re comfortable with it):
You’d need to add some HTML for the trigger (like a button or text), then use CSS/JavaScript to create a modal popup that opens when clicked. Shopify themes support this, but it’ll require editing your product page template (usually in product.liquid) and adding a script for the modal behavior.
2. Using an app (much easier):
There are popup apps that let you design and place these without touching the code. For example, Elfsight’s Popup app can help you build a custom popup with text, images, links, etc. You just drop it on the product page where you want, and customize it from their editor - no dev skills needed.
This is especially handy if you want to manage multiple popups for different products or update info regularly.
Hope that helps! Let me know if you need help setting it up.
Cheers,
Elfsight Team