FM Themes
Welcome to FM Themes
where you can share your punBB, phpBB 2, Invision, & phpBB 3 themes for Forumotion forums.

You are viewing the forum as a guest, so you will not be able to use the full forum. To use all the features of the forum, you need to log in or create a FREE account by registering.

Dynamic User Control Panel

View previous topic View next topic Go down

Ange Tuteur
Special Themer
Reputation : 204
Points : 9162
Posts : 303
View user profile

PostAnge Tuteur on Sun Oct 06, 2013 5:11 pm

Dynamic User Control Panel

I have been working on the User Control Panel a bit more lately and reworked a few things. I removed most of the font and bold tags and replaced them with hooks instead. These hooks allow you to stylize the Control Panel through your CSS stylesheet. This new build comes default with its own CSS which you can stylize to your liking.


It is now placed within a block to help with padding so the control panel is more centered. Options will also now move 10px to the right when hovered over to make the list more dynamic, and I've redid the titles giving them a different font so it appears a bit more stylish. You are free to make any changes to the CSS which will be later on in this post.

To apply this widget to your forum navigate to..
Admin Panel > Modules > Portal & Widgets > Forum Widgets Management > Create a widget

Widget name: Control Panel
Use a table type: Yes (Choose no if you want to stylize the base and add on yourself)
Widget title: Control Panel
Widget source:
<!-- UCP Build 20130815 -->
<!-- Redesign by -->
<div class="ucpbase"><img src=""> <span class="ucptitle">My Profile</span><br /><span class="ucpoption"><a href="/" target=_blank>• Information</a></span><br /><span class="ucpoption"><a href="/" target=_blank>• Preference</a></span><br /><span class="ucpoption"><a href="/" target=_blank>• Signature</a></span><br /><span class="ucpoption"><a href="/" target=_blank>• Avatar</a></span><br /><br /><img  src=""> <span class="ucptitle">Social</span><br /><span class="ucpoption"><a href="/chatbox" target=_blank>• Chatbox</a></span><br /><span class="ucpoption"><a href="/" target=_blank>• Friends and Foes</a></span><br /><span class="ucpoption"><a href="/" target=_blank>• Memberlist</a></span><br /><span class="ucpoption"><a href="/" target=_blank>• Groups</a></span><br /><br /><img src=""> <span class="ucptitle">Messages</span><br /><span class="ucpoption"><a href="/" target=_blank>• Inbox</a></span><br /><span class="ucpoption"><a href="/" target=_blank>• PM sent</a></span><br /><br /><img src=""> <span class="ucptitle">Other</span><br /><span class="ucpoption"><a href="/" target=_blank>• Watched topic</a></span></div>
Do not forget to save the widget. When you have dragged and dropped it onto your forum hit save.

Now go to..
Admin Panel > Display > Pictures and Colors > Colors > CSS stylesheet

Paste the following code into your stylesheet and hit submit.
/*UCP Widget*/
font-family: "Avant Garde", Avantgarde, "Century Gothic", CenturyGothic, "AppleGothic", sans-serif;
If you know CSS you can change any of the contents in the default CSS above. For info on the properties used consult the links below in useful reading.

Now you have a new User Control Panel widget for your forums which you can modify on the fly through CSS! Have fun and good luck with your forums. Wink

Useful reading

[You must be registered and logged in to see this link.]
[You must be registered and logged in to see this link.]
[You must be registered and logged in to see this link.]
[You must be registered and logged in to see this link.]
[You must be registered and logged in to see this link.]
[You must be registered and logged in to see this link.]

Widget redesign by [You must be registered and logged in to see this link.]
Orginal Design: [You must be registered and logged in to see this link.]
No reproduction possible without my consent.
Reputation : 281
Points : 1292
Posts : 3437
View user profile

PostSLGray on Thu Oct 10, 2013 10:07 am

Tutorial Approved

View previous topic View next topic Back to top

Create an account or log in to leave a reply

You need to be a member in order to leave a reply.

Create an account

Join our community by creating a new account. It's easy!

Create a new account

Log in

Already have an account? No problem, log in here.

Log in

Permissions in this forum:
You cannot reply to topics in this forum