If you want to place a background image or you want to change the background color, we are going to show you in simple steps how you can customize the background of your store. We will show you how to place an image:
or change the color:
LET'S GO STEP BY STEP:
Go to Control Panel > Settings > Advanced, and check if you have the Custom CSS box.
📌If you have Custom CSS you should paste the following code there:
TO PLACE AN IMAGE:
body {
background-image: url(https://link.com/images/img.jpg);
background-position: top center;
background-repeat: no-repeat;
background-attachment: fixed;
background-size: cover;
}NOTE: You must modify the url in bold, placing the URL where your image is stored.
💡In case you don't have it hosted somewhere, you can use ibb.co (free and online).
TO CHANGE THE COLOR :
body {
background: #FFD700;
}NOTE: Depending on the color you want to enter, you can place the HEX code as shown in the code (you must replace the " #FFD700" with the one you want).
💡 Here we share with you a site where you can find the color codes.
Save the changes. Now, your background is ready!
📌 If you don't have Custom CSS you should paste the code in Custom before </head> code as follows:
You can use the same codes as above, wrapping them with the <style>...</style> tag.
You would be left with the code for the image:
<style>
body {
background-image: url(https://link.com/images/img.jpg);
background-position: top center;
background-repeat: no-repeat;
background-attachment: fixed;
background-size: cover;
}
</style>
And the code for the color:
<style>
body {
background: #FFD700;
}
</style>
Save the changes. Now, your background is ready!
ADDITIONAL INFORMATION:
Some tags may have some errors and that's why the code doesn't work. To fix it, check that the code is correct and as we shared it in this tutorial.
We hope this tutorial has been easy for you and if you have more questions, please contact us at [email protected].