|| Add Instagram Logo Hover Image to Instagram Feed (Prestige 7.3.3 Theme)

[theithei]

Hi,
I am using the Prestige 7.3.3 theme with an instagram feed app. When you hover over an instagram image a nice dark and transparent overlay appears which is clickable and links to instagram. I’d like to insert a small centered white instagram logo on top of the overlay.

(left: right now without hover effect, middle: right now with hover effect, right: what I’d like it to look like)

https://wokr2cdb3udwp9g7-28196274313.shopifypreview.com

Any ideas?
Thanks in advance!

[Angel95]

Hello,

Step 1: Go to link https://instafeed.nfcube.com/assets/img/instagram-icon.svg and download file.
Then upload it in Assets: https://i.imgur.com/SVK32VY.png

• Step 2: Go to sections/feature-columns.liquid file and change all code. https://pastebin.com/djeh910Y
• Step 3: You can upload images in Customize: https://i.imgur.com/Jzs2nlu.png

And when you click on the instagram the fill color is white you can chnage the color according to your requirements https://prnt.sc/pogDhiwqg_im

Hope it clear to you.

Hope it clear to you.

[theithei]

hey,
it kind off works but not 100%…

1.) I don’t have the section ‘feature-columns.liquid’ just ‘featured-collections.liquid’ so I changed it there

2.) there is a new block with ‘Textspalten mit Fotos’ now and I can see the overlay with the instagram logo but it fills the whole width of the page and I am not able to change the image size or image itself. it says:

this is the code it is referring to:

3.) if I add more columns it adds them below and not beside each other. sorry it wasn’t clear to this point that I’d like to create an image row with 4 images + using this overlay which update themselves automatically when I add a new post on instagram (if it’s possible).

https://wqhtkpat2ouwouf3-28196274313.shopifypreview.com

any other ideas?

thanks for your help so far!