Infinity Pro: Add background images to widgets without ?

[Boblebad]

Hi

I'm trying to figure out how to background images to widgets that does not have them. When looking at settings and background images, there's only the ones used and no possibility to add new ones.

How are they add and also added to the CSS without showing up in the CSS of the site or in the widgets ?

All the best
Carsten

[Brad Dalton]

Link to the site in question please.

There's 4 steps:

Step 1 : Change the class in each widget in front-page.php from solid-section to image-section

Step 2 : Modify the PHP code in customize.php to include all widgets

Step 3 : Modify the PHP code in output.php to include all widgets

Step 4 : Modify the CSS in style-front.css for each widget which now uses a image.

You can also add default background images for each new widget in the images folder.

---

Get Help – Book Consultation.

[Victor Font]

Anything you do in the WordPress customizer is added as inline CSS, meaning it is added to the page header when the page is generated. It's easy, however, to change the widgets that have images with Infinity Pro. There is a filter. Add this to the theme's /lib/helper-functions.php file.

add_filter( 'infinity_images',  'add_infinity_pro_widget_images');
function add_infinity_pro_widget_images($images) {
    $images = array( '1', '2', '3', '4', '5', '6', '7' );
    return $images;
};

This adds images to all widget areas. Remove the numbers you don't want. Change the classes in front-page.php from solid section to image-section.

---

Regards,

Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?

[Boblebad]

Thank you Victor 🙂

That was a nice and easy way to do it and it all shows up under settings.

[Brad Dalton]

No need to modify the CSS?

---

Get Help – Book Consultation.

[Boblebad]

Works just perfect. I can add images without any trouble at all. No need to anything else than add Victor's code 🙂

[Boblebad]

Ohh, just a question.

How will this work on a child theme where i put the changes to Infinity Pro. Will it go look for helper-functions.php by itself ?

And what does the style.css need to hold these days to work ?

[t-west]

@Boblebad After you were able to add background images to those widgets, could you just add a text widget and write text over the background image?

[Author]

Posts