{"id":1649,"date":"2025-07-07T12:32:52","date_gmt":"2025-07-07T03:02:52","guid":{"rendered":"https:\/\/ale.chenonetta.com\/blog\/?p=1649"},"modified":"2026-01-05T14:03:47","modified_gmt":"2026-01-05T04:33:47","slug":"show-ticktick-countdowns-above-your-todo-list","status":"publish","type":"post","link":"https:\/\/ale.chenonetta.com\/blog\/2025\/07\/show-ticktick-countdowns-above-your-todo-list\/","title":{"rendered":"Show TickTick countdowns above your todo list"},"content":{"rendered":"\n

I’ve been using TickTick as my todo list and it’s been working nicely. Recently, they added the countdown feature, which is great but it’s also off in its own tab so hidden away. I personally find the presence of the numbers to be a great motivator so I wanted to place them above my todo list so it could help me focus and prioritise what needed to be worked on before the milestone dates come to pass. <\/p>\n\n\n\n

\"\"<\/a><\/figure>\n\n\n\n

To achieve this, I’m running a TamperMonkey script which allows me to run additional Javascript on the page. It inserts an iFrame with a second instance of TickTick above the task list. It’s a janky solution but I didn’t feel the need to refine it any further, especially as I hope that TickTick will continue to add enhancements to the countdowns themselves so that the script is not necessary.<\/p>\n\n\n\n

I have submitted feature requests to TickTick to have countdowns above the task list officially incorporated and suggest that you also contact them if you think this is a useful feature!<\/p>\n\n\n\n

[Edit 5 January 2026:<\/strong> it appears that countdowns can be flagged to appear on Smart Lists, it seems this has been present since the introduction of the feature and I simply didn’t notice as I primarily live in a custom filter]<\/p>\n\n\n\n

Instructions<\/h2>\n\n\n\n

Install TamperMonkey:
<\/strong>https:\/\/www.tampermonkey.net\/<\/a><\/p>\n\n\n\n

Add a new script to TamperMonkey:<\/strong><\/p>\n\n\n\n

From the TamperMonkey extension menu choose “Create a new script…”<\/p>\n\n\n\n

\"\"<\/a><\/figure>\n\n\n\n

Paste the below code into the editor<\/p>\n\n\n\n

\n\/\/ ==UserScript==\n\/\/ @name         TickTick Countdown View\n\/\/ @namespace    http:\/\/tampermonkey.net\/\n\/\/ @version      2025-05-12\n\/\/ @description  Display countdowns above the task list\n\/\/ @author       You\n\/\/ @match        https:\/\/ticktick.com\/webapp\n\/\/ @icon         https:\/\/www.google.com\/s2\/favicons?sz=64&domain=ticktick.com\n\/\/ @grant        window.onurlchange\n\/\/ @noframes\n\/\/ @run-at       document-idle\n\/\/ ==\/UserScript==\n\n\/\/ Add an iframe to the page to open the TickTick countdown page\nconst countdownFrame = document.createElement(\"iframe\");\ncountdownFrame.id = \"countdown-frame\";\n\/\/ Appearance settings\ncountdownFrame.style.zoom = \"0.5\";\ncountdownFrame.style.height = \"280px\";\n\n(function () {\n  \"use strict\";\n\n  addCountdownFrame();\n\n  \/\/ Listen for navigation and add the countdown frame when navigation occurs.\n  if (window.onurlchange === null) {\n    window.addEventListener(\"urlchange\", (info) => {\n      addCountdownFrame();\n    });\n  }\n})();\n\nfunction addCountdownFrame() {\n  if (countdownFrame?.src !== 'https:\/\/ticktick.com\/webapp#countdown') {\n    countdownFrame.src = \"https:\/\/ticktick.com\/webapp#countdown\";\n  }\n  \/\/ Only add the countdown frame to the tasks page, above the task list view\n  if (window.location.hash.endsWith(\"\/tasks\")) {\n    \/\/ wait for the task-list-view to be available\n    const interval = setInterval(() => {\n      const taskListView = document.querySelector(\"#task-list-view\");\n      if (taskListView) {\n        clearInterval(interval);\n        const firstChild = taskListView.firstChild;\n\n        \/\/ add countdownFrame as first child of task-list-view\n        if (firstChild?.tagName !== \"IFRAME\") {\n          \/\/ add countdownFrame as first child of task-list-view\n          taskListView.insertBefore(countdownFrame, firstChild);\n        }\n      }\n    }, 1000);\n  }\n}<\/code><\/pre>\n\n\n\n
Limitations<\/strong><\/p>\n\n\n\n
Sometimes the countdowns don’t load when you first visit the page, clicking between lists should cause it to show.<\/p>\n","protected":false},"excerpt":{"rendered":"
I’ve been using TickTick as my todo list and it’s been working nicely. Recently, they added the countdown feature, which is great but it’s also off in its own tab so hidden away. I personally find the presence of the numbers to be a great motivator so I wanted to place them above my todo … <\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[54],"tags":[],"class_list":{"0":"entry","1":"post","2":"publish","3":"author-admin","4":"post-1649","6":"format-standard","7":"category-code-2"},"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/ale.chenonetta.com\/blog\/wp-json\/wp\/v2\/posts\/1649","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ale.chenonetta.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ale.chenonetta.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ale.chenonetta.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ale.chenonetta.com\/blog\/wp-json\/wp\/v2\/comments?post=1649"}],"version-history":[{"count":0,"href":"https:\/\/ale.chenonetta.com\/blog\/wp-json\/wp\/v2\/posts\/1649\/revisions"}],"wp:attachment":[{"href":"https:\/\/ale.chenonetta.com\/blog\/wp-json\/wp\/v2\/media?parent=1649"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ale.chenonetta.com\/blog\/wp-json\/wp\/v2\/categories?post=1649"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ale.chenonetta.com\/blog\/wp-json\/wp\/v2\/tags?post=1649"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}