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.

Font Size/Color, Header/Navigation, and Banner Image

View previous topic View next topic Go down

Solved Font Size/Color, Header/Navigation, and Banner Image

Post by cobaltblue on March 21st 2014, 9:12 am

Hello, I need some help.
Sorry if I have too many questions.

1. Font Size
How do you change font size? I tried ACP > Display > Color setting, but it changes all font size (they become smaller). Before I changed it, the font size on posts are too big. Now the post font size is exactly what I want, but the other font become too small.

2. Background or Font Color
As you can see here..

I think there are two solutions: either change background or font color. How to do that?

Also I am testing some codes on post here..


How do I change font settings for that pyramid quotation? Color, background, anything. Also for other codes, like 'code', spoiler, etc.

And how to make that hide code work?


3. Javascript for Header and Navigation
I found this code on forum:
Code:
$(function() {
document.getElementById('i_icon_mini_message').nextSibling.nodeValue='Inbox';
});

Basically it changes what's written on Navigation. "You have no messages" become "Inbox." Is there any way to modify it? Like, if you have message, the notification will be different. Maybe like Inbox (1) or "New Messages".

4. Banner Image
(English isn't my first language, I can't explain it). The banner image looks like too much to the right. What does cause this? The original size of the banner? If that's the case then I only need to change it with smaller image right?



I've played around with html and css codes before and I understand the basics, like changing the value etc, so I guess more advanced editing would be ok for me.

Any help would be much appreciated.


Last edited by cobaltblue on March 21st 2014, 2:50 pm; edited 1 time in total

cobaltblue
New Member

Posts : 11
Reputation : 1
Language : English

http://thewerewolfgame.forumotions.net

Back to top Go down

Solved Re: Font Size/Color, Header/Navigation, and Banner Image

Post by Pizza Boi on March 21st 2014, 9:25 am

Hi Very Happy

I posted my answers in bold red.

@cobaltblue wrote:Hello, I need some help.
Sorry if I have too many questions.

1. Font Size
How do you change font size? I tried ACP > Display > Color setting, but it changes all font size (they become smaller). Before I changed it, the font size on posts are too big. Now the post font size is exactly what I want, but the other font become too small.

Please specify what area you want to have the font size regulated. Please make sure guests are able to view it, or else provide me with a test account via PM Smile.

2. Background or Font Color
As you can see here..

I think there are two solutions: either change background or font color. How to do that?

You have to change the font color if you wish or the background. ACP < Display < Colors < Text Color OR Background Color (Area just adjust the colors in it).

Also I am testing some codes on post here..


How do I change font settings for that pyramid quotation? Color, background, anything. Also for other codes, like 'code', spoiler, etc.

ACP < Display < Color < Quote Color for quote and ACP < Display < Color < Stylesheet < Paste this code:

Code:
.quote, .spoiler {
font-color: Any color you want !important;
}

^ Tell me if the code doesn't work, I will modify it.

And how to make that hide code work?

Use [hide.][/hide]. Please make sure that you remove the ".".


3. Javascript for Header and Navigation
I found this code on forum:
Code:
$(function() {
document.getElementById('i_icon_mini_message').nextSibling.nodeValue='Inbox';
});

Basically it changes what's written on Navigation. "You have no messages" become "Inbox." Is there any way to modify it? Like, if you have message, the notification will be different. Maybe like Inbox (1) or "New Messages".

I'm not so hot on Javascript so I can't help you with this one.

4. Banner Image
(English isn't my first language, I can't explain it). The banner image looks like too much to the right. What does cause this? The original size of the banner? If that's the case then I only need to change it with smaller image right?


Yes, or you can adjust it via CSS.


Code:
#logo {
max-width: #px;
max-height: #px;
}

See if that works. Make sure to change the # to the value you desire!

I've played around with html and css codes before and I understand the basics, like changing the value etc, so I guess more advanced editing would be ok for me.

Any help would be much appreciated.

Regards,
Pizza Boi

Pizza Boi
Hyperactive

Male Posts : 2016
Reputation : 160
Language : French
Location : Pizza Hut!

http://redlustempire.forumtl.com/

Back to top Go down

Solved Re: Font Size/Color, Header/Navigation, and Banner Image

Post by cobaltblue on March 21st 2014, 11:05 am

Thank you. Testing it right now Smile
The logo code doesn't work. Nothing changes after I put that into css stylesheet.
Code:
#logo {
max-width: 700px;
max-height: 242px;
}


I thought I've put my forum link lol. Here http://forumdesign.forumid.net.
I tested post on public area so guests should be able to view it Smile

I want to adjust the font size for regular posts.


Last edited by cobaltblue on March 21st 2014, 11:18 am; edited 1 time in total

cobaltblue
New Member

Posts : 11
Reputation : 1
Language : English

http://thewerewolfgame.forumotions.net

Back to top Go down

Solved Re: Font Size/Color, Header/Navigation, and Banner Image

Post by Pizza Boi on March 21st 2014, 11:11 am

Hi Very Happy

Please try this instead Smile . Sorry, I forgot to input the img, lol.

Code:
#logo > img {
max-height: 300px;
max-width: 800px;
}

Regards,
Pizza Boi

Pizza Boi
Hyperactive

Male Posts : 2016
Reputation : 160
Language : French
Location : Pizza Hut!

http://redlustempire.forumtl.com/

Back to top Go down

Solved Re: Font Size/Color, Header/Navigation, and Banner Image

Post by cobaltblue on March 21st 2014, 12:14 pm

Banner issue is solved. #2 issue is solved too. Thank you so much Very Happy

I don't know if you've read my reply since I edited it before noticing your post. I want to adjust font-size on regular posts.

Code for spoiler and quote doesn't work (font-color). I modified it for "background color" and it works, but only for spoiler; quote stays the same. I tried to test "hide" and "code" too, lol, and no dice.
Here's what I use:
Code:
   .code, .hide, .quote, .spoiler, {
    font-color: #EBD7AB !important;
    background-color:  #403416 !important;
    }
Actually I want to set font and background color quote-inside-quote to be the same.

What I mean by this:
And how to make that hide code work?
..how is that supposed to appear on forum? Because all I see from hide code is not different from quote.
I was thinking it would hide post we write, works for same purpose as spoiler, and you need to hover on the sentence to see it.

Edit: I forgot to ask. There's this problem too.

It's out of layout. Is there any way to fix this?

cobaltblue
New Member

Posts : 11
Reputation : 1
Language : English

http://thewerewolfgame.forumotions.net

Back to top Go down

Solved Re: Font Size/Color, Header/Navigation, and Banner Image

Post by Pizza Boi on March 21st 2014, 1:06 pm

Hi Very Happy

Please try this for your code, quote, spoiler design.

Code:
/* Spoiler, Quote, and Code */
td.code, td.quote, td.spoiler_content{
    background-color:#807272;
    border:1px solid #A31919;
    box-shadow:0px 0px 6px #e8e8e8 inset;
    background-image:url('IMG Link');
    background-repeat:no-repeat;
    background-position:right bottom;
}

td.spoiler_closed{
    background-color:#000;
    border:1px solid #A31919;
    box-shadow:0px 0px 6px #c00 inset;
}

.code, .quote, .spoiler{
    border-radius: 5px;
    -webkit-border-radius: 5px;
}

div dl.codebox dd div.spoiler_content img {
    max-width: 600px;
    max-height: 400px;
}

My relative helped me in doing this so credits goes to Kaizer Lee as well. 

The hide portion, I don't get it, sorry :/ ....

Are you using this for your CSS in the page bottom?

Code:
#page-body p.page-bottom {
border-left: 0px solid rgb(255, 84, 0);
left: 620px;
margin-bottom: -47px;
padding: 9px;
position: relative;
top: -100px;
width: 350px;
}

Please add this to fix it:

Code:
p.page-bottom {
position: relative !important;
left: 550px !important;
}

Hope they work x_x...

Regards,
Pizza Boi

Pizza Boi
Hyperactive

Male Posts : 2016
Reputation : 160
Language : French
Location : Pizza Hut!

http://redlustempire.forumtl.com/

Back to top Go down

Solved Re: Font Size/Color, Header/Navigation, and Banner Image

Post by cobaltblue on March 21st 2014, 2:49 pm

Problem with bottom page is solved.

The code for spoiler etc still doesn't work. I looked around and found a code that works:

To fix background color and font color for "[code.][/code.]"
Code:
   .codebox, code{
        background-color: #HEX !important;
   border-color: #HEX !important;
        color: #HEX !important;
            }

To fix background color and font color for spoiler
Code:
   .spoiler_content {
        background-color: #HEX;
        border: 1px solid #HEX;
        color: #HEX;
        font-size: 11px;
        line-height: 125%;
    }

I still can't find the solution for the same issue on "[hide.][/hide.]" code. I still can't change the font color.

Anyways, I misunderstood how "hide" code works. That code works to hide posts for users who haven't posted in particular thread.

Thanks, Pizza Boi. You've been such great help Very Happy

I guess I can just open another thread for last two problems.

cobaltblue
New Member

Posts : 11
Reputation : 1
Language : English

http://thewerewolfgame.forumotions.net

Back to top Go down

Solved Re: Font Size/Color, Header/Navigation, and Banner Image

Post by Pizza Boi on March 21st 2014, 3:12 pm

Hi Very Happy

This is my final attempt for this topic:

Code:

dl.codebox code {
color: #Hex color;
background-color: #Hex color; /* If you want this to have a unique color of  its own */
}

dl.code box {
background-color: #Hex color; /* For spoiler and codebox background color */
}

.spoiler_content.hidden {
color: #Hex color; /* Color of the spoiler in hidden form */
}

.spoiler_content {
color: #Hex color;  /* Spoiler color for not hidden */
}

.content blockquote {
color: #Hex color; /* Quote text color change */
}

blockquote {
background-color: #Hex color; /* Change hex color for background of quote */
}

You can incorporate everything into one code if you please but I suggest dividing them for uniqueness.

Regards,
Pizza Boi

Pizza Boi
Hyperactive

Male Posts : 2016
Reputation : 160
Language : French
Location : Pizza Hut!

http://redlustempire.forumtl.com/

Back to top Go down

Solved Re: Font Size/Color, Header/Navigation, and Banner Image

Post by SLGray on March 21st 2014, 10:42 pm

Is this solved?


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


SLGray
Administrator
Administrator

Male Posts : 36697
Reputation : 2445
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

Solved Re: Font Size/Color, Header/Navigation, and Banner Image

Post by cobaltblue on March 22nd 2014, 12:08 am

@Pizza Boi wrote:Hi Very Happy

This is my final attempt for this topic:

Code:

dl.codebox code {
color: #Hex color;
background-color: #Hex color; /* If you want this to have a unique color of  its own */
}

dl.code box {
background-color: #Hex color; /* For spoiler and codebox background color */
}

.spoiler_content.hidden {
color: #Hex color; /* Color of the spoiler in hidden form */
}

.spoiler_content {
color: #Hex color;  /* Spoiler color for not hidden */
}

.content blockquote {
color: #Hex color; /* Quote text color change */
}

blockquote {
background-color: #Hex color; /* Change hex color for background of quote */
}

You can incorporate everything into one code if you please but I suggest dividing them for uniqueness.

Regards,
Pizza Boi

Yes, it's solved.

I'll give last feedback in case there are others who see this in the future.
This code doesn't seem to work:
Code:
dl.code box {
background-color: #Hex color; /* For spoiler and codebox background color */
}

I played around with it and I got this:
Code:
   .codebox {
    background-color: #hex !important; /* Background color of spoiler, codebox, and hidebox */
    }


This one..
Code:
   .spoiler_content.hidden {
    color: #hex; /* Text color in spoiler */
    }

..works in similar manner with this:
Code:
   .spoiler_content {
    color: #hex !important; /* Text color in spoiler */
    }

No difference.

This one works for code (I had to add !important):
Code:
   dl.codebox code {
    color: #hex !important; /* Text color in codebox */
    background-color: #hex; /* Background color in codebox */
    }

All color codes for quote work.

cobaltblue
New Member

Posts : 11
Reputation : 1
Language : English

http://thewerewolfgame.forumotions.net

Back to top Go down

Solved Re: Font Size/Color, Header/Navigation, and Banner Image

Post by SLGray on March 22nd 2014, 6:23 am

Problem solved & topic archived.


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


SLGray
Administrator
Administrator

Male Posts : 36697
Reputation : 2445
Language : English
Location : United States

http://ztwds.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