Adding a Message Board to your Blog

As you can see I added a Message Board to my Blog, that sticks to the top of the page. It is not a Post, but a Page Element that can be edited from the Layout Editor.

This is how I implemented the Message Board.

Add a new section to the template

At the top of the content-part, just beneath the content-wrapper div, add a new

, with a unique id (I chose 'message-board'). Inside this

add a new section, with a unique id and class. Set maxwidgets to 1, and showaddelements to 'yes'.

Add variables to the css-part of your template

To control the font and colors of the Message Board, add the following variables to your css:




type="color" default="#336699" value="#336699">
type="color" default="#000000" value="#000000">

Add style-definitions for your Message Board classes

Now add the following css to the template.

/* Messageboard */

.msgbrd h2 {
display: none;
}

.msgbrd .widget-content {
padding: 2px 2% 2px;
background-color: $bgMsgBrd;
border: 4px solid $borderMsgBrd;
color: $colMsgBrd;
font: $MsgBrdFont;
}

Add the MessageBoard content

In the Add Page Elements-part of the Layout Editor you will see the new section just beneath your Header.
Click 'Add a Page Element' here, and select Text.
Enter a title and a message, and click Save.
Voila!

Subscribe to: Post Comments (Atom)