How do I change the padding around the Instafeed app?

How do I change the padding around the Instafeed app?

thelittlehousek
Tourist
11 0 6

Hello! I am trying to remove the top padding showing above my instafeed app. I can easily remove using the inspect tool, but cannot find the instafeed code sheet to edit on the back end. Can anyone help? The white bar above the feed is the padding I wish to remove.

 

Screen Shot 2022-07-14 at 10.42.43 AM.png

 

Changing the margin to 0px is what is working in the inspect tool. See below. 

 

#insta-feed, .instafeed-shopify {
position: relative;
display: block;
box-sizing: unset;
text-align: center;
clear: both;
margin0px auto 0;
}
Replies 7 (7)

diego_ezfy
Shopify Partner
2967 571 901

Hello @thelittlehousek,

Please share:
- your store URL;
- page URL with the issue you mention;
- storefront password (if your store has one).

If the store is not online yet, please follow this quick tutorial to learn how to safely and temporarily share an offline/unpublished theme URL.

Kind regards,
Diego

thelittlehousek
Tourist
11 0 6

Here is the preview of my unpublished storefront: https://zhdhrz32jmht8lx5-36138418312.shopifypreview.com

 

@diego_ezfy 

thelittlehousek
Tourist
11 0 6

It is the bottom bar right before the footer.

upserve
Shopify Partner
28 0 0

Good day.

maybe you can share the url of shop?

so I can send you the correct CSS code.

P.S. Just want to help you with that white border for free

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on https://ua.linkedin.com/in/yanchuga regarding any help
Shopify Partner | Telegram : https://t.me/yanwinner

diego_ezfy
Shopify Partner
2967 571 901

@thelittlehousek,

1. In your Shopify Admin go to online store > themes > actions > edit code
2. In your theme.liquid file, find the </body> (press CTRL + F or command + F on Mac)
3. paste this code right above the </body> tag:


<style>
    #insta-feed{
    margin-top: -60px !important;
        display: block !important;
}

@media (max-width: 749px){
    #insta-feed{
    margin-top: -40px !important;
}
}
</style>
<script>

</script>

 

 

-60px = top spacing desktop

-40px = top spacing mobile

 

make sure you add the - sign as a prefix, it needs to be a negative number to work.

If it helps you please click on the "like" button and mark this answer as a solution!

Thank you.


Kind regards,
Diego

 

JoeBlackYo
Visitor
1 0 0

Thank you so much, I was desperate to find a solution!

A big THANKS 🙂

Julien

scooterswayze
Tourist
8 0 1

Hi there Diego!


Hope all is well. 

 

I'm looking to accomplish something similar, but I'd like to get rid of both the top and bottom margings/padding, as well as set it up so that the Instafeed Photos can take up full width (once the margins are gone) without getting distorted.


Any help would be greatly appreciated!


Thanks,


PatScreenshot 2023-11-07 at 12.18.13 AM.png