I'm modifying someone else's code.
It started with one modal size chart that opens onClick to a Size Guide (I don't even think it's a button, but a link positioned in a table) button on the Product Pages. It's really just a table with data in it. It's a template called page.sizing.json, the snippet is called size-guide-modal.liquid. In the Section, the product-size-guide.liquid code is rendered.
Well, I've created another page template for a different product, so created another page template called page.sizing2.json, a snipped called size-guide-modal2.liquid and changed the product-size-guide.liquid code to match.
The new modal (title only) is displaying over the first modal (see screenshot attached).
Can some wonderfully knowledgeable person tell me what I'm missing?
To simply bring the old one behind the new one try setting its z-index lower than the new one in css. Also you may not have changed all of the values properly within the product-size-guide.liquid . Also I'm not too sure about the numbers in the file name best practice is to spell them out with something like modal-two.liquid try that as well. Hopefully this could help if not I can help trouble shoot further.
Do you mind sharing your website so we can take a look?
Sorry, if it were my site (still with the developer) I'd give you access. Are there any liquid files I can cut and paste to a doc you think might be the culprit?
I guess I'm adding a new modal to the existing structure. The developer created one page (dress sizes) and I'm trying to add another page I've created (vest sizes). So, on the dresses product pages when you click on Size Guide, the dress size modal pops up; on the vest product pages, the vest size modal should pop up. As you can see, when the Size Guide is clicked it brings up both pages, the popUpTitle (only) for the vests OVER the entire dress size guide. I want them to be two separate modals activated when dresses or vests are chosen. So, z-index isn't a factor here.
As I mentioned in my first post, in order to create another modal similar to the first, I've duplicated the code by:
I found pop-up-modal.liquid which called headings popUpTitle and popUpSubTitle -- do you think I should duplicate that for modal-two?
Both pages are being called when the Size Guide button (not a button) is clicked.
Thanks for your time,
Connect your PayPal account to allow your customers to checkout using the PayPal gateway a...By Ollie Jul 28, 2022