Hello, This is my Forumotion Site, should you need it:
http://darkness-academy.forumotion.com/

And this is a Screenshot proving my Administration title:
http://prntscr.com/4234vk

I wanted to talk about a question with the Avatar show-up for posting area. I wanted to ask how I can change the overall look of the area. It's all explained in the picture.


Now, after I that I would like to ask how I can add a background image to the whole area. Like placing a background image behind all that you see.

Finally, I want to ask how I can customize the overall look of this entire area, from background image to editing the buttons and everything.

Thank you so much for your time!

24 Hour BUMP

BUMP

Wicked King wrote:24 Hour BUMP

Wicked King wrote:BUMP

Please don't double post. Your post need to be separated by 24 hours before bumping. Please use the edit button instead!

BUMP

Hi Wicked King,
If I understand... for profile: put this in Admin Panel > Display > Pictures and Colors > Colors > CSS stylesheet

Code:

.postprofile {
text-align: center;}

Code:

.postprofile dd {
visibility: hidden;}

for sceditor: You can change in Admin Panel > Display > Pictures and Colors > Colors > CSS stylesheet

Code:


BOLD
.sceditor-button-bold div {
    background-image:url('URL HERE') !important;
    background-position:0 !important;
}
ITALIC
.sceditor-button-italic div {
    background-image:url('URL HERE') !important;
    background-position:0 !important;
}
UNDERLINE
.sceditor-button-underline div {
    background-image:url('URL HERE') !important;
    background-position:0 !important;
}
STRIKE
.sceditor-button-strike div {
    background-image:url('URL HERE') !important;
    background-position:0 !important;
}
CODE
.sceditor-button-code div {
    background-image:url('URL HERE') !important;
    background-position:0 !important;
}
QUOTE
.sceditor-button-quote div {
    background-image:url('URL HERE') !important;
    background-position:0 !important;
}
SPOILER
.sceditor-button-spoiler div {
    background-image:url('URL HERE') !important;
    background-position:0 !important;
}
LINK
.sceditor-button-link div {
    background-image:url('URL HERE') !important;
    background-position:0 !important;
}
IMAGE
.sceditor-button-image div {
    background-image:url('URL HERE') !important;
    background-position:0 !important;
}
FONT SIZE
.sceditor-button-size div {
    background-image:url('URL HERE') !important;
    background-position:0 !important;
}
FONT COLOR
.sceditor-button-color div {
    background-image:url('URL HERE') !important;
    background-position:0 !important;
}
SWITCH EDITOR MODE
.sceditor-button-source div {
    background-image:url('URL HERE') !important;
    background-position:0 !important;
}

I hope help...
Regards & Respect![/code]

Thank you for your submitted answer.

Although your first set of codes did center my profile pic, the second bit did something a bit unwanted.


It has completely hidden the area under that, when all I wanted was to hide the Rank name (not the rank icon), and certain parts of the things underneath. 
You no longer have to tell me how to hide the other Data, I just need to know how to hide the Rank's Name.

The coding for the sceditor you sent me did not work. At all. Although, I do see what you were trying to do; all I was looking for was to be able to change the background color of the text-box, center the sceditor buttons and change that background color, and add a background image to the 'Post a New topic' header.


If it isn't too much, as I don't wanna feel like I'm over working you
Could you tell me how I can design the background colors of those boxes, and add some background images to the headings thereof?

Aha, you want to delete rank image... OK first delete in CSS

Code:

.postprofile dd {
visibility: hidden;}

after that go to:

Admin Panel > Display > Templates > General > viewtopic_body by clicking the modify cog.()
find:

Code:

{postrow.displayed.RANK_IMAGE}

and delete...Do not forget to save the changes to your template and check to see if you're satisfied with the outcome by clicking "Waiting " if you are be sure to click the "" to publish the new template.

For background of sceditor:

Code:

div.sceditor-toolbar {
background: #(Your Color) !important;
}

div.sceditor-container iframe, div.sceditor-container textarea {
background: #(YOUR COLOR) !important;
}

Regards & Respect!

It's not the Rank Image I want to remove, it's the rank text.



The text surrounded in a white circle is what I want to remove. 

Your sceditor code successfully changed the background of my Tool bar and text area, although I would like to see the buttons (Like the bold, under line; etc.) Centered. Right now the buttons seem to be left-aligned, but I want them to be in the center. I feel it'd look better that way. Also, in whatever code you may provide to center the buttons, could you also supply a code that changed the colors of the backgrounds of the buttons?

@SL Grey: Thanks! That removed it just like I wanted.
Now, is there a way to center the buttons in the sceditor, like I want?

Also, is it possible to add a back-ground image via CSS to the Post profile section for the posts?
Thanks!

For aligning the sceditor buttons in the center, try adding this to your CSS:

Code:

div.sceditor-toolbar {
 text-align:center !important;
}

And for changing the background color of the buttons:

Code:

div.sceditor-group {
background:#COLOR !important;
}

@Fierce Star: Thanks! Did just like I wanted it too.

I'm guessing that, if I wanted to add a back-ground image to the Post profile, I would just add this code?

[code]postprofile {
background-image: url("URL HERE");
}

That's pretty much it, only missing the period in front of 'postprofile'.

Code:

.postprofile {
  background-image: url("URL HERE") !important;
}

and if you don't want the background image to repeat, add an additional

Code:

  background-repeat:no-repeat !important;


after

Code:

 background-image: url("URL HERE") !important;

Got it! Thanks a lot, Fierce Star!

Now, I just need on more thing, and this topic is ready to get solved.

How can I edit the text colors, background colors, background-images; etc., of this area right here: 

Solved.