content/blog/2023-01-05-mass-unlike-tumblr-posts.org

 1#+date:        <2023-01-05 Thu 00:00:00>
 2#+title:       Bulk Removal of Likes from Tumblr Posts Using JavaScript
 3#+description: Instructions for executing a JavaScript script to automate the mass unlike operation for Tumblr posts without requiring additional software.
 4#+slug:        mass-unlike-tumblr-posts
 5#+filetags:    :tumblr:javascript:automation:
 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[[https:///img.cleberg.net/blog/20230105-mass-unlike-tumblr-posts/dev_console.png]]
61
62All you need to do is paste the following snippet into the dev console.
63This code will collect all unlike buttons (=elements=) and then click
64each button to unlike it.
65
66Optionally, you can comment-out the line =elements[i].click();= and
67uncomment the =console.log()= lines to simply print out information
68without performing any actions. This can be useful to debug issues or
69confirm that the code below isn't doing anything you don't want it to.
70
71#+begin_src javascript
72const elements = document.querySelectorAll('[aria-label="Unlike"]');
73// console.log(elements); // 👉 [button]
74
75for (let i = 0; i < elements.length; i++) {
76    // console.log(elements[i]);
77    elements[i].click();
78}
79#+end_src
80
81* Results
82
83The results were quick for my situation, as it unliked ~200 posts within
842-3 seconds. I am not sure how this will perform on larger sets of likes
85(or if Tumblr has a limit to unliking posts).
86
87You can see the below screenshot showing that I pasted the snippet into
88the console, pressed Enter, and then the posts are automatically
89unliked.
90
91#+caption: Script !Results
92[[https:///img.cleberg.net/blog/20230105-mass-unlike-tumblr-posts/script_results.png]]
93
94Thinking about this further, I would bet that this would be fairly
95simple to package into a browser add-on so that users could install the
96add-on, go to their Likes page, and click a button to run the script.
97Food for thought.