By Andy Stephenson
April 2013
In this tutorial we will be building upon the Bootstrap skin we have created for DNN 7.
We will be working on the skin we created in the ‘Creating a Responsive Twitter Bootstrap Skin for DotNetNuke 7’ so it is important that you have followed that tutorial and have your bootstrap skin ready before we begin.
In this tutorial we will walk you through how to add some standard skin objects such as the logo, the new login-messages-notifications feature and the privacy, terms and copyright skin objects, and finally we will lead you through how to create a footer for our skin.
The videos contain:
Video 1 - How to Add the Portal Logo, Adding and styling the User/Login Skin Object
- Introduction
- Creating a new row for the portal logo
- Adding the portal logo to the skin
- How to add the user/login skin object to the skin
- Using jQuery to add the appropriate css classes to the user/login skin object
- how to remove the excess padding from the avatar image
Video Duration: 10min 56sec
Video 2 - Adding a Footer and Three Footer Panes to the Bootstrap Skin
- Introduction
- How to create a full width footer
- Creating the footer internal HTML
- Adding three equidistant panes inside the footer
- Styling the footer
- How to implement the Terms, Privacy Policy and Copyright skin tokens to the skin
Video Duration: 4min 39sec