Advanced Templates in Cart Viper

Cart Viper generates the storefront using templates, this allows you to customise the layout and features of the storefront. The templates are created using our simple to understand token system allowing you to inject rich functionality to your storefront. Along with unique names for all the CSS styles to create the perfect base to customise the store.

Template Snippet

But what happens if you need to go to the next level of design control? Well Cart Viper support Razor scripts, which gives you even more flexibility to change the layout and add new functionality to the storefront.
Razor scripts allow you to merge HTML and Cart Viper catalogue data to provide a customised store. Razor scripts also give you the full power of C# to call external code. Its easy to learn Razor scripting and it gives you a great deal of scope to change the storefront in an amazing way.

Category Menu

The category menu module in Cart Viper now also support Razor scripts, so you have total control over the menu shown to the customer. We have a sample menu bundled with the module which shows you how to get started. The sample menu renders the list of categories as a simple nested unordered list but you are free to customise this for your own menu system.

Using a razor script you could style or output the menu however you like. Want to use some jQuery plugin to style the menu? Well now you can!

Using Razor Scripts

Lets take a look at an example. We are going to create a razor script which will display on the product details page and generate a list of related products automatically.

The script will use the SEO keywords defined for the product, if no keywords are defined we'll use the model name. Then we'll search the catalogue index using the SEO keywords or model name to find similar products before finally rendering the products to the page.
While it would be possible to make this change without using razor scripts but it would have meant having to create a skin object which is much more long winded. With razor scripts we can quickly test out our scripts without all the hassle of compiling C# code.

Example 1
Example 2
Example 3

To get started all scripts for the site need to be deployed in the /scripts folder which is off the main template location. Here is the script we are going to use.

So we've copied this script into the correct folder. All we need to do now is just add token to the product details template to load the script into the page.

To use a razor script in a template we just use the token [RAZOR:nameofthescript.cshtml]so for this example we have this token  [RAZOR:RelatedProducts.cshtml] on line 41.

Hopefully this will have given you some idea to what you can do in your store. You could take it to the next level and use previous orders to work out what people purchased with the current item for example.

There is more information about using Razor scripts in the Cart Viper user manual.

 

We use cookies on our website to improve our service to you, by continuing you agree to our use of cookies. However you are able to update your settings at any time.

Cookie Policy

A cookie, also known as an HTTP cookie, web cookie, or browser cookie, is a piece of data stored by a website within a browser, and then subsequently sent back to the same website by the browser. Cookies were designed to be a reliable mechanism for websites to remember things that a browser had done there in the past, which can include having clicked particular buttons, logging in, or having read pages on that site months or years ago.

Strictly Necessary Cookies

These cookies cannot be disabled

These cookies are necessary for the website to function and cannot be switched off. They are normally set in response to your interactions on the website e.g. logging in etc.

Cookies:
  • .ASPXANONYMOUS
  • .DOTNETNUKE
  • __RequestVerificationToken
  • authentication
  • CV_Portal
  • CV_Store_Portal_Cart_0
  • CV_USER
  • dnn_IsMobile
  • language
  • LastPageId
  • NADevGDPRCookieConsent_portal_0
  • userBrowsingCookie

Performance Cookies

These cookies allow us to monitor traffic to our website so we can improve the performance and content of our site. They help us to know which pages are the most and least popular and see how visitors move around the site. All information these cookies collect is aggregated and therefore anonymous. If you do not allow these cookies we will not know when you have visited or how you navigated around our website.

Cookies:
  • _ga
  • _gat
  • _gid

Functional Cookies

These cookies enable the website to provide enhanced functionality and content. They may be set by the website or by third party providers whose services we have added to our pages. If you do not allow these cookies then some or all of these services may not function properly.

Cookies:

Currently we are not utilizing these types of cookies on our site.

Targeting Cookies

These cookies may be set through our site by our advertising partners. They may be used by those companies to build a profile of your interests and show you relevant adverts on other sites. They do not store directly personal information, but are based on uniquely identifying your browser and internet device. If you do not allow these cookies, you will experience less targeted advertising.

Cookies:

Currently we are not utilizing these types of cookies on our site.