As soon as you begin defining your landing page's structure you can start adding elements to it. One of the available element types is the Timer.
Let's see how you can add one to your design:
A. Adding a Timer element
1. Click on the Elements button, located on the left side of your Landing Page Designer page.
2. Drag-n'-drop the Timer element, from the elements list, to an empty container inside the Designer page.
Make sure that your container is of the Full Width variety as that is the only container size that can accommodate a timer element!
B. Setting up the Timer
1. Click on the Settings icon on the toolbar that appears above your Timer when you hover over it.
Your Timer's Settings instantly appear on the left of your Designer page.
2. Choose a Background Color for the area behind your Timer, out of a color palette.
Please note that the background of the countdown timer is an image and therefore it will never have the exact same colour as the html colour.
C. Selecting a Timer theme
1. Use the Select Theme drop-down menu to choose your Timer's theme.
You have the two choices:
- Normal
Generates a Timer wherein the countdown is displayed using numbers, as in the example below.
- Text
Generates a Timer wherein the countdown is displayed using text, as in the example below.
When opting to use a Text Timer, you have the flexibility of changing the text to whatever you want it to be-just make sure to keep the brackets that contain the text, so that the timer actually works!
To take a peek at what your Text Timer is going to look like, click on Preview mode after you have added it to your design:
Once you are in Preview mode, select the device type(s) to check out how your landing page and Text Timer look on each.
This way, you can ensure that to make sure that your Text Timer looks great no matter what device it is being viewed on!
D. Setting up the expiration date
This is the heart of the Timer, so it bears looking into in more detail.
1. Click on the Expiration Date area, located on the Timer settings list.
A calendar appears.
2. Click on the blue buttons to navigate between months.
A warning will appear if you try to navigate to a date before the current one.
3. Click on a date to select when your Timer will expire.
4. Select the Time page, to set the exact time on that date when the Timer will expire.
5. Drag the Hours and Minutes sliders to set the exact time of day.
Remember that the format is hh:mm set in 24-hour time.
6. Click on the Save button when you're done.
E. Setting up a Normal Timer
Use the editing options to set up your normal Timer.
Click on each the + sign of each of Settings menus to expand said menus.
i) Your Font Settings options are:
- Label Color
Allows you to pick a color out of a color palette, for the labels under each counter. - Font family
Select your desired font from the drop-down menu. - Label Font Family
Choose a font for your Timer/s labels using the drop-down menu. - Font Size
Use the up -down arrows to choose your Timer's font size. Alternatively, type the desired number directly into the area next to the arrows. - Label Font Size
Use the up/down arrows to select your Timer labels' font size. Alternatively, type the desired number directly into the area next to the arrows. - Label Color
Allows you to pick a color out of a color palette, for your Timer's labels. - Time Color
Allows you to pick a color out of a color palette, for the numbers on the counters.
ii) Your Box Settings options are:
- Border Color
Allows you to choose a color out of a color palette, for the border of the boxes. - Box Color
Allows you to choose a color out of a color palette, for the boxes inside your Timer. - Box radius
Changes the radius of each box. Values go from 0 (square) to 60 (circle). - Border width
Sets the width for the border of the boxes inside your timer. Value range is 0 to 29.
iii) Your Edit Labels Settings options are:
- Days Label
Edit the label on the Days field. - Hours Label
Edit the label on the Hours field. - Minutes Label
Edit the label on the Minutes field. - Seconds Label
Edit the label on the Seconds field.
F. Setting up a Text Timer
The Text Timer is less complex in its design than the Normal timer. If you have already selected a Background Color and Expiration Date for your Text Timer, then you can play around with its Padding!
Use the up/down arrows in the Padding option (or type directly into the appropriate field) to set the desired amount of overall padding for your Timer. 
Clicking on the lock icon next to the Padding reveals further Padding options: Padding Top, Padding Bottom, Padding Left and Padding Right. 
As before, use the up/down arrows (or type into each field directly), to set the amount of Padding for the Top, Bottom, Left and Right of your Text TImer.
Moosend's Landing Page Designer is a powerful tool which enables you to design beautiful and effective landing pages with ease, so make sure you use it to its fullest! Apart from the Timer, don't neglect to also explore the many other available Element options which you can use to build and enhance your landing pages!