Add a Countdown Timer to WordPress with Elementor’s Countdown Widget

hey youtubers this is Noah from
Elementor today we’ll be going over the
countdown widget this widget enables you
to add dynamically creative countdowns
to your page
so first we’ll be searching for the
widget and dragging it in and once it’s
direct and you will see the content tab
and the style tab in the content tab you
have full control over the countdown
widget contents so first of all we have
the due dates here you actually set the
date and time of your countdown so say
we give it a month two o’clock and once
I step out see how it starts rolling so
next I have the view which is either
block or inline meaning the text and the
numbers will be viewed as block which is
just like this with the numbers and then
the text under or in line one next to
the other now we have for the days hours
minutes and seconds we have the option
of setting it as show or hide see for
each one I could show it or hide it and
seconds see next I have the show labels
option where I could set as show or hide
for the labels meaning the text days
hours minutes and seconds so I could
hide them and now I see only the numbers
now if I choose to show the labels see
how you have the option of customizing
of the labels if I activate it I could
actually edit the days hours minutes and
seconds text for example instead of days
I could say weeks etc for the rest of
them I’ll just change that back alright
so that was the content area of the
widget we’ll be moving on to the style
area the widget now here I have full
control over the boxes
the content style so in the box of style
options I have the container width where
I could choose the actual width of the
entire container of the widgets and I
have a background color where I could
choose the background color of the boxes
alright and borders type I could choose
the type of the border or none see solid
then I could choose the width and the
color and radius say 20 or 50 etc now of
course you could leave the radius
without any border meaning I could set
the board of type of none and still you
will see the border radius set as 50
next I have space between the boxes here
I could set the space between the boxes
as it sounds and I have padding which is
actually the inner space between the
text and the edge of the boxes so say I
give it 20 50 80 so those were the boxes
style options next the content style
options I have for the digits and the
label so for the digits I could choose
the color okay and typography if I
activate it I could customize the
typography for example size it up
family wait transform etc the usuals and
next I have for the label the color as
well I could choose the color for it the
label and just like for the digits I
could also customize the typography of
the label size family wait transform
style line height letter spacing so now
I’ll be showing you a few beautiful
sections that we created with this
countdown widget let’s just scroll down
so here as you can see is a beautiful
section with this countdown widget now
how did we do this let’s head over to
the style tab boxes we gave it a
background color of pink and we reduced
completely the space between the boxes
next section is let’s head over to the
style box this we gave it a background
color of complete opacity okay
now you could also give it black if the
background is completely black and we
give it a border type of solid color red
okay next section here we also gave an
opacity a light opacity and here it’s
pretty neat how you could see the image
background underneath it next section
this is a really nice section where we
actually remember we talked about the
view see your view we until now we only
saw the block view here it’s the inline
view see how neat that looks and here’s
another beautiful example for the inline
view of the countdown widget so
basically these examples give you the
idea of how great this widget actually
is I hope you enjoyed this video for
more videos and tutorials subscribe our
youtube channel or
miss adopts dot Elementor calm