Adding a unique background image to your portfolio can give it a unique and professional look. However, if you are new to WordPress, it could be difficult for you to change your portfolio background images.
Let us make things easier for you.
Here is an eight-step process to changing the images in your portfolio background.
Table of Contents
1. Determine the Size of Your Background Image
WordPress recommends that website background images should be 1920 x 1080 pixels with an aspect ratio of 16:9. The pixels per inch (PPI) should be at least 72; however, the size of the image should be as small as possible.
If you include heavily-sized images, your site can run into a number of issues, the biggest one being poor user experience (UX). When a website has heavy images, it takes more time to load, which affects the UX and also SEO performance.
2. Find High-Quality WordPress Background Images
Once you have decided the size of your portfolio background images, the next step is to select good-quality images for the background. Here, you have two options.
- Use your image or artwork as the background
- Use stock photos
It’s also essential to keep the colour palette and gradient in mind. If you use black text on your website and you choose a dark background image, the text on your site may not be legible. Keep the colour contrast in mind, and use gradients to make the text appear more clearly.
3. Choose the Right Effect
You can choose between two scrolling effects for your background image: parallax and fixed or static. Both the effects allow you to display stunning portfolio background images. However, the parallax effect gives a modern look to your website.
When you use a fixed background image, it remains static as the user scrolls down the page. All the other elements on the site, including text, links, and buttons, will move as the user scrolls, but the image will remain fixed.
In the parallax effect, the image moves along with the text and other elements as the user scrolls. However, the image moves at a different speed than other elements, producing a unique and pleasing effect.
4. Add a Background Image Using Theme Settings
Now that you have learned the fundamentals of portfolio background images, let’s delve into the process of changing the background. There are three methods to change your background image.
The first method is to add an image in theme settings. You can head to the Appearance section and click on Customise. In the Appearance menu, click on Background Image. Upload the image you want to use. Select the essential features for your image, such as fit the screen, fill the screen, repeat, or custom settings.
Once you have chosen the settings, click on Save and Publish to save your changes.
5. Add an Image Using a Plugin
Contrarily, you change portfolio background images using a plugin like WordPress Gallery Lightbox. This method is more convenient, as going through the Appearance section and manually selecting a background image could be tricky for some website admins, especially those who have little experience in using WordPress.
WordPress Gallery Lightbox allows you to turn your gallery into a background slideshow. You can change the slideshow interval and overlay colour to make your background look more attractive.
6. Add Custom CSS for Your WP Image
The last way is to add custom CSS to set portfolio background images. This will require some knowledge of CSS. You’ll need to go to the Appearance section, click on Customise, and then select Additional CSS. There, you can place your custom CSS and click on Save and Publish.
There are numerous classes that you can insert into the body tag. If you’re new to CSS, you can use inspecting tools to identify those classes.
7. Apply a Full-Screen/Partial Image
You can place the background image in two ways. The first way is to put it as a full-screen image. To do that, head to the Appearance section and select Simple Full-Screen Background Image. If you don’t want a full-screen background, you can choose the other options.
8. Set Background Image for Page/Category
WordPress allows you to add portfolio background images for each page, blog post, and category. This way, you can fully customise your website. You can add a background for a specific page by going to the page edit screen and choosing a background image.
Wrapping Up
Including a custom portfolio, background images can give your website a unique look and make it more professional. By following the above steps, you can easily set and change the background image of your website, along with its individual pages and categories. If you’re a beginner, using a plugin will be the easiest way.