(CSS) Changing how your board name looks

Cool Tips & Tricks	Help Communities:

<< Prev Topic | Next Topic >>

Cool Tips & Tricks ::: CSS FAQ ::: (CSS) Changing how your board name looks

Topic: (CSS) Changing how your board name looks

(?)

atlass

Registered User
ezSupporter
Posts: 234

Posted: 10/29/01 12:11 pm

(CSS) Changing how your board name looks

The board name and subsequent forum names that appear at the top of each page (On this page it says Next Topic >>
Cool Tips N Tricks ::: CSS ::: Changing how your board name looks) can be changed using CSS if you have a particular thing in mind.

There is only one problem - on most layouts the class/tag that controls this text is .headings on the thread list and thread pages, and H4 on the forum list page. That just means that you need to make both of these the SAME definition.

To make a filter affect this text (for glowing text, dropshadows, etc - see list here) You would insert the following code into the first box in your advanced area (example using red Digitmed typeface and black dropshadow filter):

<** style>

h4 {
font-family: digitmed, digitalICG, verdana, sans-serif;
color: #CC0000;
Filter: DropShadow(Color=#000000, OffX=2, OffY=2, Positive=1);
width: inherit;
height: 20px
}

.headings {
font-family: digitmed, digitalICG, verdana, sans-serif;
color: #CC0000;
Filter: DropShadow(Color=#000000, OffX=2, OffY=2, Positive=1);
width: inherit;
height: 20px
}

<**/style>

(remove **'s first.)

And it looks like this.

@

Edited by: atlass at: 12/15/01 5:13:40 am

atlass

ezboard moderator
ezSupporter
Posts: 333

Posted: 11/9/01 12:59 pm
Re: (CSS) Changing how your board name looks

For a far more simple change - just changing the font face and size:

<** style>

h4 {
font-family: "Lucida Handwriting", cursive;
font-size: 160%
}

.headings {
font-family: "Lucida Handwriting", cursive;
font-size: 160%
}

<**/style>

Remove the **'s, and change the font and size to suit your board.

@

Nutrocker

ezboard Moderator
ezSupporter
Posts: 9359

Posted: 10/5/03 2:24 pm
Re: (CSS) Changing how your board name looks

To 'block' the board name from your board by using some CSS....

1st text box within your custom html area
Custom HEAD

 
<style types="text/css">
H4 {display: none;}
</style>

Nutrocker

ezboard Moderator
ezSupporter
Posts: 9803

Posted: 11/6/03 3:58 pm
Re: (CSS) Changing how your board name looks

To block the board name on the main page only using a script to 'write' the CSS to the visitors browser...

Replace the blue URL with your board URL.

  <script language="JavaScript">

if ( self.location == "http://pubXX.ezboard.com/bboardname" ) {

document.write(' <style>');
document.write(' h4 {display:none;}');
document.write(' </style>');

}
</script>

Nutrocker

ezboard Moderator
ezSupporter
Posts: 13970

Posted: 10/18/04 3:46 pm
Re: (CSS) Changing how your board name looks

Replace Board name with a graphic...

By Gaucho Don

Unfortunately I'm just about outta here for the day, but here is a version that should be limited to just the title (it will also replace anything else that you've used the exact same wording as a portion of your coding inside "h4" tags)

Just replace the blue area with what the name of your board exactly as it appears next to the gold icon... and replace the green with the image you want to replace it with. Note: you should be able to replace it with any html (img, text or ?)

    
<script type="text/javascript">
/*TITLE REPLACE*/
function TitleRepl() {
        //the old title or portion thereof that you want to change
        var OldText="GauchoDon's Test Community";
        //the replacement html
        var NewHTML="<img src='http://www.gaucholocos.com/archive/images/14.gif'>";

        var AllH4 = document.getElementsByTagName("h4");
        var OldTextReg= new RegExp(OldText,"g");
        for(ah=0;ah<AllH4.length;ah++) {
                AllH4[ah].innerHTML = AllH4[ah].innerHTML.replace(OldTextReg,NewHTML);
        }
}
TitleRepl();
/*END TITLE REPLACE*/
</script>

custom html, custom footer (4th text box from the top)

Edited by: Nutrocker at: 10/18/04 3:47 pm

::: Topic Commands

<< Prev Topic | Next Topic >>

Icon Legend

:::Reply to Post Button

:::Edit Post Button

:::Delete Post Button (Moderator Only)

:::Subscribe to Thread Button

:::Email to Friend Button

- Cool Tips & Tricks - CSS FAQ -

ezboard Help Communities:

Help Forums Bug Base