Docs

[Sitegemz]

I’m trying to overlap a transparent footer with the last section of the page like the picture shown. This needs to take effect on every page I create. The project site is entrisionproject.com

[Sitegemz]

the last file didn’t upload here it is

[Friech]

Hi There,

Thanks for writing in! If you need this setup to all your pages, you might need this part to be on the footer widget areas. And then apply the background image on the entire footer. You might need a custom template to achieve this.

You can enable one footer widget area on Customizer under the Footer panel then look for the Footer Widget Areas option. Then you can edit or add content on the widget area on Appearance > Widgets.

Please provide us login credentials (WP admin & FTP) in private reply, so we can take a closer look.

Thanks.

[Sitegemz]

This reply has been marked as private.

[Sitegemz]

I kinda assumed I could just make the footer bar transparent with the logo & menu then put the pic, text, and buttons on each page I create

[John Ezra]

Hi there,

Thanks for updating the thread! Will it be the same image throughout the site? You can use CSS the following snippets to combine the background of the two footer areas.

You can add this under Custom > CSS in the Customizer or in your child theme’s style.css file.

footer.x-colophon {
    background:none;
}

.x-colophon.top {
	background:transparent;
}

.x-colophon.bottom {
	background:transparent;
}
.footer-background {
	background-image: url('http://keithkennedymasonry.65interactive.com/wp-content/uploads/2015/11/StoneTexture1600900.png');
	background-position: center;
	background-size:cover;
}

Then you can add this under Custom > Javascript in the Customizer.

jQuery( document ).ready(function( $ ) {
 	$('footer.x-colophon.top').each(function(){
    	$(this).next('footer.x-colophon.bottom').andSelf().wrapAll('<div class="footer-background"/>');
	});
});

Hope this helps – thanks!

[Author]

Posts