-2

I would like to know how to create a custom background.

There is currently an active site, that i am trying to figure out how i can do the same or similar https://suscopts.org/

enter image description here

Kirk Beard
  • 9,569
  • 12
  • 43
  • 47
Blocked User
  • 9
  • 1
  • 9

1 Answers1

0

Well, I'm not sure if you want to know how to create such a background pattern or don't know how to set the background of a wordpress website.

This seems like a repeated background pattern. Searching for something like "seemless pattern" could help. This images are small and repeated, so you don't need to load a big background image. In the CSS you can use 'background-image' and 'background-repeat' on the body element.

You can use right click in your browser to select inspector to inspect the website. You should find the element wich has the css set for the background image. Start with the html tag and work your way inside, followed by body, div id page, etc, what ever this page structure looks like. You then have the element you need to target in your css file to give it the background attribute. The CSS file of a wordpress site is found in the Themes folder and is called style.css

Hope this gives you a start.

If you want to clearify your question I am happy to give you a more detailed answer.

rank
  • 2,361
  • 2
  • 10
  • 20
  • Thank you for getting back to me. Yes, i would like to know "how to create such a background pattern" So, from what i understand i need a png file image to start with. Which leads to another question, what tool can i use to create the file for the background? – Blocked User Apr 29 '20 at 21:12
  • This is a graphic design question, under the tag "wordpress" is the wrong place to ask this. If you want to create the image, you need a software for this, for free there are for example "GIMP" or "Paint.NET". It is not that simple to create a seamless pattern, because you have to have in mind that it is repeated, so the image should work if it is added at the bottom or the right ob itself. Click on the "preview" buttons on this site: https://www.toptal.com/designers/subtlepatterns/ Maybe, if you don't know how to work with graphic software, it is a good start to chosse an existing pattern. – rank Apr 30 '20 at 11:18
  • If you have the JPG or PNG file of your pattern, you can set in css: body { background-image: url('your image path'); background-repeat: repeat; } (take a look: https://www.w3schools.com/cssref/pr_background-repeat.asp) – rank Apr 30 '20 at 11:19
  • Thank you for all your help and guidance. Apologies for the wrong tag. Honest mistake. – Blocked User Apr 30 '20 at 14:27
  • Glad to help! If you are happy with the answer feel free to mark it as the accepted answer. – rank Apr 30 '20 at 23:39