I need to add watermark “FDA Class II Medical Device” to all my images in Shopify. I used watermark app in Shopify but it leaves alot of space. 1st photo
I want to the watermark to appear just below the image like the 2nd photo with slightly smaller font. Is there code that can be added to theme do this?
Theme code CANNOT EDIT image data, binary data, themes only serve images and do things like resizing.
The most theme code could do here is overlay a text element ; this in no way applies the text into the image itself so people could download the image without this overlayed text.
If you have specific placement requirements you really need to work out the process do this prior to uploading with bulk image editing tools.
There’s also batching this in photoshop with a macro if you have it, or the free GIMP editor with the batch plugin.
irfanview is another tool but a bit more complicated for the non-technical.
for the command line savvy use imagemagick
Otherwise continue to research apps and hope one has price& capabilities to match needs.
Or reach out if you need a custom app built if there’s a budget and a lot of custom business rules needed for the watermark.
Welcome to the Shopify Community! Please share your store URL and password (if it’s password-protected), so I can check and provide you with the exact solution.
Can you please tell me whether you’ve already added the watermark or want to add it?
Also, please send me a screenshot along with the URL of that page.
Go to: Online Store → Themes → Edit code
Open base.css (or theme.css) and paste this at the bottom:
.product-media--image img {
display: block;
}
.product-media--image::after {
content: "FDA Class II Medical Device";
display: block;
text-align: center;
font-size: 12px; /* adjust size */
margin-top: 4px; /* adjust space */
color: #333; /* adjust color */
font-weight: 600;
opacity: 0.85;
}
This will Display watermark text under every product image
Keep spacing minimal like your 2nd example
Not distort or resize images
Work on product page + zoom pop-up
Important Notes
This adds text overlay, not embedded watermark — image quality & SEO stay safe
The text is controlled globally → no need to edit 100s of images
If you ever change label (for compliance), you update one line
For collection pages too? Just let me know — I can apply it there as well.
If you’d like, I can:
Match exact typography style
Add a small icon (registered/certified mark)
Apply only on selected product types
Ensure mobile alignment is perfect
Feel free to reply — happy to help!
— Hammad | Shopify Developer (Theme Customization Specialist)
I added a watermark in the screenshot in original message. I wanted to see if i could place it right below the image. The photo with the beige image is an example of what i want. Might have to do code overlay but i’m not sure how to do that.
Dear, the watermark is attached to the image itself. You’ll need to check in the app you used to add the watermark — there should be an option there to adjust its position.