Skip to main content
العربية

Edit a countdown in the advanced editor

The Advanced editor gives you full control of the countdown's design. You can edit any text, change fonts, colors and borders, and add elements such as buttons and images.

For quick changes to the text, time and colors, use the simpler Edit countdown timer editor. See Edit the countdown text and button.

warning

The advanced editor works on desktop only. Every save in it changes the countdown published on your store right away, and there is no history of earlier versions.

When to use this article​

  • You want to rearrange the countdown's elements or add new ones.
  • You want fonts, colors or borders that the simple editor does not offer.
  • You want to edit any text inside the countdown.

Before you start​

  • Create a countdown. See Create your first countdown timer.
  • Use a computer. On a screen 768 pixels wide or narrower, you see the messages The advanced editor works on desktop only and You can edit on your phone with the simple editor, with an Open the simple editor button.

How to open the advanced editor​

Open the countdown in one of these ways:

  • In the Edit countdown timer editor, click Advanced editor at the top of the page.
  • On the settings page, click Advanced editor at the top of the page. See Open the countdown display settings.
  • When you create a new countdown, in the Create a new popup window, click Use advanced editor instead, then Save.
note

The Design editor button on the settings page, and the Edit and Customize design buttons in the My campaigns list, open the simple Edit countdown timer editor, not the advanced editor.

Steps​

1. Get to know the screen​

  • At the top are buttons to show component outlines, preview, full screen, undo and redo, clear the canvas, go back, save and publish. Three of them are labeled Save, Publish and Back Home.
  • The side panel has the Style Manager, Settings, Layers and Blocks.
  • At the top, the Main popup and Thank-you page switch moves you between the countdown popup and the thank-you page. Each click reloads the page.

2. Edit the text​

  1. Double-click the text on the canvas.
  2. Enter the new text. Pasting inserts plain text without formatting.
  3. The countdown numbers on the canvas are for illustration only. On your store, the countdown calculates the real numbers every second.

3. Change fonts and colors​

  1. Click the element you want to change, such as the numbers box.
  2. In the Style Manager in the side panel, open Typography.
  3. Change Font family, Color, Font size, Font weight and more.
  4. To change the background color, open Background and choose Background color. For borders, open Border & Shadow.

The font list here is wider than in the simple editor. It includes Cairo, Tajawal, Amiri and other Arabic fonts.

4. Change the countdown end time​

The Settings panel has no field for the end time. Use the dedicated button:

  1. Click the round orange button with the clock icon. Its tooltip is "Countdown Quick Edit". It appears at the edge of the screen about 3 seconds after the editor loads. It also opens when you hover over the countdown.
  2. The Update countdown time window appears.
  3. Under Choose the date, choose the Day, Month and Year.
  4. Under Choose the time, choose the Hour, the Minute, and AM or PM.
  5. Click Update. To go back, click Cancel.
  6. "Countdown updated!" appears, and the change is saved automatically.

The Update countdown time window closes automatically 30 seconds after it opens, so get the date ready before you open it.

If you choose a date in the past, the message "The date you chose is in the past. Continue anyway?" appears. Click Continue to accept it or Cancel to go back.

If you do not fill in every field, "Fill in all the required fields." appears.

5. Change images​

  1. Double-click the image. The image manager window opens.
  2. Upload an image in JPG, JPEG, PNG, SVG, GIF or WebP format, up to 5 MB.

6. Edit the thank-you page​

  1. Click Thank-you page at the top. The page reloads on the thank-you page.
  2. Edit the text as in the steps above.
  3. To go back, click Main popup.

7. Save​

  1. Click the Save button at the top. "Updated successfully" appears.
  2. The editor also saves automatically after every 5 changes, with no message.

8. Publish the countdown​

The rocket button Publish does not publish the countdown. It only opens the settings page. To publish the countdown:

  1. On the settings page, click Publish popup.
  2. Or move the status switch in My campaigns to Live.

See Publish or pause a countdown.

Warnings​

  • Saving is live: every save or autosave changes the published countdown right away. There is no draft and no version history.
  • The templates button: the Available templates button replaces the whole countdown design with another template. Click it only if you want to start over.
  • Deleting the timer: if you delete the countdown element from the canvas, you cannot add it back, because the Blocks list has no countdown element. Deleting a unit box, such as days, removes that unit from the countdown.
  • Desktop only: the advanced editor does not work on a phone.
  • No live preview: the numbers on the canvas do not move. To see the real countdown, click Preview on the settings page or the eye icon in My campaigns.
  • Clearing the canvas: the trash can button clears the whole canvas, and a confirmation message appears.

What the advanced editor does not offer​

  • There is no end date field in the Settings panel. Use the clock button.
  • You cannot add a new countdown.
  • You cannot choose which units show. Delete a unit box to hide it.
  • There is no preview at device sizes.

Can I go back to the simple editor?​

Yes, as long as the countdown still has its timer element. After you save in the advanced editor, you can open the simple editor from My campaigns by clicking the Edit or Customize design icon, or from the floating simple editor button inside the advanced editor (its label still shows in Arabic).

Check that it works​

  • "Updated successfully" appeared after you saved.
  • You opened Preview from the settings page and saw the countdown the way you want.
  • The countdown's status in My campaigns is Live.
Last updated on