Solved

center an image in the footer and the copyright info (dawn theme)

sternenbilder
Tourist
9 0 2

i would like to put the image with the payment infos and the copyright info in the middle of the site:

https://sternenbilder.ch/

Bildschirmfoto 2024-03-22 um 09.30.17.png

And if possible to insert a little space between the footer menu and the payment infos and reduce the space between payment infos, the line and the copyright

Accepted Solution (1)
Dan-From-Ryviu
Shopify Partner
7678 1493 1496

This is an accepted solution.

Code updated

<style>
.payment-iyzico {
    margin-top: 1rem;
}
.footer__content-top { 
    text-align: center; 
    padding-bottom: 2rem !important;
}
.footer__content-bottom {
    padding-top: 2rem !important;
}
.footer__content-bottom-wrapper {
    justify-content: center;
}
</style>

- Helpful? Like or Accept solution! or Buy me a coffee
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look
- Enjoy 1 month of Shopify for $1. Sign up now

View solution in original post

Replies 10 (10)

PageFly-Henry
Astronaut
1069 306 260

Hi @sternenbilder 

This is Henry from PageFly - Landing Page Builder App

 

You can try this code by following these steps: 

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file base.css

Step 3: Paste the below code at bottom of the file -> Save


.footer__content-top.page-width {

    display: flex !important;

    flex-direction: column !important;

}

 

Hope that my solution works for you.

Best regards,

Henry | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.

Dan-From-Ryviu
Shopify Partner
7678 1493 1496

Hi @sternenbilder 

Dan here from Ryviu: Product Reviews & QA app

You can do that by adding this code to your theme.liquid file, after <head> in Online Store > Themes > Edit code 

 

<style>
.footer__content-top { 
text-align: center; 
}
.footer__content-bottom-wrapper {
justify-content: center;
}
</style>

Screenshot 2024-03-22 at 15.36.02.png

 

- Helpful? Like or Accept solution! or Buy me a coffee
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look
- Enjoy 1 month of Shopify for $1. Sign up now

sternenbilder
Tourist
9 0 2

thank you for the very fast answer. that worked well for the text (copyright) but not for the image?

Bildschirmfoto 2024-03-22 um 09.42.06.png

Dan-From-Ryviu
Shopify Partner
7678 1493 1496

Please remove the code you added at the bottom of base.css file to make my code work properly

 

.footer__content-top.page-width {
    display: flex !important;
    flex-direction: column !important;
}

 

- Helpful? Like or Accept solution! or Buy me a coffee
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look
- Enjoy 1 month of Shopify for $1. Sign up now

sternenbilder
Tourist
9 0 2

perfect now it works! Thank you very much. Do you have an idea how to reduce the space between the picture of the icons and the line and aswell between the line and the copyright?

Dan-From-Ryviu
Shopify Partner
7678 1493 1496

Please update the code 

<style>
.footer__content-top { 
    text-align: center; 
    padding-bottom: 2rem !important;
}
.footer__content-bottom {
    padding-top: 2rem !important;
}
.footer__content-bottom-wrapper {
    justify-content: center;
}
</style>

- Helpful? Like or Accept solution! or Buy me a coffee
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look
- Enjoy 1 month of Shopify for $1. Sign up now

sternenbilder
Tourist
9 0 2

that worked aswell - perfect!
Is it possible to increase the space between the footer menu and the payment icons?

Dan-From-Ryviu
Shopify Partner
7678 1493 1496

This is an accepted solution.

Code updated

<style>
.payment-iyzico {
    margin-top: 1rem;
}
.footer__content-top { 
    text-align: center; 
    padding-bottom: 2rem !important;
}
.footer__content-bottom {
    padding-top: 2rem !important;
}
.footer__content-bottom-wrapper {
    justify-content: center;
}
</style>

- Helpful? Like or Accept solution! or Buy me a coffee
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look
- Enjoy 1 month of Shopify for $1. Sign up now

sternenbilder
Tourist
9 0 2

Perfect - Thank you very much for your fast help!

Dan-From-Ryviu
Shopify Partner
7678 1493 1496

Very welcome! 

- Helpful? Like or Accept solution! or Buy me a coffee
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look
- Enjoy 1 month of Shopify for $1. Sign up now