2011-06-30, 04:38 PM
Hello mybbians,
I am working on themes and making buttons is such hectic in Ps.
So i found an easy way,that is CSS3 web buttons.
They are awesome,clean,elegant,that gives your forum a new look.
So here is how u can make them :
Navigate to your acp > themes and templates > themes > global.css
Just add this code at bottom
The button.hover and active gives hover effects that is really an amazing feature in these buttons.
Further,
Now html work up is to be done.
So whare ever you find button code,add the class in it.
For example to have a css3 button for "new thread" in your forum,
Here is an example code u nee to use :
Navigate to your forumdisplay_newthread template and just replace the class of it like this
You can see class=buttons"
This way edit where ever you need a button,like in post bit templates,you will find many buttons,like postbit_www,email,pm amd more ....
If u want to add image within the buttons like i did in chameleon theme,
Here is the html code :
Add the images u want...
Live demo : www.enviradesign.co.cc
All buttons including login are css based
These buttons will work in all browsers except in IE browsers <7 version.
Hope you guys will be benefited with this tut.
Thank you
Regards,
Envira phani
I am working on themes and making buttons is such hectic in Ps.
So i found an easy way,that is CSS3 web buttons.
They are awesome,clean,elegant,that gives your forum a new look.
So here is how u can make them :
Navigate to your acp > themes and templates > themes > global.css
Just add this code at bottom
.buttons {
font-weight: bold;
font-size: 15px;
background: #a9d7ff;
color: #000;
padding: 3px 8px;
border: 1px solid #bababa;
}
.buttons:link, .button:visited {
color: #000;
text-decoration: none;
}
.buttons:hover {
color: #007ecf;
text-decoration: none;
border: 1px solid #777;
}
.buttons:active {
background: #cbcbcb repeat-x top left!important;
color: #000;
text-decoration: none;
}
The button.hover and active gives hover effects that is really an amazing feature in these buttons.
Further,
Now html work up is to be done.
So whare ever you find button code,add the class in it.
For example to have a css3 button for "new thread" in your forum,
Here is an example code u nee to use :
Navigate to your forumdisplay_newthread template and just replace the class of it like this
<a href="newthread.php?fid={$fid}" title="{$lang->post_thread}" class="buttons"> {$lang->post_thread} </a><br />
You can see class=buttons"
This way edit where ever you need a button,like in post bit templates,you will find many buttons,like postbit_www,email,pm amd more ....
If u want to add image within the buttons like i did in chameleon theme,
Here is the html code :
<a href="newthread.php?fid={$fid}" title="{$lang->post_thread}" class="buttons"><img src="{$theme['imgdir']}/newtopic.png" alt="" /> {$lang->post_thread}</a><br />
Add the images u want...
Live demo : www.enviradesign.co.cc
All buttons including login are css based
These buttons will work in all browsers except in IE browsers <7 version.
Hope you guys will be benefited with this tut.
Thank you
Regards,
Envira phani