[Dean Winchester]

Hello, as you've all seen. The postbit images look a lot better, as in better I mean higher quality.

Every successful forum needs them to be honest! So here's a quick tutorial on how to make them.

First of all, open up your Admin CP and click the Templates & Style tab.
Click the theme name you're currently using and click 'Add style sheet'.



The code used:

Code:

.buttons { background: #D02626; /* Color of the button */ border: 1px solid #6E0000; /* Color and width of border */ padding: 3px 12px; /* Height and width of button */ color: #fff; /* Color of the font */ font-weight: bold; /* Makes the text bold */ font-size: 12px; /* Size of the font */ font-family: Tahoma; /* Font used on the button */ }

Make the settings the same as the image above!



After that's done, head over to templates and click your theme name.
Click Post Bit Templates then click postbit_edit for an example.

Replace the whole code with this:

Code:

<a href="editpost.php?pid={$post['pid']}" id="edit_post_{$post['pid']}" class="buttons">Edit</a> <div id="edit_post_{$post['pid']}_popup" class="popup_menu" style="display: none;"><div class="popup_item_container"><a href="javascript:;" onclick="Thread.quickEdit({$post['pid']});" class="popup_item">{$lang->postbit_quick_edit}</a></div><div class="popup_item_container"><a href="editpost.php?pid={$post['pid']}" class="popup_item">{$lang->postbit_full_edit}</a></div></div> <script type="text/javascript"> // <!-- if(use_xmlhttprequest == "1") { new PopupMenu("edit_post_{$post['pid']}"); } // --> </script>

Notice

Code:

class="buttons"

That's what connects the css to the button.
Then go on to edit the other templates!

Enjoy

[Beaker]

Cool tutorial. I feel like you are secretly advertising your website though Anyways, good guide.

[Dean Winchester]

Cool tutorial. I feel like you are secretly advertising your website though Anyways, good guide.

Glad you like it. And I'm not. Where can you see a link?

[Flashdrive]

Glad you like it. And I'm not. Where can you see a link?

I think he means the "Uzi Gaming" bar in one of your screenshots.

[Dean Winchester]

I think he means the "Uzi Gaming" bar in one of your screenshots.

Is it wrong to show a pic of the demo board? If so, I'll crop it.

[Sir_CnC]

Cool tutorial. I feel like you are secretly advertising your website though Anyways, good guide.

-

Nice tutorial btw, going to try get this working on my forum!

[Flashdrive]

Is it wrong to show a pic of the demo board? If so, I'll crop it.

If it's not an active board with members on it i'm sure it's fine.

[Mario]

Nice tutorial Jimmy!!! : ) Well... as always. : P

[Gogeta]

Nice tutorial Jimmy. I'm trying to learn loads of CSS so im sure ill be using this soon

[Dean Winchester]

Nice tutorial Jimmy. I'm trying to learn loads of CSS so im sure ill be using this soon

Glad you liked it mate. Good Luck with your CSS learning.