Post Background Image

[McKlub]

Hello,

I am working on upgrading one of my themes from 3.4 to 4.x, and am having some trouble with my post backgrounds based on usergroups. This is what it looks like on 3.4, but I can't seem to get it working at all on 4.x. Can anyone help me out with this?

 

 

[GradientWizzard]

You could always do something like this

	<!--Replace X with the Group ID For 1 Colour Background--> 
    {{if member.inGroup('x')}}    
    
    <div id="postbackground">post code</div> 
    
    <!--Replace X with the second group ID For a different Colour Background--> 
    
    {{elseif member.ingroup('x')}}      
    
    <div id="postbackground">post code</div> 
    
    {{else}} 
    
    <!--make a standard div to display to members--> 
    
    <div id="postbackground">Post code</div> 
    
    {{endif}}

Edited July 9, 2017 by Captain America

[Cookie Monster]

I'm not the best theme(r) but I would think you can use if else statements. And default usergroup as a fallback.

So if usergroup is X then this colour. Else this

[Cookie Monster]

2 hours ago, Captain America said:

You could always do something like this

	<!--Replace X with the Group ID For 1 Colour Background--> 
    {{if member.inGroup('x')}}    
    
    <div id="postbackground">post code</div> 
    
    <!--Replace X with the second group ID For a different Colour Background--> 
    
    {{elseif member.ingroup('x')}}      
    
    <div id="postbackground">post code</div> 
    
    {{else}} 
    
    <!--make a standard div to display to members--> 
    
    <div id="postbackground">Post code</div> 
    
    {{endif}}

Also to note you can continue  {{else if}} for as many groups as you want with different code. Just remember to end it with {{else}}  {{endif}}

[McKlub]

1 hour ago, Cookie Monster said:

Also to note you can continue  {{else if}} for as many groups as you want with different code. Just remember to end it with {{else}}  {{endif}}

 

3 hours ago, Captain America said:

You could always do something like this

	<!--Replace X with the Group ID For 1 Colour Background--> 
    {{if member.inGroup('x')}}    
    
    <div id="postbackground">post code</div> 
    
    <!--Replace X with the second group ID For a different Colour Background--> 
    
    {{elseif member.ingroup('x')}}      
    
    <div id="postbackground">post code</div> 
    
    {{else}} 
    
    <!--make a standard div to display to members--> 
    
    <div id="postbackground">Post code</div> 
    
    {{endif}}

Awesome. Now where would you suggest this go? I currently have this in forums.css: 

.cPost.ipsComment .ipsType_richText {
	padding-top: 8px;
    padding-left: 30px;
width: 640px;
background: url(../resources/forumBubbleGrey.png) left top no-repeat, url(../resources/forumBubbleGrey.png) right bottom no-repeat, url(../resources/forumBubbleGrey.png) center top repeat-y;
}
.cPost.ipsComment > .cPost.ipsComment{
margin: 0px;
background:none;
}

However I can't seem to figure out how to make it call this for regular users like in your example code. If it helps, this is what my 3.4 style's ipb_styles.css looked like for the backgrounds:

.post_body {
	margin: 0 10px 0 136px;
	padding-top: 8px;
width: 640px;
background: url({style_images_url}/forumBubbleGrey.png) left top no-repeat, url({style_images_url}/forumBubbleGrey.png) right bottom no-repeat, url({style_images_url}/forumBubbleGrey.png) center top repeat-y;
}
.post_body > .post_body{
margin: 0px;
background:none;
}

.post_body.mod {
background: url({style_images_url}/forumBubbleGreen.png) left top no-repeat, url({style_images_url}/forumBubbleGreen.png) right bottom no-repeat, url({style_images_url}/forumBubbleGreen.png) center top repeat-y;
}

.post_body.admin {
background: url({style_images_url}/forumBubbleGold.png) left top no-repeat, url({style_images_url}/forumBubbleGold.png) right bottom no-repeat, url({style_images_url}/forumBubbleGold.png) center top repeat-y;
}

 

Edited July 9, 2017 by McKlub

[McKlub]

Bump, still having some trouble.

[Cookie Monster]

	<!--Replace X with the Group ID For 1 Colour Background--> 
    {{if member.inGroup('x')}}    
    
    <div id="post body_XXX">post code</div> 
    
    <!--Replace X with the second group ID For a different Colour Background--> 
    
    {{elseif member.ingroup('x')}}      
    
    <div id="post_body admin">post code</div> 

	{{elseif member.ingroup('x')}}      
    
    <div id="post_body mod">post code</div> 
    
    {{else}} 
    
    <!--make a standard div to display to members--> 
    
    <div id="post_body member">Post code</div> 
    
    {{endif}}

 

So the DIVS are the HTML you need to edit, from that you need to create the css for each group that you want to custom.

[McKlub]

On 7/16/2017 at 0:13 PM, Cookie Monster said:

	<!--Replace X with the Group ID For 1 Colour Background--> 
    {{if member.inGroup('x')}}    
    
    <div id="post body_XXX">post code</div> 
    
    <!--Replace X with the second group ID For a different Colour Background--> 
    
    {{elseif member.ingroup('x')}}      
    
    <div id="post_body admin">post code</div> 

	{{elseif member.ingroup('x')}}      
    
    <div id="post_body mod">post code</div> 
    
    {{else}} 
    
    <!--make a standard div to display to members--> 
    
    <div id="post_body member">Post code</div> 
    
    {{endif}}

 

So the DIVS are the HTML you need to edit, from that you need to create the css for each group that you want to custom.

Okay I understand that, but what do I put in place of "post code"? No clue why this is being so confusing for me haha now when if I'm logged into an admin account, all posts show the admin background. If I am logged into a regular user, all posts show as a regular background. 

 

EDIT: Got it to work! Thanks guys!

Edited July 18, 2017 by McKlub

[GradientWizzard]

The question(s) in this support topic have been answered and the topic author has resolved their issue. This topic is now closed. If you have other questions, please open a new topic.