How can I upload an image for background use using the Theme Editor in Wordpress?

Question

I'm learning Wordpress from the book Wordpress for Dummies. The author says to open the theme editor then use the style.css sheet. I uploaded the image to the twentyseventeen image folder via FileZilla. She gives this example to add a new background image and change the color to white:

background #FFFFFF
   url('images/newbackground.gif');

then she gives other property examples like

background-repeat: repeat-y;

I wasn't able to change the image using the code the author gave. Where to I have to place this code and how to make this change.

I've used the following code in the footer.php template to add category archives to the homepage:

<?php wp_list_categories(array(
    'style' => 'none',
    'orderby' => 'name',
    'show_count' => true,
    'hierarchical' => true,
    'depth' => 1
)); ?>

So I know how to add code but I don't know how to add the examples she gave for the background image.

Answer 1

Giving the CSS of

background #FFFFFF url('images/newbackground.gif');

is just giving an example based on basic CSS. Be careful when copying the suggestions made in the book because you missed an important colon after background. It should be

background: #FFFFFF url('images/newbackground.gif');

Also, you need to make sure the URL part of the CSS is correct for the file you uploaded.

One suggestion can be that while you can do as suggested by the author of your book, it may be more beneficial (and more intuitive) to use the Media Library facility within WordPress rather than uploading directly into the twentyseventeen image folder using FileZilla or other FTP program.

This way you can link to the file using the information provided within the Media Library regarding the image you wish to use.

Take for example the following image in the WordPress Media Library of a website I maintain.

If you look to the bottom right of the screenshot, you will see the image file's URL and a Copy URL button so the Media Library helps you by providing the information for the url('images/newbackground.gif') part of the CSS. In this case it would be url('/wp-content/uploads/2019/05/articles-cover.jpg') as you don't need to include the domain part of the URL.