Thread Rating:
  • 0 Vote(s) - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
Solved: 4 Years, 8 Months, 4 Weeks ago Add colours to background post of user groups
#31
Solved: 4 Years, 8 Months, 4 Weeks ago
I don't want to have multiple colors for usergroups so that my forum would look like a rainbow. I would like to have two usergroups,, admin and staff as additional usergroups to show. How do I do that while keeping the multiple different "main" usergroups? What is the best way to achieve this?
Reply
#32
Solved: 4 Years, 8 Months, 4 Weeks ago
Eg:
SupMod group ID = 3
Admin group ID = 4
Mod group ID = 6


Make the template changes as written above and add to showthread.css:
.post_3,
.post_4,
.post_6{
   background: red; /* your desired post background color for UID 3,4,6 */
}
Greetings Sven (ps: Sorry for my bad english!!)

My plugins - [email protected]
Reply
#33
Solved: 4 Years, 8 Months, 4 Weeks ago
(01-14-2015, 04:42 PM)SvePu Wrote: Eg:
SupMod group ID = 3
Admin group ID = 4
Mod group ID = 6


Make the template changes as written above and add to showthread.css:

.post_3,
.post_4,
.post_6{
   background: red; /* your desired post background color for UID 3,4,6 */
}

I guess that could work, thanks! Tutorial made sense to me. I edited it to have the border color around the author information change. It was just subtle enough for my needs.
Reply
#34
Solved: 4 Years, 8 Months, 4 Weeks ago
I was wondering how I could do something like this but with profiles, but like I want to add an image instead of a color.
Reply
#35
Solved: 4 Years, 8 Months, 4 Weeks ago
There is a place for an image in the group settings. Were you needing additional images?
Reply
#36
Solved: 4 Years, 8 Months, 4 Weeks ago
(01-14-2015, 06:55 PM)user25 Wrote: There is a place for an image in the group settings. Were you needing additional images?

I mean not userbars, I mean like on the profiles.
Reply
#37
Solved: 4 Years, 8 Months, 4 Weeks ago
It's nearly the same way like in post content.

Edit the theme postbit template:

Search:
<div class="post_author>

Replace all with:
<div class="post_author profile_gid{$usergroup['gid']}">


and/or edit the theme postbit_classic template:

Search:
<div class="post_author scaleimages">

Replace all with:
<div class="post_author profile_gid{$usergroup['gid']} scaleimages">


Finally add the matching css rules into theme showthread.css.

CSS example for user group 2 and 4:
.post .profile_gid2 {
background-image: url(images/gid2.jpg);
background-repeat: no-repeat;
background-position: 50% 50%;
-webkit-background-size: cover;   
-moz-background-size: cover;   
-o-background-size: cover;   
background-size: cover;
}
.post .profile_gid4 {
background-image: url(images/gid4.jpg);
background-repeat: no-repeat;
background-position: 50% 50%;
-webkit-background-size: cover;   
-moz-background-size: cover;   
-o-background-size: cover;   
background-size: cover;
}

Result in classic layout:

   
Greetings Sven (ps: Sorry for my bad english!!)

My plugins - [email protected]
Reply
#38
Solved: 4 Years, 8 Months, 4 Weeks ago
(01-16-2015, 11:29 PM)SvePu Wrote: It's nearly the same way like in post content.

Edit the theme postbit template:

Search:
<div class="post_author>

Replace all with:
<div class="post_author profile_gid{$usergroup['gid']}">


and/or edit the theme postbit_classic template:

Search:
<div class="post_author scaleimages">

Replace all with:
<div class="post_author profile_gid{$usergroup['gid']} scaleimages">


Finally add the matching css rules into theme showthread.css.

CSS example for user group 2 and 4:
.post .profile_gid2 {
background-image: url(images/gid2.jpg);
background-repeat: no-repeat;
background-position: 50% 50%;
-webkit-background-size: cover;
background-size: cover;
}
.post .profile_gid4 {
background-image: url(images/gid4.jpg);
background-repeat: no-repeat;
background-position: 50% 50%;
-webkit-background-size: cover;
background-size: cover;
}

Result in classic layout:

Actually I am just saying I want an image on the profile.
I don't want it to do anything with post bits.
I just want an image to be on the profile.
But I am not exactly sure the proper code to do this with. But I will try messing with the code you have before in the profile template
Reply
#39
Solved: 4 Years, 8 Months, 4 Weeks ago
I thought you mean the user profile in postbit because we are talking about posts in this topic.
But what you want is almost the same stuff.

Open the theme template "member_profile" to edit.

Search for:
{$header}
<fieldset>

Replace this part with:
{$header}
<fieldset class="memprofile_gid{$memprofile['usergroup']}">

Save changes and open theme "css3.css" in advanced mode to edit

Add your desired css rules to that file and saved your changes.

CSS example
fieldset[class^=memprofile_gid] {
    background-repeat: no-repeat;
    background-position: 50% 50%;
    -webkit-background-size: cover;   
    -moz-background-size: cover;   
    -o-background-size: cover;   
    background-size: cover;
}

fieldset.memprofile_gid4 {
	background-image: url(images/profile_gid4.jpg);
}

fieldset.memprofile_gid2 {
    background-image: url(images/profile_gid2.jpg);
}

Results:
       
Greetings Sven (ps: Sorry for my bad english!!)

My plugins - [email protected]
Reply
#40
Solved: 4 Years, 8 Months, 4 Weeks ago
(01-17-2015, 11:29 AM)SvePu Wrote: I thought you mean the user profile in postbit because we are talking about posts in this topic.
But what you want is almost the same stuff.

Open the theme template "member_profile" to edit.

Search for:
{$header}
<fieldset>

Replace this part with:
{$header}
<fieldset class="memprofile_gid{$memprofile['usergroup']}">

Save changes and open theme "css3.css" in advanced mode to edit

Add your desired css rules to that file and saved your changes.

CSS example
fieldset[class^=memprofile_gid] {
    background-repeat: no-repeat;
    background-position: 50% 50%;
    -webkit-background-size: cover;   
    -moz-background-size: cover;   
    -o-background-size: cover;   
    background-size: cover;
}

fieldset.memprofile_gid4 {
	background-image: url(images/profile_gid4.jpg);
}

fieldset.memprofile_gid2 {
    background-image: url(images/profile_gid2.jpg);
}

Results:

That is still not really what I want, but I will use this code to do it as I know how to change it
Reply


Forum Jump:


Users browsing this thread: 1 Guest(s)