Brand Information Element in Footer Logo Center Alignment (Dawn Theme - 2023)

Store Design
, , ,
1

I’m trying to get the logo image and social links to be center aligned in the element called Brand Information located in the footer. They are always left-aligned. Could someone please provide the code to do this and let me know where it goes? I’ve looked everywhere and can’t find how to do this.

Untitled.jpg
Untitled.jpg1910×917 165 KB

2

Hi @JKLRedeemed screenshots are not code

Others do not know what you know or have same theme behaviors, always provide real context so others can inspect and reproduce issues:
Store url or preview urls, exact demo urls, storefront password if any, theme name, example code, are any apps involved, etc
https://community.shopify.com/c/shopify-design/help-us-help-you/td-p/668159

Goodluck.

3

Here is my website (no password):

I tried to give as much information as possible, I am very new to this and am learning as I go. I’m not sure where in the code I would need to go to provide anything more for this. I just created this site using the Dawn Theme, as I mentioned in the title of the post.

4

Hi @JKLRedeemed

This is Victor from PageFly - Shopify Page Builder App, I’d like to suggest this idea:

Online Store ->Theme ->Edit code

Assets ->Base.css

.footer-block__brand-info {
    display: flex;
    flex-direction: column;
    align-items: center;
}

Hope you find my answer helpful!

Best regards,

Victor | PageFly

6 Likes
5

That worked beautifully, Victor! Thank you!

I have a new question about that same brand logo… How might I make the logo link to my homepage of the site?

EDIT: I actually just figured this second question out myself. Not sure if it’s the proper way, but it works. You have to go to footer.liquid and find

and place this under it:

<a href= “[your website link]”

6

@JKLRedeemed In this regard, you should contact the theme to get the necessary support.

1 Like
7

For me this did not work. I got this to work by using this: (pasted into the very bottom of base.css)

@media screen and (min-width: 750px){
.footer-block__brand-info {
display: flex;
flex-direction: column;
align-items: center;
}

Hope that helps anyone trying to do the same thing.

8

Hello,

This code only seems to work for desktop. Could you share a code to work on mobile as well please?

9

It worked! How about the footer link, they are not align center on mobile. Any idea?