Shopify themes, liquid, logos, and UX
HI hive mind,I would like to add an image as a background for the footer, similar to a previous squarespace site image below. I am using the blockshop theme and am quite rusty on adding custom code, so some clear instructions would be very helpful! 🙂 Thank you very much in advance.
Please share your store URL.
Thanks!
Hii, @peter550
Kindly share your store URL so,
I can solve it perfectly.
Thank You.
Please Go to Online Store->Theme->Edit code then go to assets/theme--critical.css ->paste below code at the bottom of the file.
#shopify-section-framework--footer{
background-image: url("your image url");
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
Thanks!
Thank you I will give that a go! Where do I upload the image to then have the URL to put in the code?
Pete
Please following URL for help
hi everyone
i tried the code but it doesnt seem to work 😞 not sure if i'm doing it wrong
Your code is correct Please add following css class
Please Go to Online Store->Theme->Edit code then go to assets/theme--critical.css ->paste below code at the bottom of the file.
.footer--root { background: transparent !important;}
Thanks!
Wonderfull thank you. That worked! Theres a slight issue now where the text overlaps. Is there a way to pull the footer text into the centre? like in the image, but with more info like in the first image
This is code customization work .
Thanks!
hi everyone,
is there a way to get the footer text to be pulled into the centre, so thats it's visible in the middle of the plants? I would like to have the email subscribe box and the name of the site + instagram logo in the middle. You can see it overlaps here
Please Go to Online Store->Theme->Edit code then go to assets/theme--critical.css ->paste below code at the bottom of the file.
.footer--blocks { width: 50%; margin: 0 auto;}
Thanks!
hiya
thanks for this. Unfortunately its moved everything to the left. I would like both parts to be in the middle of the plants, with an even margin on the either side
Please try following css class
.footer--blocks { width: 50%; margin: 0 auto !important;}
Thanks!
Amazing! You legend. That worked.
Do you have an idea of how to add an instagram link to the header bar?
Do you have an idea of how to add an instagram link to the header bar?
This is code customization work .
Do you have the code for it?
Hi everyone
I would like my footer image to be aligned to the bottom of the page when on mobile view. I would also like the image to be smaller, compared to a laptop, so its more of a frame like on a laptop views (see pic)
I used this code to have the image in the footer:
#shopify-section-framework--footer{ background-image: url("your image url"); background-position: center; background-repeat: no-repeat; background-size: cover; }
I would also like to centre the email sign up form when in mobile view. Its currently off centre
https://laz-the-plant-scientist.myshopify.com/ pword test
Is there additionally a way to alter the logo size from the cellular view as nicely? Your solution worked well for the desktop linkbut I can see my brand remains tiny at the cell layout.
Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024Digital marketers and app developers have tracked activity in apps and websites for yea...
By Ollie Mar 13, 2024February was an exciting month with Shopify Editions, informative webinars, and more! F...
By JasonH Mar 7, 2024