cmc/cleberg.net

 1#+date:        [2023-01-05 Thu 00:00:00]
 2#+title:       Mass Unlike All Tumblr Posts
 3#+description: A JavaScript snippet to mass-unlike all your Tumblr posts.
 4#+slug:        mass-unlike-tumblr-posts
 5#+filetags:    :linux:personal:
 6
 7* The Dilemma
 8
 9The dilemma I had was pretty simple: I wanted to unlike all the posts I
10have liked on Tumblr so that I could follow a new focus on blogs and
11start fresh. Otherwise, Tumblr will keep recommending content based on
12your previous likes.
13
14* The Solution
15
16I searched the web for a while and noted that most solutions referenced
17Tumblr setting and dashboard pages that no longer exist. Additionally, I
18did not want to install a third party extension to do this, as some
19suggested.
20
21Luckily, I used Javascript for a while a few years ago and figured it
22would be easy enough to script a solution, as long as Tumblr had a
23system for the unlike buttons.
24
25** Identifying Unlike Buttons
26
27Tumblr's unlike buttons are structured as you can see in the following
28code block. All unlike buttons have an =aria-label= with a value of
29=Unlike=.
30
31#+begin_src html
32<button class="TRX6J" aria-label="Unlike">
33    <span class="EvhBA B1Z5w ztpfZ" tabindex="-1">
34        <svg
35            xmlns="http://www.w3.org/2000/svg"
36            height="21"
37            width="23"
38            role="presentation"
39        >
40            <use href="#managed-icon__like-filled"></use>
41        </svg>
42    </span>
43</button>
44#+end_src
45
46** Running a Script to Unlike All Likes
47
48To run this script, you will need to load the
49[[https://www.tumblr.com/likes][Likes | Tumblr]] page while logged in to
50your account.
51
52Further, be sure to scroll down to the bottom and force Tumblr to load
53more posts so that this script unlikes more posts at a time.
54
55Once you are logged in and the page is loaded, open the Developer Tools
56and be sure you're on the "Console" tab. It should look something like
57this (this is in Firefox, Chromium should be similar):
58
59#+caption: Firefox Dev Tools
60#+attr_html: :alt Firefox Dev Tools' Console tab will allow you to paste this command.
61[[https://img.cleberg.net/blog/20230105-mass-unlike-tumblr-posts/dev_console.webp]]
62
63All you need to do is paste the following snippet into the dev console.
64This code will collect all unlike buttons (=elements=) and then click
65each button to unlike it.
66
67Optionally, you can comment-out the line =elements[i].click();= and
68uncomment the =console.log()= lines to simply print out information
69without performing any actions. This can be useful to debug issues or
70confirm that the code below isn't doing anything you don't want it to.
71
72#+begin_src javascript
73const elements = document.querySelectorAll('[aria-label="Unlike"]');
74// console.log(elements); // 👉 [button]
75
76for (let i = 0; i < elements.length; i++) {
77    // console.log(elements[i]);
78    elements[i].click();
79}
80#+end_src
81
82* Results
83
84The results were quick for my situation, as it unliked ~200 posts within
852-3 seconds. I am not sure how this will perform on larger sets of likes
86(or if Tumblr has a limit to unliking posts).
87
88You can see the below screenshot showing that I pasted the snippet into
89the console, pressed Enter, and then the posts are automatically
90unliked.
91
92#+caption: Script Results
93#+attr_html: :alt The script will return "undefined" when run in the console.
94[[https://img.cleberg.net/blog/20230105-mass-unlike-tumblr-posts/script_results.webp]]
95
96Thinking about this further, I would bet that this would be fairly
97simple to package into a browser add-on so that users could install the
98add-on, go to their Likes page, and click a button to run the script.
99Food for thought.