How To Add A Text Block At Bottom Of Shopify Footer On Sense Theme

[Tomerp900]

I want to add an FDA disclaimer at the bottom of my footer, here is an example of how I want it to look like: 

Can somebody please help?

[Made4uo-Ribe]

Hi @Tomerp900 ,

Yes we can add like that, Would you mind to share your Store URL website? with password if its protected. Thanks!

[Tomerp900]

My website is: https://gummyglows.com/

Password: riatsugummy

Thank you for your help, please let me know if you have any idea how to solve it 🙂

[Made4uo-Ribe]

Thank you for the information. Try thi one. 

1. From your Shopify admin dashboard, click on "Online Store" and then "Themes".
2. Find the theme that you want to edit and click on "Actions" and then "Edit code".
3. In the "Assets" folder, click on "base.css, style.css or theme.css" file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:
4. And Save.

.footer__content-top.page-width:after {
    content: "Disclaimer: Where I'll position myself?"
}

• Result:
• 

  I hope it help.

[Tomerp900]

Thank you very much, it worked!

Do you know how can I make the text smaller and add a white border around the text like this example:

[Made4uo-Ribe]

Yes, Im just waiting for you to reply so we can add more design. 

.footer__content-top.page-width:after {
    content: "\2020These statements have not been evaluated by the Food and Drug Administration. This product is not intended to diagnose, treat, cure or prevent any disease. The views and nutritional advice expressed by GummyGlows are not intended for the purpose of providing medical advice. Please always consult your health care provider if you are taking any medications or have any medical conditions. Individual results may vary.";
    position: absolute;
    font-size: 12px;
    border: 1px solid white;
    padding: 10px;
    margin-right: 10%;
}
.footer__content-top.page-width {
    margin-bottom: 10%;
}

Result:

Youll put this one in the mobile also? This will go down on the mobile screen. 

[Tomerp900]

WOW! it's perfect, thank you so much!

It looks perfect on desktop but as you said it doesn't work on mobile
Do you know how we can fix it on mobile?

[Made4uo-Ribe · Accepted solution]

Can you try this one for mobile. Paste it on the section-footer.css. 

.footer__content-bottom.scroll-trigger.animate--slide-in {
    margin-top: 10%;
}
@media only screen and (max-width: 796px) {
.footer__content-bottom.scroll-trigger.animate--slide-in {
    margin-top: 30%;
}
.footer-block__details-content.footer-block-image.center {
    margin-bottom: 0px;
}

.footer-block.grid__item.scroll-trigger.animate--slide-in {
    margin: 0px;
}
.footer__blocks-wrapper.grid.grid--1-col.grid--2-col.grid--4-col-tablet.scroll-trigger.animate--slide-in {
    margin-bottom: 0px;
}
}

@media only screen and (max-width: 534px){
.footer__content-bottom.scroll-trigger.animate--slide-in {
    margin-top: 60%;
}
ul.footer-block__details-content.list-unstyled {
    margin-block: auto;
}
}

I hope it help. 

[Tomerp900]

Thank you very much for your help, you are the best, it's perfect! 🙂

[craveablesocial]

This was super helpful! Exactly what i needed as well. I used the code provided and it worked, however, I'm having issues with adding a space between the disclaimer and the newsletter signup. Any suggestions?

[Made4uo-Ribe]

Add padding below the newsletter email input or above the disclaimer. 

[craveablesocial]

Thanks! it worked. 🙂

[pawankumar]

Hi @Tomerp900 
I hope you are doing well.
You can add a section by clicking "Add section" in footer from shopify customizer and you can set that section above or below the footer
See attached screenshot:

Please check
If you need more customized one or need in between block or section than you will require some knowledege of editing liquid files.
Thanks!

[Tomerp900]

Yes, Im well aware that I can add a section, the problem is that it doesn't look like I want it to look, you can check the example I sent, I want the disclaimer to be in the footer not below or above the footer