As front-end developers and designers, we’re constantly in search more techniques to make the web more optimized. In this article I would like to share you some CSS optimization frameworks and integration of DotLess with Dot Net Nuke (DNN).
Dot Net Nuke (DNN):
The leading open source ASP.NET CMS, content management system and .NET web application development framework.
Learn more about DNN
What is LESS CSS ?
I have been hearing one of the CSS frameworks called LSScss framework. LESS - The dynamic stylesheet language. LESS extends CSS with dynamic behavior such as variables, mixins, operations and functions. LESS runs on both the server-side or client-side. Which is awesome.
Learn more about LESS Css .
Dot-LESS - Dynamic CSS for .NET
.less (pronounced dot-less) is a .NET port of the funky LESS JavaScript libary
How to Integrate Dot-LESS css with Dot Net Nuke (DNN) ?
These are the steps to integrate .less with DNN:
1. Download latest .less files from http://www.dotlesscss.org/
2. Unzip Downloaded Files.
3. Copy "dotless.Core.dll" from unzipped files and paste in "\bin" folder of DNN.
Location: C:\Users\Web\Documents\My Web Sites\dotnetnuke\bin
4. Find web.config file in your dotnetnuke folder and add following
In <configSections>
<section name="dotless" type="dotless.Core.configuration.DotlessConfigurationSectionHandler,dotless.Core" />
In <handlers>
<add name="dotless" type="dotless.Core.LessCssHttpHandler,dotless.Core" path="*.LESS" verb="*" />
5. Download Less Javascript file from http://lesscss.org/
Add the javascript to your skin js folder and call the javascript in AddScripts.ascx
<script src="js/less.js" type="text/javascript"></script>
6. Linking LESS css file to Dot Net Nuke
Create a .less file by just changing your .css file to .less file: styles.less
Link your .less stylesheets with the rel set to “stylesheet/less”:
<link rel="stylesheet/less" type="text/css" href="styles.less" />
That's it you are all set with integration of dot-less with dotnetnuke.
If you have any questions mail me at info@nithinchandrasr.com
Know me more : www.nithinchandrasr.com
Dot Net Nuke (DNN):
The leading open source ASP.NET CMS, content management system and .NET web application development framework.
Learn more about DNN
What is LESS CSS ?
I have been hearing one of the CSS frameworks called LSScss framework. LESS - The dynamic stylesheet language. LESS extends CSS with dynamic behavior such as variables, mixins, operations and functions. LESS runs on both the server-side or client-side. Which is awesome.
Learn more about LESS Css .
Dot-LESS - Dynamic CSS for .NET
.less (pronounced dot-less) is a .NET port of the funky LESS JavaScript libary
How to Integrate Dot-LESS css with Dot Net Nuke (DNN) ?
These are the steps to integrate .less with DNN:
1. Download latest .less files from http://www.dotlesscss.org/
2. Unzip Downloaded Files.
3. Copy "dotless.Core.dll" from unzipped files and paste in "\bin" folder of DNN.
Location: C:\Users\Web\Documents\My Web Sites\dotnetnuke\bin
4. Find web.config file in your dotnetnuke folder and add following
In <configSections>
<section name="dotless" type="dotless.Core.configuration.DotlessConfigurationSectionHandler,dotless.Core" />
In <handlers>
<add name="dotless" type="dotless.Core.LessCssHttpHandler,dotless.Core" path="*.LESS" verb="*" />
5. Download Less Javascript file from http://lesscss.org/
Add the javascript to your skin js folder and call the javascript in AddScripts.ascx
<script src="js/less.js" type="text/javascript"></script>
6. Linking LESS css file to Dot Net Nuke
Create a .less file by just changing your .css file to .less file: styles.less
Link your .less stylesheets with the rel set to “stylesheet/less”:
<link rel="stylesheet/less" type="text/css" href="styles.less" />
That's it you are all set with integration of dot-less with dotnetnuke.
If you have any questions mail me at info@nithinchandrasr.com
Know me more : www.nithinchandrasr.com
No comments:
Post a Comment