Steven Webster
Customers
Post Count:1661
 |
| 26 Jul 2009 11:43 PM |
|
I like the flexibility of the AS tab controls on both the Profile and Group views. I'm working out a design concept and was wondering about the possibility of vertical tabs. Actually, they would not appear s tabs at all - but links. Sort of Windows Live style. |
|
Steven Webster
dnnOsphere.com, An Independent Community for DotNetNuke Users |
|
|
Ben - DotNetNuke
DotNetNuke Staff
Post Count:1515
|
| 27 Jul 2009 10:58 AM |
|
This is most likely possible. If you want to show me an example picture of the layout, I could point you in the right direction to do this. |
|
|
|
|
Steven Webster
Customers
Post Count:1661
|
| 27 Jul 2009 11:28 AM |
|
absolutely. here is a link: http://storage.developerzen.com/WindowsLiveWave3/Profile_top.jpg also, I've marked up the attached image  |
|
Steven Webster
dnnOsphere.com, An Independent Community for DotNetNuke Users |
|
|
Steven Webster
Customers
Post Count:1661
|
| 31 Jul 2009 02:28 PM |
|
Ben, is is another one (actually this is closer to what I was after. I wonder if we could have a target pane for the views each tab loads. That would give us a lot of layout control . http://tutsplus.com/plus-program/vector-plus/ |
|
Steven Webster
dnnOsphere.com, An Independent Community for DotNetNuke Users |
|
|
Ben - DotNetNuke
DotNetNuke Staff
Post Count:1515
|
| 31 Jul 2009 03:12 PM |
|
Hey Steven, Sorry it took me so long, i've been busy. I just played around with the module.css a little bit and I came up with this:  I did this all by changing the following CSS in the _default theme module.css: .amtabstrip{margin-bottom:5px;padding:0px;height:21px;padding-left:20px;font-size:12px !important;font-family:Arial,Tahoma,Verdana,serif !important;float:left;} .amtab{border:solid 1px #898c95;background-color:#fff;padding-top:2px;padding-left:1px;padding-right:1px;cursor:pointer;background-image:url(../images/amtab_back_norm.gif);padding-bottom:3px;} .amtab a,.amtab a:link,.amtab a:active,.amtab a:visited{color:#666;} .amtab div{padding-left:10px;padding-right:10px;} .amtabsel{border-bottom:solid 1px #fff;border-top:solid 1px #898c95;border-right:solid 1px #898c95;border-left:solid 1px #898c95;background-color:#fff;padding-top:2px;padding-left:2px;padding-right:2px;padding-bottom:3px;} .amtabsel div{padding-left:10px;padding-right:10px;} .amtabcontent{width:600px;margin-left:130px;} .amtabcontent I had to add, and set a static width of 600px, but you can probably change it to whatever you want. The margin-left leaves a blank space for the "tabs" to "float" on top of. I only made minor changes to the other classes: -Added float:left; to .amtabstrip -Removed float:left; from .amtab and .amtabsel -Removed an erroneous height:px; that was in there for some reason (maybe its not in the default)? edit: removed the code block |
|
|
|
|
Ben - DotNetNuke
DotNetNuke Staff
Post Count:1515
|
| 31 Jul 2009 03:17 PM |
|
You don't have much control over the tabs, because they are not templated.
However the tabs are always in a div with the .amtabstrip class. The content is in a div with the .amtabcontent class.
Hope this helps. |
|
|
|
|
Will Morgenweck
Forum Admin
DotNetNuke Staff
Post Count:7666
|
| 31 Jul 2009 03:26 PM |
|
Nice work. |
|
Will Morgenweck
Director of Product Management
DotNetNuke Corp.
|
|
|
Steven Webster
Customers
Post Count:1661
|
| 31 Jul 2009 04:34 PM |
|
Jeez. Nice work indeed! |
|
Steven Webster
dnnOsphere.com, An Independent Community for DotNetNuke Users |
|
|
Steven Webster
Customers
Post Count:1661
|
| 08 Aug 2009 03:02 PM |
|
Can you turn on "edit" in this forum? |
|
Steven Webster
dnnOsphere.com, An Independent Community for DotNetNuke Users |
|
|
Dan Ball
Customers
Post Count:582
|
| 24 Sep 2009 06:41 PM |
|
Due to my added tabs, I had to switch my views to the vertical menus. It works nice, but I'm get some errors when viewing a groups, as apparently the Group View uses the same template.
In IE I get this:
In Firefox I get this:
In both, the menu tabs are messed up, which CSS style controls these?
Also, in both the Group View and the Profile View, I have that gray band across the top of the activity pane, it is mostly hidden behind the tabs and the action pane, but you can see the gray part on both sides. Which style controls that?
I have played around with the Firefox plug-in to view styles, but that doesn't seem to reveal the culprit.
|
|
|
|
|
Steven Webster
Customers
Post Count:1661
|
| 24 Sep 2009 06:47 PM |
|
Dan, is this on a live site? |
|
Steven Webster
dnnOsphere.com, An Independent Community for DotNetNuke Users |
|
|
Dan Ball
Customers
Post Count:582
|
| 24 Sep 2009 07:12 PM |
|
Live, but pre-launch. |
|
|
|
|
MHuijbregts
Customers
Post Count:1245
|
| 25 Sep 2009 12:11 PM |
|
In the past there has been a discussion (can't find it anymore) about having the tabs integrated on the right hand side along with the menu of Friends and Groups.
Does anyone know some examples of that? The tab options described in this thread are great but also consume some of the space that otherwise would be available for the content of those tabs.
Thanks in advance. |
|
Regards,
Marc
www.biservices.eu for free nl-NL resourcepacks (Incl. Active Forums & Active Social) |
|
|
Dan Ball
Customers
Post Count:582
|
| 25 Sep 2009 12:46 PM |
|
Agreed, the tabs on the side do tend to take up a lot more room. Since I integrated a couple of tabs with Ventrian Modules, they started word-wrapping around in the normal tab strip, so I had to move them. Here is a snapshot of my entire screen layout right now:
The top banner is about 930 pixels wide, which is a good width for most browsers, but friends and groups tabs push it out to over 1000 pixels. I'll have to modify the skin a little, because right now the more friends you have the wider the page keeps getting!
Pushing the page out to over 1000 pixels is not good, so some changes have to be made.
I could move to a horizontal menu, but then I'd have no place for my ads! *grin* As it stands right now, it took me awhile to figure out a way to have the page centered, regardless of how wide it got.
|
|
|
|
|
MHuijbregts
Customers
Post Count:1245
|
| 25 Sep 2009 01:23 PM |
|
Hi Dan, It looks really great, but still an AS solution to have them floating on the right would also be really really great  . |
|
Regards,
Marc
www.biservices.eu for free nl-NL resourcepacks (Incl. Active Forums & Active Social) |
|
|
Steven Webster
Customers
Post Count:1661
|
| 25 Sep 2009 01:35 PM |
|
Vertical tabs solves a lot of space issues for me. I too have enough that they span more than the distance of the site width. Using the CSS path Ben started me down...I was able to create this (I have yet to stylize the journal).  You should be able to do the same on the right. |
|
Steven Webster
dnnOsphere.com, An Independent Community for DotNetNuke Users |
|
|
Dan Ball
Customers
Post Count:582
|
| 25 Sep 2009 01:43 PM |
|
I wouldn't care if the friends and groups tab were on the right or the left, it would save room either way if they were on the same side... |
|
|
|
|
Ben - DotNetNuke
DotNetNuke Staff
Post Count:1515
|
| 25 Sep 2009 01:43 PM |
|
With some creative css you could put them anywhere on the page I think. |
|
|
|
|
Dan Ball
Customers
Post Count:582
|
| 25 Sep 2009 01:44 PM |
|
Steven, I like the way the tabs blend into the content pane (colorwise). That helps people see where they are, kinda like a breadcrumb effect. |
|
|
|
|
Steven Webster
Customers
Post Count:1661
|
| 25 Sep 2009 02:33 PM |
|
Posted By Dan Ball on 25 Sep 2009 01:44 PM
Steven, I like the way the tabs blend into the content pane (colorwise). That helps people see where they are, kinda like a breadcrumb effect.
Yes, that was the goal. I spend a lot of time on usability and find it's VERY important to always tell people where they are. Also, on this site, I opted for no drop downs on the main nav (which is the only horizontal nav) on top....rather they click on "community" and see a content page that mimics this tab layout. This way there are only ever to levels of nav to deal with (main section @ top) then specific parts of that section (@ left). That way every page, including the AS and Forum pages present exactly the same way every time. Again...still tweaking the layouts  I plan to incorporate ads below the nav. |
|
Steven Webster
dnnOsphere.com, An Independent Community for DotNetNuke Users |
|
|
Ben - DotNetNuke
DotNetNuke Staff
Post Count:1515
|
| 25 Sep 2009 02:39 PM |
|
Looks good, as always, Steven. |
|
|
|
|
Steven Webster
Customers
Post Count:1661
|
| 25 Sep 2009 03:15 PM |
|
Thanks Ben. BTW - I'm using the new menu in DNN 5 to do this. It renders an unordered list instead of the table/div menu of previous versions.
|
|
Steven Webster
dnnOsphere.com, An Independent Community for DotNetNuke Users |
|
|
Frozen DNN
Customers
Post Count:1310
|
| 25 Sep 2009 04:25 PM |
|
Wow! Steven, do you plan to share/sell your work? |
|
I am using the latest AS/AF/DNN available.
Thanks. |
|
|
Dan Ball
Customers
Post Count:582
|
| 25 Sep 2009 04:44 PM |
|
Posted By swebster on 25 Sep 2009 02:33 PM
I plan to incorporate ads below the nav.
On the left side, similar to my layout? I created my last skin from scratch, using the DNN 5 NAV menu, it definitely does work pretty slick! It turned out to be quite a bit simpler than I thought, much easier than my old skins, so I think I'll start working on re-writing my other skins in this method also. The biggest problem I'm running into is the graphics... I'm a technical person, not a graphic artist... I can mimic an existing style pretty good, but cannot come up with original designs. *sigh* |
|
|
|
|
Frozen DNN
Customers
Post Count:1310
|
| 25 Sep 2009 04:59 PM |
|
Posted By Dan Ball on 25 Sep 2009 04:44 PM
Posted By swebster on 25 Sep 2009 02:33 PM
I plan to incorporate ads below the nav.
On the left side, similar to my layout?
I created my last skin from scratch, using the DNN 5 NAV menu, it definitely does work pretty slick! It turned out to be quite a bit simpler than I thought, much easier than my old skins, so I think I'll start working on re-writing my other skins in this method also.
The biggest problem I'm running into is the graphics... I'm a technical person, not a graphic artist... I can mimic an existing style pretty good, but cannot come up with original designs. *sigh*
I can't f'ing come up with anything, not even money! It sucks being me when it comes to creating websites. |
|
I am using the latest AS/AF/DNN available.
Thanks. |
|
|
Steven Webster
Customers
Post Count:1661
|
| 25 Sep 2009 05:06 PM |
|
Frozen, I don't plan to sell that one. It's a portal I've been working on for my company. All from scratch and tons and tons of hours. I have done freelance work in the past for people (some here) but that's not my real gig.
On the ads - yes below the nav. Actually, since that entire section is all an AS template so I can incorporate Ventrian Property Agent Latest Properties or other modules in that space.
Also, I have found an application that will help non-graphics people look really good with DNN skins. I'm planning to post up about it on my blog shortly. I'll post a link here too. |
|
Steven Webster
dnnOsphere.com, An Independent Community for DotNetNuke Users |
|
|
Frozen DNN
Customers
Post Count:1310
|
| 25 Sep 2009 05:19 PM |
|
I understand but I thought I would ask about it anyway. Many people here have surprised me in the recent past. It's good work, Steven. When you have time and if you feel like it, please freelance for me.  |
|
I am using the latest AS/AF/DNN available.
Thanks. |
|
|
Steven Webster
Customers
Post Count:1661
|
| 25 Sep 2009 07:32 PM |
|
Check out this new skinning application I bought. I'm pretty impressed (and I'm not easily impressed anymore). It won't style Active Social for you...but you can create skins for DNN in no time and they look really professional. http://www.overlooktechnology.com/H...anged.aspx |
|
Steven Webster
dnnOsphere.com, An Independent Community for DotNetNuke Users |
|
|
Andy G
Customers
Post Count:195
|
| 25 Sep 2009 08:07 PM |
|
Steven, nicely done. Thanks for the tutorial. Makes me want to purchase the program. Do you have any idea when the enhanced pane feature will be available? |
|
| The Fabricator Network |
|
|
Terry Sadler
Customers
Post Count:269
|
| 25 Sep 2009 08:47 PM |
|
Posted By swebster on 25 Sep 2009 07:32 PM
Check out this new skinning application I bought. I'm pretty impressed (and I'm not easily impressed anymore). It won't style Active Social for you...but you can create skins for DNN in no time and they look really professional.
http://www.overlooktechnology.com/H...anged.aspx
Steve, This is really cool...I've probably spent close to $1000 in skins over the past few years and have really only been happy with a few of them. I've been learning about skinning and css for a while but am at it only part time so this really looks promising. I'm guessing you can also edit the skin and make changes to it using a standard editor after you've created it. Have you played around with modifying the containers with an editor? |
|
Terry Sadler, CISSP
Compass North Group, LLC
Any man who may be asked in this century, what he did to make his life Worthwhile, can respond with a good deal of Pride and Satisfaction, "I served in the United States Navy". JFK |
|
|