Brooklyn theme - Make the footer stick to the bottom of the page (+delete RSS icon)

New Member
7 0 0

Hey guys.

 

I'm trying to figure out what to add in my CSS to make the footer always stick to the bottom of the page. Now, when there isn't much content, it's floating in the middle of the page. For example:

 

Schermafbeelding 2019-12-30 om 16.22.06.png

My second question is: how do I delete that RSS icon next to 'Stories'? (This is a blog-page)

 

Thanks in advance!

www.izeofthefuture.com

0 Likes

Hey Izeofthefuture,

 

I added a some styling below which should help you position the footer at the bottom of the page. I don't know the theme your are using, but if you change the of the style selector it should work.

 

element.style {
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 9999;
}

 

I hope this feedback helps you,

LMPTechSolutions.com

0 Likes
New Member
7 0 0

Hey, thanks for your answer.

 

Unfortunately, this doesn't work. I work in the Brooklyn theme btw. When I add this, this happens:

 

Schermafbeelding 2019-12-30 om 17.48.38.png

 

I want the footer to be page wide (like it was, see picture in previous post) and to stick to the bottom of the page. Not that it is always fixed on the screen.

 

Thanks!

0 Likes
New Member
7 0 0

Anyone please?

0 Likes
New Member
1 0 0

welcome to Duostore2

w"ll answer to you a minut

0 Likes

Hey izeofthefuture,

 

add. 

 

{
  width: 100%
}

Also you need to add margin to the bottom of the main div to offset the footer height.

 

If you would like additional help.

Feel free to reach out to:

LMPTechSolutions@gmail.com so I can respond more promptly.

 

I hope this feedback helps you,

LMPTechSolutions.com

--------------------------------------------------------------------

If helpful then please Like and Accept Solution.

 

 

0 Likes

Hello @izeofthefuture,

1. Go to Online Store->Theme->Edit code
2. Asset->theme.scss.liquid->paste bellow code in bottom of file

I)To delete RSS icon Add below css]

#stories .icon.icon-rss {
	display: none !important;
}

For footer

#stories #shopify-section-footer {
	position: fixed;
	bottom: 0;
	width: 100%;
}
Want to modify or incorporate custom changes on store, Hire us.
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Free Review and advice for sale on store | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | SEO & Digital Marketing | Site Speed Optimization | Performance Site Audit
0 Likes