Build Your Own Business Website header image

Background Images

WordPress 3.9 Crash Course – Part 23 – Reorganize our File, Simple WordPress Theme Customization

Difficulty Level -

Filed Under Topics - , , ,

Listed Under Lesson Subjects -

Applies to -

Typical WordPress themes have some limited ability to be customized. If you're familiar with the Genesis theme and the Thesis theme then you know there's quite a wide range of customization that you can do but the typical wordpress.org theme does not have a huge range. However, you can make some pretty decent changes. We’ve

Troubleshooting Errors in Responsiveness in a Member’s Site

Difficulty Level -

Filed Under Topics - , ,

Listed Under Lesson Subjects -

In this session we troubleshoot errors in responsiveness in a member’s site beginning with the images. We talk about why the images are not responsive and how Agility deliberately scales HTML images because they can't be bigger than their container. We change the image from a background image and make it a regular HTML image

Part 8 – Adjusting Background Images for Mobile Devices

Difficulty Level -

Filed Under Topics - ,

Listed Under Lesson Subjects -

Applies to -

The next thing I want to do is show you in this lesson on Customizing Thesis 2 with Background Images, Colors and Gradients is how to use media queries to change up these images for mobile devices. This is really a big image and a mobile device can't see all these edges and doesn't need

How to Layer Multiple Background Images in the Body of Agility

Difficulty Level -

Filed Under Topics - ,

Listed Under Lesson Subjects -

In this session we show how to layer multiple background images in the body of the Agility Skin using a transparent image which provides something to click on and add a title to and we demonstrate how to customize the appearance of the body background in the Custom CSS. We talk about how CSS3 and

Part 6 – Using Multiple Background Images in the Same HTML Element

Difficulty Level -

Filed Under Topics -

Listed Under Lesson Subjects -

Applies to -

Now that you’ve seen how to add a fixed background image in a Thesis 2 skin, the next thing we're going to demonstrate is how to put more than one background image in a container. I have a background image that I'm going to layer over the top of this body background image that is

Part 5 – Using a Fixed Background Image in a Skin

Difficulty Level -

Filed Under Topics - ,

Listed Under Lesson Subjects -

Applies to -

The next thing we're going to do in this lesson on Customizing Thesis 2 with Background Images, Colors and Gradients is to add a fixed a background image in a child theme. This is one of those cases where we will switch skins again. Manage Skins and we'll come back to the Classic Responsive and

Part 4 – Add a Color to the Sidebar with a Tiling Image

Difficulty Level -

Filed Under Topics - , ,

Listed Under Lesson Subjects -

Applies to -

Something else that I would like to demonstrate in this lesson on Customizing Thesis 2 with Background Images, Colors and Gradients is placing a color in the sidebar that goes all the way down to the bottom of the page. As it sits right now there is no background color here in the sidebar. So

Part 3 – Using Different Background Images on Different Pages

Difficulty Level -

Filed Under Topics - ,

Listed Under Lesson Subjects - ,

Applies to -

The next thing we're going to do in this How to Customize Thesis Skins with Background Images, Colors and Gradients lesson is to use different background images on different pages. What we have created so far looks just fine on the main front page but if we come over to the menu page, now all

Part 1 – Understanding Background Images in CSS

Difficulty Level -

Filed Under Topics - , ,

Listed Under Lesson Subjects -

Applies to -

Good morning everybody and welcome to this special session on How to Customize Thesis Skins with Background Images, Colors and Gradients. This is the first lesson in a continuing series called Customize Thesis 2.1 Like a Pro. I have a series like this for Thesis 1.8.5 and I am re-creating this with different information for

Customize Skins with Background Images, Colors & Gradients

In this first lesson of our Customize Thesis 2 Like a Pro video tutorial series we look at the various ways to customize a Thesis skin using background images, background color and gradients. We look at both tiling and fixed background images and demonstrate various ways to use them. We also examine how to use

Part 8 – Adjusting Background Images for Mobile Devices

Difficulty Level -

Filed Under Topics - , ,

Listed Under Lesson Subjects - ,

Applies to -

The final part of this Customizing Genesis Child Themes with Background Images and Colors lesson is on how to use media queries to change up the images that you're loading. And the reason you would want to do that here is that these images are way too big for a smaller device. This is just

Part 6 – Using a Fixed Background Image in a Child Theme

Difficulty Level -

Filed Under Topics - ,

Listed Under Lesson Subjects -

Applies to -

Now that we’ve worked on adding a tiling background image to add color to the entire sidebar, we are going to add a fixed background to this Eleven40 Pro site. Again, we're going to come over to Plugins and Add New. We're going to upload my plugin, BYOB Genesis Child Theme Editor. In this case,

Part 5 – Add a Color to the Child Theme Sidebar with a Tiling Image

Filed Under Topics - ,

Listed Under Lesson Subjects -

Applies to -

We just finished using different background colors on different pages and changing the background color of the navigation menu. And the next thing we're going to do with this is to add a background color to the sidebar. But this will be a background color for the sidebar that can go all the way down

Part 4 – Using Different Background Images on Different Pages

Difficulty Level -

Filed Under Topics - , ,

Listed Under Lesson Subjects -

Applies to -

So far we’ve covered how to add tiling background images and adding multiple background images in the same HTML element in Genesis 2 Child Themes. Now we’re going to take a look at using different background images on different pages. Let’s look at a different page than our Home Page. We've got our big blue

Part 3 – Using Multiple Background Images in the Same HTML Element

Difficulty Level -

Filed Under Topics - , ,

Listed Under Lesson Subjects -

Applies to -

We've got our tiled background image added in our Genesis 2 Child Theme, Executive Pro, and we've played around with background image repeat and background image position. One of the great things about CSS3 is it allows us to add more than one background image to the same area. So what we're going to do

Part 2 – Add a Tiling Background Image to the Body of a Child Theme

Difficulty Level -

Filed Under Topics - ,

Listed Under Lesson Subjects -

Applies to -

Now that you know what background images are and how they work in WordPress, the first thing that we're going to do is add a tiling background image. And we'll add that tiling background image to this Genesis Executive Pro Child Theme site here. A tiling background image is a background image that's designed to

Part 1 – Understanding Background Images

Difficulty Level -

Filed Under Topics - ,

Listed Under Lesson Subjects -

Applies to -

Good morning everybody and welcome to this special seminar on Customizing Genesis Child Themes Using Backgrounds, Background Colors and Gradients. This is actually the first lesson in what will be probably a fairly lengthy series that is entitled Customize Genesis Like a Pro. In this series we will be focusing on how to use Custom

Lesson 1 – Customize Child Themes with Background Images & Colors

This is the first lesson in our Customize Genesis Like a Pro video tutorial series. In this lesson we look at customizing various Genesis 2 Child Themes using background images and colors. In this class we introduce basic CSS syntax for editing your child theme. We start off by looking at background images and how

How to Use Carta Media Queries to Make Background Images Responsive

Difficulty Level -

Filed Under Topics - , , ,

Listed Under Lesson Subjects -

In this session we show how to use Carta media queries to make the background images responsive and show the best way to layer text over a background image. We discuss spacing issues with background images. And we also demonstrate how to change the CSS in the media query itself for a background image and

Thesis 2.1 for DIY Website Builders – Part 11 – Add Background Images and Color to Thesis Classic Using Custom CSS

Difficulty Level -

Filed Under Topics - , ,

Listed Under Lesson Subjects -

Applies to -

Now that we’ve removed borders from all page in the Thesis Classic Responsive skin, the next thing we're going to do is add some background colors and background images in Thesis 2.1 to make the page stand out. We’re going to start actually with design. And what I want to do is to take this