set background image conditionally

[ftleow]

Hi guys,

I've set a background image at .site-inner section.

I'm trying to get it to display only if it is front-page.

if ( ! is_front_page() || ! get_background_image() )
		return;

Can someone help with how to go with this? If I use add_action, which section should I use to output it? as I want the bg image to be in .site-inner section.

Or if you have any other recommended solutions for this?

Thank you.

Btw, the code I try to use is from this website. Thanks.

[Genesis Developer]

which child theme are you using? Can you share your current code? We shall look it.

---

Download Genesis Featured Posts Combo Widget | Simple Grid Layouts Plugin for Posts, CPTs and terms
You can request new tips/help.

[ftleow]

Hi Genesis Developer,

I'm using Enterprise Pro theme. Thanks for willing to look. The last thing I want to do is to change the structure of the CSS, which is what I am about to do within these 2 days. After which I will set the background image to be in the widget section instead.

But my option to use the background image in .site-inner is still open if I can set it to display only in front page.

I tried to enqueue another css file which contains:

/* Siteinner
---------------------------------------------------------------------------------------------------- */

.siteinner .site-inner {
	
	background-color: #f5f5f5; 
	background-image: url(images/bg.png);
	background-repeat: repeat-x;
	border-top: 1px solid #ececec;
	clear: both;
	
}

The enqueue I use is (inside the existing enqueue scripts from the theme):

if ( is_front_page()|| is_home() ) {
		
	wp_enqueue_style( 'inner-bg-style', get_stylesheet_directory_uri() . '/css/inner-style.css' );
		
	}

There's no error, just not showing the bg image on front page. I checked the console, the additional css file is enqueued successfully though.

[Genesis Developer]

I am pretty sure that it .siteinner is a wrong CSS classname. You can try this css

.home .site-inner {
	
	background-color: #f5f5f5; 
	background-image: url(images/bg.png);
	background-repeat: repeat-x;
	border-top: 1px solid #ececec;
	clear: both;
	
}

---

Download Genesis Featured Posts Combo Widget | Simple Grid Layouts Plugin for Posts, CPTs and terms
You can request new tips/help.

[tripnetra236]

Use This Code and Check this out.
This is the Only Working Code i Find.
<script type="text/javascript">
$(document).ready(function(){
if (combo.hcs <= 10) && (combo.hcs >= 1)
$(".myClass").css("background-image", "url('BB.png')";
else if (combo.hcs <= 20) && (combo.hcs >= 11)
$(".myClass").css("background-image", "url('BH.png')";
else if (combo.hcs <= 30) && (combo.hcs >= 21)
$(".myClass").css("background-image", "url('BM.png')";
else if (combo.hcs <= 40) && (combo.hcs >= 31)
$(".myClass").css("background-image", "url('HB.png')";
else if (combo.hcs <= 50) && (combo.hcs >= 41)
$(".myClass").css("background-image", "url('HH.png')";
else if (combo.hcs <= 60) && (combo.hcs >= 51)
$(".myClass").css("background-image", "url('HM.png')";
else if (combo.hcs <= 70) && (combo.hcs >= 61)
$(".myClass").css("background-image", "url('MB.pmg')";
else if (combo.hcs <= 80) && (combo.hcs >= 71)
$(".myClass").css("background-image", "url('MH.png')";
else if (combo.hcs <= 99) && (combo.hcs >= 81)
$(".myClass").css("background-image", "url('MM.png')";
}
</script>

[ftleow]

Thanks Genesis Developer. I'm a bit tight with some other tasks' timeline. Haven't tried it, but thanks.

Guys, please stop replying to this thread, this has probably gone off topic a bit.

Thanks.

[Author]

Posts