ADDING STYLE TO YOUR DOTNETNUKE SOCIAL SITE
Transcript of ADDING STYLE TO YOUR DOTNETNUKE SOCIAL SITE
ADDING STYLE TO YOUR DOTNETNUKE SOCIAL SITE
Adam Humphrey Adammer LLC
1 Ask Questions
About Me
2 Give It Away
Housekeeping
Styling A DotNetNuke Module
l Assumptions
l About Tidy
l Social Skin Objects
l Where to CSS
l Social Pane Layouts
l Let The Games Begin (a/k/a Styling The Social Features of DNN 6.2)
l Lessons Learned
l Q & A
Assumptions
EXPERT
Tidy
Tidy
Tidy Social Skin Objects
Tidy Social Skin Objects
<div class="loginLinks">!
<dnn:USER ID="dnnUser" runat="server" LegacyMode=”false" />!
<dnn:LOGIN ID="dnnLogin" CssClass="LoginLink" runat="server" LegacyMode=”false" />!
</div>!
Tidy Social Skin Objects
LegacyMode=“false”!
Tidy
Example �
Where to CSS
l Default.css /portals/_default/default.css
l Modules.css /desktopmodules/[module]/module.css
l Skin.css /portals/[portalID]/skins/[skin]/skin.css
l SkinFileName.css /portals/[portalID]/skins/[skin]/[skinfilename].css
Where to CSS
l Container.css /portals/[portalID]/containers/[container]/container.css
l ContainerFileName.css /portals/[portalID]/containers/[container]/[containerfilename].css
l Portal.css /portals/[portalID]/portal.css
l Inline Styles
Where to CSS
l skin.css
l [SkinName].css
l Custom location
Where to CSS
Example �
3 Use skin.css sparingly
(with prudence and restraint)
Social Pane Layouts
Dark Knight Social Pane Layout
ContentPane
RightPane
LeftPaneProfile HeaderPaneProfile
RightPaneProfile ContentPaneProfile
BottomPane
Social Pane Layouts
Tidy Social Pane Layout
ContentPane
LeftPaneProfile
RightPaneProfile
ContentPaneProfile
BottomPane
TabsPaneProfile
HeaderPaneProfile
Let The Games Begin (a/k/a Styling The Social Features of DNN 6.2)
Lessons Learned
l Never get involved in a land war in Asia
l Never go in against a Sicilian when death is on the line!
Lessons Learned
l Where to CSS
l Enabling the Social Skin Objects
l How to Style the Social Features in DNN 6.2
ADDING STYLE TO YOUR DOTNETNUKE SOCIAL SITE
Adam Humphrey Adammer LLC
THANK YOU!