How to add a text block at bottom of Shopify footer on Debut theme

[TScan07]

I'm looking to add text below my footer and above the payment icons that would span the entire page. I know that this would be in Sections>Footer.liquid but I don't know where to add it and where to edit the code. Can somebody please help?

[Olivia · Accepted solution]

Hey, @TScan07!

Olivia here from the Shopify team. I'd be glad to help you out with this, so let's dive in.

Steps:

1. Head to Admin > Online Store > Themes > Customize > Edit code
2. Open Sections > footer.liquid template
3. Scroll until you find the following line of code, on or around line 234 depending on your theme version:
   

   {%- assign socials = "Facebook Twitter Pinterest Instagram Tumblr Snapchat YouTube Vimeo" | split: ' ' -%}​

4. Insert your desired text after this code ends, being careful not to break it. Make sure to add <p> before your text, and </p> at the end of your text to close the code. It should look like this:
   

   {%- assign socials = "Facebook Twitter Pinterest Instagram Tumblr Snapchat YouTube Vimeo" | split: ' ' -%}
   <center><p> Add your desired text </p>
     <div class="page-width">​

   Tip: Using the <center> tags will also help keep your text centered. 

   It will look like this:
   
5. Remember to replace the placeholder text with what you want to display and hit save! 

That should work, but let me know if you have other questions around this.

Note: 

This solution is for the vintage Debut theme and not applicable to any Online Store 2.0 theme.

Warm regards,

[TScan07]

Thank you SO much! That did work! Is there a way to have it span less of the page instead of the full width? My text is quite long.

[TScan07]

I also need to translate it since my site is bilingual.

[Olivia]

Thanks for your reply, @TScan07.

You can definitely split the text up onto separate lines, or break up the text with line breaks using the code <br>.

If you're using an app to translate text on your webpage, that should translate this area too, or you can hardcode translated text (same as the english text) as well.

Warm regards,

[aart2000]

This was a little helpful, but I'm using Supply Theme and don't see the exact code you are referring to. Where do I add a short line for Supply?

[Olivia]

Hi, @aart2000!

Thanks for reaching out. The code for Debut is much different than Supply, so I would recommend placing your desired text on or around line 194 depending on your theme version. Just be sure not to break any existing blocks of line code.

Let me know if that helps,

[Olivia]

Just following up again, @aart2000!

Please let me know if the suggested alternative worked for you.

I look forward to your reply,

[aart2000]

Yes, thank you. I worked perfectly.

[Olivia]

I'm so glad to hear that, @aart2000!

I appreciate you following up and sharing that for our future readers.

Warm regards,

[Snow_Wolf]

Hi @Olivia your solution worked perfectly for me. The only thing is that the footer is tall enough as is, so I would prefer to have the text inserted on the same line as the media icons rather than below. Any help would be much appreciated!

[Olivia]

Thanks for getting in touch, @Snow_Wolf!

Can you clarify which theme and version you are currently using?

Thank you,

[Snow_Wolf]

Hello @Olivia I really appreciate you following-up on this. I am using the Refresh theme ( "theme_version": "1.0.0"). Store URL is www.eoleaf.com (PW: GreenerHealth).

[Olivia]

Thank you for getting back to me, @Snow_Wolf.

The code in this tutorial is specifically designed for Debut, though it may still be applicable to some of our other vintage themes. The difference with our newer themes, such as Refresh, is that it is built for the Online Store 2.0.

This makes the code vary largely, as other considerations need to be made. In this case I recommend opening a new thread with your question for exposure and feedback from our community members and code experts.

Please let me know if you have other questions about this.

Warm regards,

[anism86]

That's awesome. Thanks Olivia. How do I change make the desired text a heading? I would like to have a consistent look.

[Olivia]

I'm so glad I could help, @anism86!

To change the desired text to a heading, simply use the heading tags before and after the text like so:

<h1> insert text here </h1>

If you need a different heading style, then make sure to adjust the 1 in the code above to the correct heading style number. 

I trust that helps,

[carabrooke]

What about with theme craft?

[Olivia]

Hi, @carabrooke!

Thank you for reaching out.

The theme Craft is also one of the newer Online Store 2.0 themes, which is why the code advice in this tutorial will not apply. Please open a new thread with your question to get code advice and feedback from our experts.

Warm regards,

[zoolab]

Hi Olivia, 
I was wondering if it's possible to do the same with Dawn Theme? Thanks in advance 🙂

[Olivia]

Hi, @zoolab!

Thanks so much for reaching out. Ah, Dawn is a beautiful theme and certainly one of my favorites. It also falls under the Online Store 2.0 themes umbrella, it is in fact the first one we introduced with the new design, so this code tutorial will not apply.

Warm regards,

[liquiduniverse]

hi Olivia, 

What if I want to add text in Sense theme? the code is different and I don't know where to add the code. Thanks

[Olivia]

Hi, @liquiduniverse!

As per the Sense theme documentation it is also an Online Store 2.0 theme so this code tutorial does not apply.

Please feel free to open a new forum post with your question for code advice.

Warm regards,

[theindimums]

hi Olivia,

I went through your code suggestions in the previous post. We wish to add SEO keywords in our footer. Can we do it in this fashion with the codes you have shared? if yes, we would like to reduce the font size and provide some margins on the side, how to get that?

additionally, are there better ways to add seo keywords in the footer?

[Olivia]

Hi, @theindimums.

Within Shopify there's four different ways to add keywords to improve Search Engine Optimization. These areas include:

• page titles
• meta descriptions
• ALT tags
• a page’s body content

The way to add keywords to each of these areas will be different and are thoroughly described in this help manual. This is different than adding them into your footer, however, will also be much more effective and personalized throughout your site for Google and other search engines to crawl.

Let me know if that helps,

[jakegrieveson]

Hey i am on the dawn theme, is there any way to make the footer text smaller?

[Olivia]

Thanks for joining our thread. @jakegrieveson!

Dawn is one of our newer themes built for the Online Store 2.0. As this thread is regarding code changes on the vintage Debut theme the same instructions will not apply.

Please open a new thread with your question for visibility from our community members and I trust they will be able to guide you in the right direction.

Warm regards,

[mattwaller9]

Hi Olivia! I am having this issue, I tried to implement your fix, however I can't find the first line of code you mention? I am using the theme called 'Dawn'.

[Olivia]

Thanks for reaching out, @mattwaller9!

Just in case you missed it, my latest comment in this thread mentions that these theme instructions do not apply to newer Online Store 2.0 themes such as Dawn. As such, you can certainly start a new thread with your question for visibility across the board.

Furthermore I have updated the original solution to make it easier for our readers to see that.

Warm regards,