Altitude Pro – Full width background image

[AHereld]

Trying to create a full-width background image that I can use on this page. I want it to be a background image, so I can create text over the top of it. Problem is when resizing the screen. Need to limit the height, but still allow it to go full width without distorting.

My next line here "A dozen life insurance companies" will go up inside the blue area when resizing. I want that to always be below the blue. Hope that makes sense. :/

http://communityinsurancegroup.com/aaa/

[greenpoint]

Hello, Sir, I want to learn, how to set homepage background image slider instead of fixed image in altitude pro theme and change text for each image slide

[eppiemcm]

Hi there, I found this article after much searching. I hope it will help:
https://journalxtra.com/wordpress/snippets/use-wordpress-featured-image-post-page-background-picture/

This makes your "Featured Image" image the full width background image. You would need to also add some styling in your CSS to make this display as you want it to.

At end of functions.php in Altitude Pro:

---

add_action( 'wp_head', 'vr_set_featured_background', 99);
function vr_set_featured_background() {
$image_url = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), array(1600), false );
if ($image_url[0]) {
?>
<style>

html,body {
height:100%;
margin:0!important;
}
body {
background-color:#ef3340;
background:url(<?php echo $image_url[0]; ?>) #000 left top no-repeat;
background-size: 100% ;
}
/* Uncomment if the image hangs low in a Genesis theme */
/*.site-inner {
padding-top:0!important;
padding-bottom:0!important;
}*/
</style>
<?php
}
}

[Author]

Posts