Draw more attention to your events
This clever app allows you to insert a countdown function in your webshop. You can use the app to draw attention to an event you have planned for a certain date, a competition or limited time offers/promotions. The app draws attention to important deals and helps you achieve higher sales.
The countdown timer could be used for events such as:
- Black Friday
- Cyber Monday
- Christmas shopping
- Special dates/anniversaries
- Bargain days/weeks
- etc.
Features
When you hold a sale on your webshop, you want as many visitors as possible to notice the bargain prices on your products. Use the countdown function to draw focus to your sale and get more orders!
You can edit the following:
- The name of the event
- Start/end date for the event
- Colour theme (light or dark)
- Link to the event
- Language (Danish, Norwegian, English)
- Position (top/bottom)
- Responsive interface
How to get started
All you need to do to install this app in your webshop is copy a small snippet of code and paste it into your design.
The walkthrough below shows you how:
1. Find the design you wish to insert the app into
Click Control Panel > Design Manager > Edit Design
2. Click “Insert javascript”
3. Insert the app code
Insert the app code in the “For insertion in the page’s <head>” field (see how to get the app code below).
The countdown function will be online the moment you click Save. You may want to edit your settings before inserting the app code.
The app code
The code you need for the app can be found below. You need to highlight and copy everything in the box.
<script>
var _countdown = _countdown || {};
_countdown["theme"] = "dark";
_countdown["lang"] = "dk";
_countdown["position"] = "bottom";
_countdown["button"] = true;
_countdown["salepage"] = "2-getfit-sports-bra";
_countdown["startdate"] = "2016-11-24";
_countdown["enddate"] = "2016-11-25";
_countdown["eventname"] = "Black Friday";
(function() {
var countdown = document.createElement('script');
countdown.async = true;
countdown.src = '//app-counter.smartweb-static.com/main.min.js';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(countdown, s);
})();
</script>
Settings
Changing the app settings is simple.
We go through each setting and how to edit it below.
Colour theme (theme)
You can change the app theme under:
["theme"] = "dark";
["theme"] = "bright";
To activate the dark theme in the app, simply write “dark”.
To activate the bright theme in the app, write “bright”.
Language (lang)
You can change the app language under:
["lang"] = "dk";
["lang"] = "no";
["lang"] = "uk";
Writing “dk” changes the app language to Danish.
Writing “no” changes the app language to Norwegian.
Writing “uk” changes the app language to English.
Position
You can change the app’s position under:
["position"] = "bottom";
["position"] = "top";
Typing “bottom” positions the app at the bottom of your webshop.
Typing “top” positions the app at the top of your webshop.
In most cases, the best position will be at the bottom, where the countdown timer does not block any important elements at the top (menu, shopping cart, etc.).
Button
You can choose whether the app should feature a button that says:
["button"] = true;
["button"] = false;
Writing “true” will make the button appear.
Writing “false” will hide the button.
Page being linked to (salepage)
If you choose to activate the button, you can decide which page it should direct visitors to:
["salepage"] = "om-os";
In this example, we have chosen the page “about-us”, which is the page that visitors will be directed to when they click the button.
You can select a text page or a product page. The only thing to keep in mind is that the page URL must not contain any “slashes”, etc.
Start date (startdate)
You can change the app’s start date under:
["startdate"] = "2016-11-24";
You can enter the start date for your event here (where “2016-11-24” has been entered in the example).
End date (enddate)
You can change the app’s end date under:
["enddate"] = "2016-11-25";
You can enter the end date for your event here (where “2016-11-25” has been entered in the example).
Time zone
The default time zone for the counter is CET (‘Europe/Copenhagen’).
If you want to change to another time zone than the one set as default, you can do so in this parameter.
["timezone"] = "Europe/Copenhagen";
If you want the counter set to the Danish time zone, write: Europe/Copenhagen
If you want the counter set to the Norwegian time zone write, enter: Europe/Oslo
If you want the counter set to the the UK time zone, write: Europe/London
Name of the event (eventname)
You can change the event name under:
["eventname"] = "Black Friday";
You can enter the name of your event here (where “Black Friday” has been entered in the example).