To improve the load time of customer self service web pages you can use the application to minimise the style sheet (CSS) files at run time.
This uses Razor technology.
Step-by-step guide
To bundle and minify CSS files:
- Login as an administrator
- Go to the "Template Editor" page
- Open up the "Code Editor"
- Include web optimisation and Bundler into the razor template
- Create a new "cv Style Bundle"
- Include your styles into the bundle
- Create and load your bundle
@using System.Web.Optimization;
@using Bundler;
@{
var cvStyles = new cvStyleBundle("~/TemplateBundles/CVStyles");
}
... Other HTML here
@{
cvStyles.Include("~/documents/css/print/pmain.css");
cvStyles.Include("~/documents/css/print/pbutton.css");
cvStyles.Include("~/documents/css/print/preset.css");
// or you can use
cvStyles.Include( new string [] {
"~/documents/css/handheld/hbuttons.css",
"~/documents/css/handheld/hreset.css",
"~/documents/css/handheld/hmain.css"
});
}
... Other HTML here
@{
BundleTable.Bundles.Add(cvStyles);
@Raw(@Model.TemplateUtil.StyleRender("~/TemplateBundles/CVStyles"))
// If you want to attach additional tags you can use
@Raw(@Model.TemplateUtil.StyleRender("~/TemplateBundles/CVStyles","Media:Print;Id:test;SomeTag:SomeValue"))
}
To enable this functionality the template needs to be a version 4 (Razor) template
