Close

Account

Documentation

Forum

Menu

Next
Prev
close

JKit – Countdown

JKit – Countdown is used to count down the time specified by the user, so that the user can set the time to attend the upcoming event.

The guide is separated into the sections below. Click on it to navigate to the designated section.

  1. Activate JKit – Countdown (#)
  2. Adding JKit – Countdown to Page (#)
  3. Content Setting JKit – Countdown (#)
  4. Style Setting JKit – Countdown (#)

Activate JKit – Countdown


Before starting, please make sure the Jkit element is already activated on Jeg Elementor Kit DashboardElements

Adding JKit – Countdown


to add JKit – Countdown Text to your page you can open Elementor in your page once Elementor is opened you can search for JKit – Countdown in search widget.

Content Setting JKit – Countdown


The following are the sections in Content JKit – Countdown along with their explanations.There are several options included in the JKit – Countdown content setting that you can adapt to your needs. Click the content icon to navigate to the specified section.

  1. Content (#)
  2. Expired Action (#)

Content

    1. Due Date
      Used to select the time
    2. Show Days
      Used to fill the days
    3. Custom Label for Days
      Used to change the text of the days
    4. Show Hours
      Used to fill the hours
    5. Custom Label for Hours
      Used to change the text of the hours
    6. Show Minutes
      Used to fill in minutes
    7. Custom Label for Minutes
      Used to change the text of the minutes
    8. Show Seconds
      Used to fill seconds
    9. Custom Label for Seconds
      Used to change the text of the seconds
    10. Show Separator
      Used to make separator

Expired Action

    1. Expire Type
      To select an expired type
    2. On Expiry Title
      To make the title expiry
    3. On Expiry Content
      To make content expiry
    4. Link
      Used to upload link

Style Setting JKit – Countdown


Settings JKit – Countdown is divided into sections, so you can configure them however you like. Here are the parts of JKit – Countdown.

  1. Content (#)
  2. Days (#)
  3. Hours (#)
  4. Minutes (#)
  5. Seconds (#)
  6. CSS Box (#)

Content

    1. Column
      To reduce the column
    2. Row Gap
      To divide the distance between the lines
    3. Vertical Alignment
      To align vertically
    4. Horizontal Alignment
      To align horizontally
    5. Label Position
      To change the label position

Days

    1. Digit
      • Color
        To change the color of the digit
    2. Background
      • Background Type
        Select background from digit
    3. Border
      • Border Type
        Choose borders
      • Box Shadow
        Used to add shadows
      • Typography
        To change digit
      • Padding
        Change the padding of the digit
      • Margin
        Change the margin of the digit
      • Border Radius
        Set all angles with a certain value
    4. Label
      • Color
        To change the color of the label
      • Typography
        To change label
    5. Background
      • Background Type
        Select background from label
    6. Border
      • Border Type
        Choose borders
      • Box Shadow
        Add an icon to the button
      • Padding
        Change the padding of the label
      • Margin
        Change the margin of the label
      • Border Radius
        Set all angles with a certain value
    7. Background
      • Background Type
        Select background from background
    8. Border
      • Border Type
        Choose borders
      • Box Shadow
        Used to add shadows
      • Border Radius
        Set all angles with a certain value
      • Vertical Alignment
        To align vertically
      • Horizontal Alignment
        To align horizontally
      • Width
        To widen the background
      • Height
        To extend the background
    9. Separator
      • Color
        To change the color of the separator
      • Typography
        To change separator
      • Vertical Position
        To align vertically
      • Horizontal Position
        To align horizontally

Hours

    1. Digit
      • Color
        To change the color of the digit
    2. Background
      • Background Type
        Select background from digit
    3. Border
      • Border Type
        Choose borders
      • Box Shadow
        Used to add shadows
      • Typography
        To change digit
      • Padding
        Change the padding of the digit
      • Margin
        Change the margin of the digit
      • Border Radius
        Set all angles with a certain value
    4. Label
      • Color
        To change the color of the label
      • Typography
        To change label
    5. Background
      • Background Type
        Select background from label
    6. Border
      • Border Type
        Choose borders
      • Box Shadow
        Add an icon to the button
      • Padding
        Change the padding of the label
      • Margin
        Change the margin of the label
      • Border Radius
        Set all angles with a certain value
    7. Background
      • Background Type
        Select background from background
    8. Border
      • Border Type
        Choose borders
      • Box Shadow
        Used to add shadows
      • Border Radius
        Set all angles with a certain value
      • Vertical Alignment
        To align vertically
      • Horizontal Alignment
        To align horizontally
      • Width
        To widen the background
      • Height
        To extend the background
    9. Separator
      • Color
        To change the color of the separator
      • Typography
        To change separator
      • Vertical Position
        To align vertically
      • Horizontal Position
        To align horizontally

Minutes

    1. Digit
      • Color
        To change the color of the digit
    2. Background
      • Background Type
        Select background from digit
    3. Border
      • Border Type
        Choose borders
      • Box Shadow
        Used to add shadows
      • Typography
        To change digit
      • Padding
        Change the padding of the digit
      • Margin
        Change the margin of the digit
      • Border Radius
        Set all angles with a certain value
    4. Label
      • Color
        To change the color of the label
      • Typography
        To change label
    5. Background
      • Background Type
        Select background from label
    6. Border
      • Border Type
        Choose borders
      • Box Shadow
        Add an icon to the button
      • Padding
        Change the padding of the label
      • Margin
        Change the margin of the label
      • Border Radius
        Set all angles with a certain value
    7. Background
      • Background Type
        Select background from background
    8. Border
      • Border Type
        Choose borders
      • Box Shadow
        Used to add shadows
      • Border Radius
        Set all angles with a certain value
      • Vertical Alignment
        To align vertically
      • Horizontal Alignment
        To align horizontally
      • Width
        To widen the background
      • Height
        To extend the background
    9. Separator
      • Color
        To change the color of the separator
      • Typography
        To change separator
      • Vertical Position
        To align vertically
      • Horizontal Position
        To align horizontally

Seconds

    1. Digit
      • Color
        To change the color of the digit
    2. Background
      • Background Type
        Select background from digit
    3. Border
      • Border Type
        Choose borders
      • Box Shadow
        Used to add shadows
      • Typography
        To change digit
      • Padding
        Change the padding of the digit
      • Margin
        Change the margin of the digit
      • Border Radius
        Set all angles with a certain value
    4. Label
      • Color
        To change the color of the label
      • Typography
        To change label
    5. Background
      • Background Type
        Select background from label
    6. Border
      • Border Type
        Choose borders
      • Box Shadow
        Add an icon to the button
      • Padding
        Change the padding of the label
      • Margin
        Change the margin of the label
      • Border Radius
        Set all angles with a certain value
    7. Background
      • Background Type
        Select background from background
    8. Border
      • Border Type
        Choose borders
      • Box Shadow
        Used to add shadows
      • Border Radius
        Set all angles with a certain value
      • Vertical Alignment
        To align vertically
      • Horizontal Alignment
        To align horizontally
      • Width
        To widen the background
      • Height
        To extend the background

CSS Box

You can put further CSS code here in accordance with the defined class and id.