The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

Custom bg code

View previous topic View next topic Go down

Solved Custom bg code

Post by FrostByte on May 31st 2013, 11:10 pm

So, I am trying to allow custom backgrounds for admins and mods. I remember reading a thread that had a code

Code:
$(function(e) {
$('.post:contains(Admin or Mod)').css('background-color','red');
});

Now, I entered this in the CSS under the Colours and backgrounds for common.css

Thing is, it never worked. Is there supposed to be an extra add on and stuff?

Forum here:

http://narutobuddy.forumotion.com/

Thanks!

-FrostByte-

FrostByte
New Member

Posts : 9
Reputation : 1
Language : English

Back to top Go down

Solved Re: Custom bg code

Post by Sir. Mayo on May 31st 2013, 11:20 pm

Use this code instead:

Code:
$(function() {
$('div.post:has(".admin1")').css('background','#F00 url(http://i.imgur.com/BVlbi.png) repeat-y');
});

Also when you add it make sure you check the box that says in all pages.
Now
If you use this code make sure in Rank Administration the Rank title is

Code:

    <span class="admin1">Rank Title Here</span>


You can also give this a read.
http://help.forumotion.com/t123317-change-the-post-background-color-of-a-specific-user

Look for the post by sir chavis.

Sir. Mayo
Forumember

Male Posts : 961
Reputation : 84
Language : English, Some french.
Location : Working 11Pm-7Am EST I will try to respond ASAP

http://sir-mayo.forumotion.com/

Back to top Go down

Solved Re: Custom bg code

Post by FrostByte on June 1st 2013, 12:01 am

Here's what happened.... this is the code for the CSS total

Code:
/*     
--------------------------------------------------------------
Colours and backgrounds for common.css
-------------------------------------------------------------- */
$(function() {
$('div.post:has(".admin1")').css('background','#F00 url(http://i.imgur.com/BVlbi.png) repeat-y');
});
}
html, body {
   color: #536482;
   background-color: #373737;
}


h1 {
   color: #FFFFFF;
}

h2 {
   color: #28313F;
}

h3 {
   border-bottom-color: #CCCCCC;
   color: #115098;
}

hr {
   border-color: #FFFFFF;
   border-top-color: #CCCCCC;
}

hr.dashed {
   border-top-color: #CCCCCC;
}

I changed the rank administrator the that:
Code:
 <span class="admin1">Administrator</span>

Yet it still doesn't work. I thought I got close though.

FrostByte
New Member

Posts : 9
Reputation : 1
Language : English

Back to top Go down

Solved Re: Custom bg code

Post by Sir. Mayo on June 1st 2013, 12:07 am

I did what you did and all it did was change my text humm... Im still looking in to it to see how to do it for you


Ok so i found out how to do it;


@FrostByte wrote:Here's what happened.... this is the code for the CSS total

Code:
/*     
--------------------------------------------------------------
Colours and backgrounds for common.css
-------------------------------------------------------------- */
$(function() {
$('div.post:has(".admin1")').css('background','#F00 url(http://i.imgur.com/BVlbi.png) repeat-y');
});
}
html, body {
   color: #536482;
   background-color: #373737;
}


h1 {
   color: #FFFFFF;
}

h2 {
   color: #28313F;
}

h3 {
   border-bottom-color: #CCCCCC;
   color: #115098;
}

hr {
   border-color: #FFFFFF;
   border-top-color: #CCCCCC;
}

hr.dashed {
   border-top-color: #CCCCCC;
}

I changed the rank administrator the that:
Code:
 <span class="admin1">Administrator</span>

Yet it still doesn't work. I thought I got close though.

Remove all of that form your forum

Now in Rank Administration set the Rank title to
Code:
<span class="Administrator">Administrator</span>

Then add this to Java script management

Code:
$(function() {
   $('.Administrator').Administrator('.post').addClass('Administrator-answer');
   });
Make sure its set to all pages.

And now add this to your CSS style sheet:
Code:
.post.online.Administrator-answer {
       background: url("http://i.imgur.com/BVlbi.png") repeat-y scroll left top, url("http://illiweb.com/fa/prosilver/icon_user_online_en.png") no-repeat scroll right top #E5F1F9;
       }
       .post.Administrator-answer {
       background: url("http://i.imgur.com/BVlbi.png") repeat-y scroll left top #E5F1F9;
       }

I Modfied it from a nother post to fit your needs hope i did it right.
This is where i got the code to modify for you:
http://help.forumotion.com/t112318-helpgroup-backgrounds#736903

Sir. Mayo
Forumember

Male Posts : 961
Reputation : 84
Language : English, Some french.
Location : Working 11Pm-7Am EST I will try to respond ASAP

http://sir-mayo.forumotion.com/

Back to top Go down

Solved Re: Custom bg code

Post by FrostByte on June 1st 2013, 12:38 am

When you say delete..... do you mean delete all the CSS? O.o
Or just the add on and leave the original stuff there?


Code:
/*   
--------------------------------------------------------------
Colours and backgrounds for common.css
-------------------------------------------------------------- */
$(function() {
$('div.post:has(".admin1")').css('background','#F00 url(http://i.imgur.com/BVlbi.png) repeat-y');
});  < Remove just this?
}
html, body {
  color: #536482;
  background-color: #373737;
}


h1 {
  color: #FFFFFF;
}

h2 {
  color: #28313F;
}

h3 {
  border-bottom-color: #CCCCCC;
  color: #115098;
}

hr {
  border-color: #FFFFFF;
  border-top-color: #CCCCCC;
}

hr.dashed {
  border-top-color: #CCCCCC;
}


Ok, so I did that. Here is the current CSS.

Code:
/*     
--------------------------------------------------------------
Colours and backgrounds for common.css
-------------------------------------------------------------- */
html, body {
   color: #536482;
   background-color: #373737;
}

h1 {
   color: #FFFFFF;
}

h2 {
   color: #28313F;
}

h3 {
   border-bottom-color: #CCCCCC;
   color: #115098;
}

hr {
   border-color: #FFFFFF;
   border-top-color: #CCCCCC;
}

hr.dashed {
   border-top-color: #CCCCCC;
}

.post.online.Administrator-answer {
      background: url("http://i.imgur.com/BVlbi.png") repeat-y scroll left top, url("http://illiweb.com/fa/prosilver/icon_user_online_en.png") no-repeat scroll right top #E5F1F9;
      }
      .post.Administrator-answer {
      background: url("http://i.imgur.com/BVlbi.png") repeat-y scroll left top #E5F1F9;
      }

I don't know if I am supposed to remove EVERYTHING else besides that code? It still didn't show up, and it's set to all pages o.o


Last edited by FrostByte on June 1st 2013, 1:02 am; edited 1 time in total

FrostByte
New Member

Posts : 9
Reputation : 1
Language : English

Back to top Go down

Solved Re: Custom bg code

Post by Sir. Mayo on June 1st 2013, 12:57 am

remove just this:
Code:
$(function() {
$('div.post:has(".admin1")').css('background','#F00 url(http://i.imgur.com/BVlbi.png) repeat-y');
});

So yes remove the add on and leave the orginal stuff.
i also had to tweak the code again so re read it i had to edit in a part i missed

Sir. Mayo
Forumember

Male Posts : 961
Reputation : 84
Language : English, Some french.
Location : Working 11Pm-7Am EST I will try to respond ASAP

http://sir-mayo.forumotion.com/

Back to top Go down

Solved Re: Custom bg code

Post by FrostByte on June 1st 2013, 1:05 am

Ok, here is the current code for the CSS

Code:
/*   
--------------------------------------------------------------
Colours and backgrounds for common.css
-------------------------------------------------------------- */
html, body {
  color: #536482;
  background-color: #373737;
}

h1 {
  color: #FFFFFF;
}

h2 {
  color: #28313F;
}

h3 {
  border-bottom-color: #CCCCCC;
  color: #115098;
}

hr {
  border-color: #FFFFFF;
  border-top-color: #CCCCCC;
}

hr.dashed {
  border-top-color: #CCCCCC;
}

.post.online.Administrator-answer {
      background: url("http://i.imgur.com/BVlbi.png") repeat-y scroll left top, url("http://illiweb.com/fa/prosilver/icon_user_online_en.png") no-repeat scroll right top #E5F1F9;
      }
      .post.Administrator-answer {
      background: url("http://i.imgur.com/BVlbi.png") repeat-y scroll left top #E5F1F9;
      }

JS page managerment(Named Custom bg)

Code:
$(function() {
  $('.Administrator').Administrator('.post').addClass('Administrator-answer');
  });

Rank title is:
Code:
<span class="Administrator">Administrator</span>


Still isn't showing up. It's still showing the plain white bg.

FrostByte
New Member

Posts : 9
Reputation : 1
Language : English

Back to top Go down

Solved Re: Custom bg code

Post by Sir. Mayo on June 1st 2013, 1:10 am

Then try removeing everything from CSS.
and leaving just
.
Code:
post.online.Administrator-answer {
      background: url("http://i.imgur.com/BVlbi.png") repeat-y scroll left top, url("http://illiweb.com/fa/prosilver/icon_user_online_en.png") no-repeat scroll right top #E5F1F9;
      }
      .post.Administrator-answer {
      background: url("http://i.imgur.com/BVlbi.png") repeat-y scroll left top #E5F1F9;
      }


And replace this in the java management page:
Code:
$(function() {
  $('.Administrator').closest('.post').addClass('Administrator-answer');
  });
You can always re enter it if it does not work!
But if it does not, Then The only other thing i can think of is when i altered it i messeed it up so follow the exact way its written here:help.forumotion.com/t112318-helpgroup-backgrounds#736903


Last edited by Sir. Mayo on June 1st 2013, 1:46 am; edited 1 time in total

Sir. Mayo
Forumember

Male Posts : 961
Reputation : 84
Language : English, Some french.
Location : Working 11Pm-7Am EST I will try to respond ASAP

http://sir-mayo.forumotion.com/

Back to top Go down

Solved Re: Custom bg code

Post by FrostByte on June 1st 2013, 1:42 am

Tis my mistake. I forgot to enable it.

Thanks a lot! It works xD

*Mark as solved*

FrostByte
New Member

Posts : 9
Reputation : 1
Language : English

Back to top Go down

Solved Re: Custom bg code

Post by Sir. Mayo on June 1st 2013, 2:06 am

Ok Good what Code did you end yup Using, that way i can Mark at as this one to use, So others will know

Sir. Mayo
Forumember

Male Posts : 961
Reputation : 84
Language : English, Some french.
Location : Working 11Pm-7Am EST I will try to respond ASAP

http://sir-mayo.forumotion.com/

Back to top Go down

Solved Re: Custom bg code

Post by FrostByte on June 1st 2013, 2:13 am

CSS code:

Code:
.post.online.Administrator-answer {
      background: url("http://i.imgur.com/kFOpiqv.jpg") repeat-y scroll left top, url("http://illiweb.com/fa/prosilver/icon_user_online_en.png") no-repeat scroll right top #E5F1F9;
      }
      .post.Administrator-answer {
      background: url("http://i.imgur.com/kFOpiqv.jpg") repeat-y scroll left top #E5F1F9;
      }

Js manager code:

Code:
$(function() {
$('.Administrator').closest('.post').addClass('Administrator-answer');
});

Rank title:

Code:
<span class="Administrator">Administrator</span>

I changed the CSS picture to my own pic. But it worked. Thanks!

FrostByte
New Member

Posts : 9
Reputation : 1
Language : English

Back to top Go down

Solved Re: Custom bg code

Post by SLGray on June 1st 2013, 4:46 am

Topic Solved & Locked


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 35641
Reputation : 2374
Language : English
Location : United States

http://fmthemes.forumotion.com/

Back to top Go down

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum