HOW TO not kill your eyes on the new forums !! [[ 100 LIKE SPECIAL: CODED PREMADE LAYOUTS !! ]]

:
[ Welcome! ]
    Do your eyes hurt from the new forum's clashing layout? Do you hate how everything is magnified? Miss your subs? Miss serifs? Well look no further! Quality post headers can be found here, layouts to bring back the old forums and ease you into the changes!


[ Rules ]
    - All I ask is to be courteous. Follow the rules, respect others.
    - You don't have to ask to use these, though I would appreciate a post to bump this up if you've found it helpful. Show others some post headers easy on the eyes.
    - Feel free to adapt the codes. Changing colors, fonts or styles if you please.


[ How to Use ]
    Using post headers are simple -- just copy the code below the post header you would like to use. At the top of the reply bar is a toolbar, and the farthest icon on the right looks like this < > click it, and paste the code inside. Press okay, and there you are! You can edit anywhere there is text.
For mobile users:
>> Skittles: I figured it out! At least on mine. xDD When you turn your phone sideways, all of a sudden the fancy toolbar is there with the html button!

[ There's MORE! ]
    Like the style, but not the colors? Don't worry! Use this page to find a style you like. Then go to this fancy page here to find the color scheme that makes it perfect for you! 

And, if you need more than just a post header, jump on over to the new Coded Premade LAYOUT thread to fancy up any den, roleplay, or any other thread that needs a splash of color and style!




 
  Simple

<div style="border: 4px double silver; padding: 25px; padding-top: 0px; width: 80%; margin: auto; text-align: center; background: #101010;">
<div style="border: 3px outset silver; text-align: left; background-color: #dbd9d2; padding: 15px; font-family: courier new;">&nbsp;&nbsp;<sub style="color: black;">Put text here</div>
</div>

 
Dashed

<div style="background: #2b2b2b; border-bottom: grey solid 2px; border-left: grey solid 3px; border-right: border-top: grey solid 2px; color: #b2b2b2; font-family: times new roman; padding: 0px 10px 10px 30px;"><div style="line-height: 3px;">&nbsp;</div>
<div style="border-right: 5px dashed #b2b2b2; padding: 4px;">Text here<br /></div>
</div>


 
Inverted Dashed

<div style="background: #b2b2b2; border-bottom: #1a1a1a solid 2px; border-left: #1a1a1a solid 3px; border-top: #1a1a1a solid 1px; color: #2b2b2b; font-family: times new roman; padding: 0px 10px 10px 30px;">&nbsp;
<div style="border-right: 5px dashed #2b2b2b; padding: 4px;">Text here<br /></div>
</div>


Firey special

<div style="width: 85%; margin: auto; background: #630400; border-right: double 14px #bc5e19; padding: 20px; color: #edb286; font-family: georgia;"><p><sub>Text here</sub></p>
</div>


  
Purple with Black bg

<div style="border: 3px inset #7d4d9d; border-radius: 5px; padding-left: 20px; padding-right: 20px; padding-bottom: 20px; text-align: center; background: #151515;">
<div style="line-height: 3px;">&nbsp;</div>
<div style="border: 4px solid #727272; padding: 15px; font-family: georgia; font-size: 12px; text-align: left; background: #463c52;"><span style="color: #d1a6dd;">Put text here</span></div>
</div>

 
 
 
  xx Purple lines

 
 

<div style="background: #400c21; padding: 20px; border: #403e78 double 10px;"><div style="line-height: 3px;">&nbsp;</div>
<div style="background: #403e78; width: 400px; height: 2px;">&nbsp;</div>
<div style="line-height: 3px;">&nbsp;</div>
<div style="background: #493e78; padding: 10px; color: #d1a6ed; font-family: Cambria; font-size: 14px;">&nbsp; xx Text here</div>
<div style="line-height: 3px;">&nbsp;</div>
<div style="background: #403e78; width: 400px; height: 2px; float: right;">&nbsp;</div>
</div>

 
 
 
» Grey/teal Lines (colors from Pinesong, thanks!)
 
 
 

<div style="padding-left: 20px; padding-right: 20px; border: 10px double #5a5a5a; text-align: center; background: #111111;">&nbsp;
<div style="background: #5a5a5a; width: 400px; height: 2px;">&nbsp;</div>
<div style="line-height: 8px;">&nbsp;</div>
<div style="background: #333333; padding: 10px; color: #00ffd2; font-family: Cambria; font-size: 14px; text-align: center;">&raquo;&nbsp;Text here</div>
<div style="line-height: 8px;">&nbsp;</div>
<div style="background: #5a5a5a; width: 400px; height: 2px; float: right;">&nbsp;</div>
&nbsp;</div>



   Greenie (one of my personal favs)

<div style="width: 85%; margin: auto; border-bottom-color: #6e612f; border-style: solid; border-color: #3b5c4c; border-width: 1px 4px 4px 1px; color: #b2b2b2; font-family: Rockwell; padding: 20px 10px 20px 10px; text-align: center; background: #afcfaa; box-shadow: #303030 2px 1px 7px 1px; line-height: 0;"><br />
<div style="width: 89%; margin: auto; border-right-style: solid; border-right-width: 10px; border-right-color: #526f61; padding: 20px; color: #98e1af; font-family: georgia; text-align: left; background: #29461f;"><span class="smaller">&nbsp; &nbsp; Text here </span></div>
</div>


 
Little Pink: (color pallet from Narcissist, thanks!)

<div style="background: #dd88aa; border: #994455 solid 4px; border-radius: 2px; line-height: 0; margin: auto; padding: 3px; text-align: center; width: 86%; color: #b1101a;">&nbsp;
<div style="border: 2px #994455 solid; color: #ffeeee; box-shadow: #dd88aa 0px 0px 5px 1px; font-family: georgia; padding: 5px;"><span class="smaller">Text here</span></div>
</div>



Title
  Earthy, header (colors by Pinesong!)

<div style="width: 85%; margin: auto; background: #b29c7d; border-bottom: #b4cbcd solid 4px; border-right: #b4cbcd solid 4px; color: #b2b2b2; font-family: georgia; padding: 10px; padding-left: 20px; border-top-left-radius: 40px;"><br />
<div style="width: 200px; height: 22px; box-shadow: #7f6854 0px 0px 1px 1px; color: #7f6854; font-family: georgia; text-align: center; background: #fff5cf;"><span class="big">Title</span></div>
<div style="width: 80%; margin: auto; border-left-style: solid; border-left-width: 10px; border-left-color: #b4cbcd; padding: 20px; color: #e3c598; font-family: georgia; text-align: left; background: #7f6854;"><span class="smaller">&nbsp; &nbsp; Filler filler filler</span></div>
</div>



  Earthy - without header

<div style="width: 85%; margin: auto; background: #b29c7d; border-bottom: #b4cbcd solid 4px; border-right: #b4cbcd solid 4px; color: #b2b2b2; font-family: georgia; padding: 10px; padding-left: 20px; border-top-left-radius: 40px;"><br />
<div style="width: 80%; margin: auto; border-left-style: solid; border-left-width: 10px; border-left-color: #b4cbcd; padding: 20px; color: #e3c598; font-family: georgia; text-align: left; background: #7f6854;"><span class="smaller">&nbsp; &nbsp; Filler la filler haha.</span></div>
</div>


 
 
 
 
 
Teal
 
 

<div style="margins: auto; border: solid 4px #597194; background: #869ebf; padding-left: 15px; padding-right: 15px; padding-bottom: 15px;">&nbsp;
<div style="height: 3px; length: 200px; background: teal;">&nbsp;</div>
<div style="height: 2px;">&nbsp;</div>
<div style="height: 3px; background: teal; length: 100px;">&nbsp;</div>
<div style="height: 2px;">&nbsp;</div>
<div style="background: teal; color: #5adb9f; font-family: georgia; padding: 10px; border: dotted light blue 2px; font-size: 12px;">Text here</div>
<div style="height: 2px;">&nbsp;</div>
<div style="height: 3px; background: teal; length: 100px;">&nbsp;</div>
</div>

 
Crossed Corners
 

 <div style="background: #96612c; border: double 8px #663100; border-collapse: collapse; display: table; height: 2px; margin: auto; padding: 30px; width: 95%;">
<div style="background: #520806; height: 10px;">&nbsp;</div>
<div style="border-right: solid 3px #520806; border-left: solid 3px #520806; color: #fac789; font-family: georgia; font-size: 12px; padding: 10px;">Text here. . .</div>
<div style="background: #520806; height: 10px;">&nbsp;</div>
</div>

Original Post

There'll be loads more colors and styles up tomorrow guys. I only have time to adapt a couple codes rn.
Stick it out lovelies. <3
The forums will pull through in the end~

  My feelings                            +                               +                   +                        +
  So sad                                                             +                                         +
  Never knew                                    +         +                                            
  You felt the same          +                                      +                    Like my posts to call me back
 
Brown! This is awesome! I can actually read this without my eyes hurting! <3
-gently pets- Your making life better for me and I was getting very upset. ajdgpagaplgjsags I cannot tell you how much I love you.

Do we give credit? I mean coding is difficult if you're bad at it... like me.

"You really don't understand a single thing, do you? See, I'm a selfish man for selfless reasons. Now you must be thinking how is that possible. Why, mon ami, I'm a paradox in and of itself. What you see is not everything. The human eye is unable to perceive certain things, and let me tell you - people are one of them." - Alphonse Fournier

<div style="background: #2b2b2b; border-bottom: grey solid 2px; border-left: grey solid 3px; border-right: border-top: grey solid 2px; color: #b2b2b2; font-family: times new roman; padding: 10px 10px 10px 30px;">&nbsp;
<div style="border-right: 5px dashed #b2b2b2; padding: 4px;">Test... test... TeSt??? /><br /><br /><br /></div>
</div>

Join the Dark Side...

         We've got cookies...                

Nah, these are all old codes. <33 They don't take any time to make~

And no problem. I'm glad to help people get accustomed to the new look.
Be sure to check in tomorrow; I'm going to make some better looking post codes with a wider variety of fonts/styles/colors that you may want to check out and pick through.

Spread the word!

  My feelings                            +                               +                   +                        +
  So sad                                                             +                                         +
  Never knew                                    +         +                                            
  You felt the same          +                                      +                    Like my posts to call me back

@Moon, make sure to post it in the < > button. 
A new window should open, white. You have to paste it there. c;

  My feelings                            +                               +                   +                        +
  So sad                                                             +                                         +
  Never knew                                    +         +                                            
  You felt the same          +                                      +                    Like my posts to call me back

np. <33

Come back for the new styles tomorrow~
And I'll probably start personalizing them too, so check for request openings.

  My feelings                            +                               +                   +                        +
  So sad                                                             +                                         +
  Never knew                                    +         +                                            
  You felt the same          +                                      +                    Like my posts to call me back
 
You're my savior. I'm going to tell my friends uwu <3



"You really don't understand a single thing, do you? See, I'm a selfish man for selfless reasons. Now you must be thinking how is that possible. Why, mon ami, I'm a paradox in and of itself. What you see is not everything. The human eye is unable to perceive certain things, and let me tell you - people are one of them." - Alphonse Fournier

Is it weird that this legitimately calms me down? I'm gonna make myself a nice post layout now...

 So finish it... Cause I'm with you till the end of the line.
I live my life a quarter mile at a time. You did too, that's why we're brothers. No matter where you are, whether it's a quarter mile away for halfway around the world, you will always be with me, and you'll always be my brother.

Spread the non-eye hurt love. <33

@Dingo - The first switch was worse, and the wcf community is strong. We'll make it. A lot of grumbling, sure, but we'll get over it eventually. <3 I'm looking forward to seeing what you come up with, always loved your colors.

And also! For all the traffic, I added another little code. This one, in fact. One of my personal favorite color schemes, and a nice simple box. Enjoy~

  My feelings                            +                               +                   +                        +
  So sad                                                             +                                         +
  Never knew                                    +         +                                            
  You felt the same          +                                      +                    Like my posts to call me back
  
xx - Another little one. Purple's cool.
  My feelings                            +                               +                   +                        +
  So sad                                                             +                                         +
  Never knew                                    +         +                                            
  You felt the same          +                                      +                    Like my posts to call me back

np at all. <33
Glad you like 'em.
And honestly, I didn't think the plain grey dashed one would be so popular. xDDD

  My feelings                            +                               +                   +                        +
  So sad                                                             +                                         +
  Never knew                                    +         +                                            
  You felt the same          +                                      +                    Like my posts to call me back
 
Same div, inverted colors
  My feelings                            +                               +                   +                        +
  So sad                                                             +                                         +
  Never knew                                    +         +                                            
  You felt the same          +                                      +                    Like my posts to call me back

@Skittles,  S'more ;; And they said this update was to make the MOBILE better. xD Hopefully they'll fix that, because that's a huge issue. It may just be a edit glitch to be fixed? Hopefully. 

@Dapple, Caffe ;; Enjoy em. Hopefully we'll get a few more colors today.

  My feelings                            +                               +                   +                        +
  So sad                                                             +                                         +
  Never knew                                    +         +                                            
  You felt the same          +                                      +                    Like my posts to call me back
  
You'really a life saver Brown!!! XD Thank youuuuuu!! It looks so much better now! ;P

Image          Hello there! c: I have no idea what to put here lol

 
 Image
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
ImageImageImage
 
 

Np.
I have some free time, any requests for styles colors that would interest you all to see?
Otherwise I'm just going to make some random ones.

  My feelings                            +                               +                   +                        +
  So sad                                                             +                                         +
  Never knew                                    +         +                                            
  You felt the same          +                                      +                    Like my posts to call me back
 
 
 
  xx Testing colors....
 
 
  My feelings                            +                               +                   +                        +
  So sad                                                             +                                         +
  Never knew                                    +         +                                            
  You felt the same          +                                      +                    Like my posts to call me back

Yellow buttons at the top. ^^
Any chance you can spare a few words to tell me your favorite of the headers?
Trying to make more now, and I'd appreciate seeing what style is favorable

@Brooksie - np. <3
Now if only line height will stop hating me so I can get the next set rolling.

  My feelings                            +                               +                   +                        +
  So sad                                                             +                                         +
  Never knew                                    +         +                                            
  You felt the same          +                                      +                    Like my posts to call me back

<div style="background: #2b2b2b; border-bottom: grey solid 2px; border-left: grey solid 3px; border-right: border-top: grey solid 2px; color: #b2b2b2; font-family: times new roman; padding: 10px 10px 10px 30px;">&nbsp;
<div style="border-right: 5px dashed #b2b2b2; padding: 4px;">here's a fake div for style maybe<br /></div>
</div>

 

Hopefully it works.

 
 
 
  xx Yesssss finally line-height works.
And I have to self-teach myself hexacode now because there is no easy way to custom color riprip
First 100% new-forum made post header yay!
even if it looks odd in the edit screen ooops.

@Moon - np. cx spread the word~
@sand - you have to go to the toolbar and click the <> button, pasting it there. I've been informed it isn't currently working on mobile, however.
 
 
  My feelings                            +                               +                   +                        +
  So sad                                                             +                                         +
  Never knew                                    +         +                                            
  You felt the same          +                                      +                    Like my posts to call me back
 
 
 
  xx Mmm
Enjoy them. <33
 
 
  My feelings                            +                               +                   +                        +
  So sad                                                             +                                         +
  Never knew                                    +         +                                            
  You felt the same          +                                      +                    Like my posts to call me back
 
oh also, I found that, when the browser is scaled down to 90% (press control and '-' at the same time once) really helps with the annoying font size and box size and everything. 

~M o o n w i n g~ Call me Moon
Wonderclan ☆ My Den

Note to all- Due to exams, I will not be very active on the forums, if at all. Sorry to any roleplays that I am holding up!

Of course it works. =p

And subs can be created by going into the <> menu and putting <sub> </sub> tags. I don't really care for it in the new forums style, however, and find it easier to do 13-15px font instead.

  My feelings                            +                               +                   +                        +
  So sad                                                             +                                         +
  Never knew                                    +         +                                            
  You felt the same          +                                      +                    Like my posts to call me back

Add Reply

×
×
×
×