How To Upload A Background To Weebly
Here's a step-past-pace tutorial on how to customize your groundwork in Weebly.
We'll get over:
- How to change the background color
- How to change the header and footer color
- How to add a groundwork paradigm
Y'all volition be able to customize various groundwork Weebly by the end of this tutorial.
Permit's swoop right in.
How to alter groundwork color in Weebly
Notation: This section goes over how to change the background color on the principal content surface area (a.k.a the body) of your site.
If you desire to change the color of the header or the footer you have to customize the theme through the code editor (don't worry, information technology's not as hard as you recall).
First login to your Weebly business relationship . Brand certain you select the right website and click Edit Site.
In the main editor, click on the edges of a section to update its background colour.
You should see a popular upwards that prompts you to edit the background, select Edit Groundwork.
Next, select Change Colour.
Y'all can and so drag the color picker to change the background color of your choice. Optionally y'all tin can edit the HEX code right under the color picker.
That's it!
You've now successfully changed the background color. You may repeat this pace for any section on the page.
First, head to your website Theme and select Edit HTML/CSS.
Important: Make a notation whether your website is currently using the light or dark theme, this will bear on how you update your header.
If your website is using a light theme, then click the variables_light.less file on the sidebar. If your site is using a dark theme instead, and so click on variables_dark.less.
Since the website in this demo is using a light theme, we'll select the variables_light.less file.
Next is to update the color code for for the header.
Look for the commencement line in the code editor which should consist @bg followed by a 6-digit color code.
The existing color code is #ffffff which is white. You can change it to whichever color yous like.
If you accept no idea which color to choose then just use #fffa00 (yellow) for do. Alternatively, head to this color picker website to identify the closest color to your preference.
The Weebly lawmaking editor will prove a preview of the colour change on your header. Be sure to click SAVE to update the changes.
You've now successfully updated the header color!
You tin can as well change the Footer color background.
Just look for @footer on the last line in the code editor and update the color code merely similar you did with the header.
How to add a groundwork image
Adding a groundwork prototype (equally well equally removing it) is pretty easy in Weebly.
In the main editor, click on the edges of a section to add together a background epitome.
Yous will run across a pop up that allows you to add or edit the groundwork image.
If there's an existing background, the click Edit Background ➞ Supervene upon Image.
Alternatively, if there isn't a background, you can select Epitome ➞ Add Image.
Upload a background image from your reckoner.
If you're looking for free stock photos or royalty free images then Pexels is a skillful place to start.
Once uploaded, click Save.
You've now added a groundwork image your site! Hitting the publish button to update the changes.
Related articles:
- Wix vs Weebly vs Squarespace vs Wordpress (A detailed comparison)
- How to change font in Weebly
- How to delete a Weebly site
- How to create a sub page in Weebly
- How to add Google Analytics to Weebly
Source: https://makingthatwebsite.com/how-to-change-weebly-background/
Posted by: knighttasootoor.blogspot.com
0 Response to "How To Upload A Background To Weebly"
Post a Comment