Archived topic
Changing off canvas menu background image to use featured image
1 reply · Started by JBD on October 27, 2019
Viewing posts 1–2 of 2
Hi,
Currently I use CSS to change the off canvas menu background image
.main-navigation.slideout-navigation {
height: 100vh;
background: url('/wp-content/uploads/2019/10/menu-back-2.jpg') no-repeat bottom right;
background-size: cover;
background-repeat: no-repeat;
}Is there a way to use each pages "featured image" as the background image?
Hi there,
could give this a shot:
1. Create a new Hook Element, select the WP_head hook.
2. Add this content:
<?php
$page_id = get_queried_object_id();
if ( has_post_thumbnail( $page_id ) ) :
$image_array = wp_get_attachment_image_src( get_post_thumbnail_id( $page_id ), 'full' );
$image = $image_array[0];
echo '<style type="text/css">
.main-navigation.slideout-navigation {
background-image: url(' . $image . ');
background-size: cover;
background-repeat: no-repeat;
}
</style>';
endif;
?>3. Check execute PHP and set your display rules.
This archived topic is closed to new replies.
