Download Support Blogs Forums Contact
Community > Forums > Active Forums > Themes and Templates > Modifying links in the tool bar panel
> Forums > Active Forums > Themes and Templates > Modifying links in the tool bar panel
Last Post 28 Feb 2012 03:18 PM by Alex. 5 Replies.
AddThis - Bookmarking and Sharing Button Printer Friendly
  •  
  •  
  •  
  •  
  •  
PrevPrev NextNext
You are not authorized to post a reply.
Author Messages
Alex
Registered Users
Alex
Post Count:5

--
08 Feb 2012 07:39 AM
    • DotNetNuke Version: 5.6.2
    • Active Forums Version: 4.3.5
    Hello -

    I am curious how this forum in particular put those nice fancy blue buttons on the top control bar links. I am not able to find the particular css class to modify each particular one.

    In addition, I would like to move them around a bit, as this forum has also done. Where is the template located to do this?

    Thanks - alex
    Ben - DotNetNuke
    DotNetNuke Staff
    Ben - DotNetNuke
    Post Count:1644

    --
    08 Feb 2012 08:57 AM
    I customized the templates to appear similar to the DNN core forums. In any case you can see the template here:

    http://www.activemodules.com/deskto...oolbar.txt

    The template on your own server is in the same directory. This is one of the default templates though, so it may get overwritten if you upgrade the module, and you should create a backup copy of it before modifying it.
    alex
    Registered Users
    alex
    Post Count:1

    --
    17 Feb 2012 04:48 PM
    Thanks for the tip Ben.

    I found the template, and I am able to edit it.

    However, it would seem I lack the necessary knowledge to style <ul> items, as I am unable to produce the button effects similar to the ones here.

    Would you mind sharing the css classes and styles you used? If I stare at it anymore my head might explode

    Thanks a bunch.

    Alex
    Alex
    Registered Users
    Alex
    Post Count:5

    --
    22 Feb 2012 06:51 PM
    Anybody out there share some love?

    Ben - DotNetNuke
    DotNetNuke Staff
    Ben - DotNetNuke
    Post Count:1644

    --
    23 Feb 2012 11:37 AM
    Try these: 

    
.aftoolbarpanel{border: solid 0px #fff;background:none;}
.aftoolbarpanel ul.af-list-flat li{}
.aftoolbarpanel ul.af-list-flat li a,
.aftoolbarpanel ul.af-list-flat li a:link,
.aftoolbarpanel ul.af-list-flat li a:visited,
.aftoolbarpanel ul.af-list-flat li a:active {-webkit-border-radius:3px;-moz-border-radius: 3px;border-radius:3px;background: none repeat scroll 0 0 #7397B7;border-bottom: 1px solid #5C7992;border-right: 1px solid #5C7992;color: #FFFFFF;display: block;float: left;font-family: Helvetica,Arial,San-Serif;font-weight: bold;margin: 0 2px;padding: 5px 8px;}
.aftoolbarpanel ul.af-list-flat li a:hover{-webkit-border-radius:3px;-moz-border-radius: 3px;border-radius:3px;background: none repeat scroll 0 0 #5C7992;border-bottom: 1px solid #4D657A;border-right: 1px solid #4D657A;color: #FFFFFF;text-decoration: none;}
    Alex
    Registered Users
    Alex
    Post Count:5

    --
    28 Feb 2012 03:18 PM
    perfect! thanks ben!
    You are not authorized to post a reply.
    > Forums > Active Forums > Themes and Templates > Modifying links in the tool bar panel
    test
    Copyright 2012 by DotNetNuke Corporation / Terms of Use / Privacy
    Hosted by MaximumASP