You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: content/_includes/tip-me.njk
+7-8Lines changed: 7 additions & 8 deletions
Original file line number
Diff line number
Diff line change
@@ -3,20 +3,19 @@
3
3
<sectionclass="buy-me-a-coffee">
4
4
<div>
5
5
<p>
6
-
I spend <b>hours</b> of my free time creating {%iftipType%}{{tipType}}s{%else%}pages{%endif%} like these that I publish for free. If you'd like to say thanks, please share this {%if
7
-
tipType%}{{tipType}}s{%else%}pages{%endif%} with others and/or <b><ahref="https://ko-fi.com/petrastipjar/goal?g=0"target="_blank">buy me a coffee</a></b
6
+
I spend <b>many hours</b> of my free time creating {%iftipType%}{{tipType}}s{%else%}pages{%endif%} like these that I publish for free. If you'd like to say thanks, please share this {%
7
+
iftipType%}{{tipType}}s{%else%}pages{%endif%} with others and/or <b><ahref="https://ko-fi.com/petrastipjar/goal?g=0"target="_blank">buy me a coffee (donate)</a></b
>This autumn I took in a stray <ahref="/about/cats">cat</a> that gave birth to 5 kittens in my apartment. <mark>As an unemployed uni student, the expenses have been rough for me.</mark></b
13
+
><b>This autumn I took in a stray <ahref="/about/cats">cat</a> that gave birth to 5 kittens in my apartment. As an unemployed uni student, the expenses have been rough for me.</b>
14
+
<smallstyle="display: block; margin-top: 5px">
15
+
Currently I need 10 packages of wet food a day + dry food + cat litter + vet appointments. I also will have to get the mom spayed (200eur). I already spent over 400eur on them since October.
16
+
I appreciate ANY help, no matter how small! Thank you!!!</small
15
17
>
16
-
Currently they eat almost 10 packages of wet food a day, plus dry food, cat litter, and of course the expensive vet appointments. I also will have to get Holly (the mom) spayed, which will
17
-
cost 200 Euros. I already spent over 400 Euros on them since October. I appreciate ANY help, no matter how small!
18
-
<ahref="https://ko-fi.com/petrastipjar/goal?g=0"target="_blank"> You can donate on my Ko-Fi.</a> Thank you!!!</small
<ahref="https://cloudythms.tumblr.com/tagged/theme" target="_blank" rel="nofollow">Tumblr Themes (on hiatus)</a>
18
19
</p>
20
+
</section>
21
+
22
+
<section>
23
+
<h2>Userscripts</h2>
24
+
<blockquoteclass="tip">
25
+
<b>What is a userscript? </b>A userscript is some javascript code that gets in injected into certain websites (depending on the script). This can be used to add features, change the appearance of
26
+
the site, hide elements, or otherwise enhance your experience. They can be installed using browser extensions such as
27
+
<ahref="https://addons.mozilla.org/en-US/firefox/addon/greasemonkey/" target="_blank">Greasemonkey</a> or <ahref="https://www.tampermonkey.net/index.php" target="_blank">Tampermonkey</a>, which
28
+
are available for all popular browsers and also work on mobile devices. Also, it's 100% free, <i>and</i> you can even write your own! You can find userscripts on sites such as
29
+
<ahref="https://greasyfork.org/en/users/354138-petracoding" target="_blank">Greasyfork</a> or <ahref="https://openuserjs.org/users/petracoding" target="_blank">OpenUserJS</a>.
30
+
</blockquote>
31
+
<blockquoteclass="help"><b>How to install?</b> If you need help installing userscripts you can check out <ahref="/resources/userscript-tutorial">my tutorial</a>.</blockquote>
32
+
33
+
<!--
19
34
<hr />
20
-
<h2>tools i've made</h2>
21
-
<ul>
22
-
<li><ahref="https://petracoding.github.io/tumblr-tag-list-tool.html" target="_blank">Tumblr Tag List Tool</a> - quickly generate a list of tag links for your Tumblr blog.</li>
23
-
<!-- <li><a href="https://petracoding.github.io/notion/" target="_blank">Notion Widgets</a> - generate free widgets to use in Notion.</li> -->
24
-
<li><ahref="https://petracoding.github.io/pinterest/" target="_blank">Pinterest Board Widget Generator</a> - generate an iframe (or Notion widget) for your Pinterest board</li>
25
-
<li><ahref="https://petracoding.github.io/vocabulary-manager.html" target="_blank">Vocabulary Manager</a> - tools for managing your word lists</li>
26
-
<li><ahref="https://petracoding.github.io/manual-list-sorter.html" target="_blank">Manual List Sorter</a> - sort items in a list into two seperate lists easily</li>
<div class="bookmark__description">A blacklist that runs on every website. Define your own blacklists and blur/hide/replace/highlight them. Lots of options!</div>
<ahref="https://greasyfork.org/en/scripts/470806-goodreads-no-negative-reviews" target="_blank"><b>Goodreads.com</b> No Negative Reviews</a> - Hides book reviews under a certain amount of stars
<ahref="https://greasyfork.org/en/scripts/470733-goodreads-sort-bookshelves-on-profiles-alphabetically" target="_blank"><b>Goodreads.com</b> Sort bookshelves</a> - Sort the bookshelves on
<ahref="https://greasyfork.org/en/scripts/405872-listography-backup" target="_blank"><b>Listography.com</b> Backup</a> - Adds functionality to export all lists for backup purposes.
44
67
</li>
45
68
<li>
46
69
<ahref="https://greasyfork.org/en/scripts/470294-listography-tweaks" target="_blank"><b>Listography.com </b>Tweaks</a> - Adds functionality to change colors as well as a few other tweaks.
<ahref="https://greasyfork.org/en/scripts/451891-letterboxd-no-negative-reviews" target="_blank"><b>Letterboxd.com</b> No Negative Reviews</a> - Hides movie reviews under a certain amount of
<ahref="https://greasyfork.org/en/scripts/470272-vocabulary-com-export" target="_blank"><b>Vocabulary.com</b> Export</a> - Adds functionality for copying vocabulary lists to the clipboard
65
86
</li>
66
87
</ul>
67
-
<hr/>
88
+
</section>
89
+
90
+
<section>
91
+
<h2>Tools</h2>
92
+
<p>Here are some other tools I made, all hosted on my other website.</p>
93
+
<ul>
94
+
<li><ahref="https://petracoding.github.io/tumblr-tag-list-tool.html" target="_blank">Tumblr Tag List Tool</a> - quickly generate a list of tag links for your Tumblr blog.</li>
95
+
<!-- <li><a href="https://petracoding.github.io/notion/" target="_blank">Notion Widgets</a> - generate free widgets to use in Notion.</li> -->
96
+
<li><ahref="https://petracoding.github.io/pinterest/" target="_blank">Pinterest Board Widget Generator</a> - generate an iframe (or Notion widget) for your Pinterest board</li>
97
+
<li><ahref="https://petracoding.github.io/vocabulary-manager.html" target="_blank">Vocabulary Manager</a> - tools for managing your word lists</li>
98
+
<li><ahref="https://petracoding.github.io/manual-list-sorter.html" target="_blank">Manual List Sorter</a> - sort items in a list into two seperate lists easily</li>
99
+
</ul>
100
+
</section>
68
101
69
-
<div>
102
+
<!---
103
+
<section>
70
104
<h2>my big project...</h2>
71
105
<p>I want to make a social media site someday, because I think that almost all of the social media sites suck, and I want to make one that doesn't suck!</p>
72
106
<p>
73
107
Please take the <a href="https://forms.gle/2i9v12kFAwgFjtdP6" target="_blank">survey</a> if you want your opinion to be heard! It will only take a few minutes.
description: "A tutorial on how to install and use userscripts with Greasemonkey or Tampermonkey. Neocities."
5
+
nesting: "../"
6
+
lightbox: true
7
+
tipType: "tutorial"
8
+
---
9
+
10
+
<section>
11
+
<h1>Userscript Tutorials</h1>
12
+
<blockquoteclass="tip">
13
+
<b>What is a userscript? </b>A userscript is some javascript code that gets in injected into certain websites (depending on the script). This can be used to add features, change the appearance of
14
+
the site, hide elements, or otherwise enhance your experience. They can be installed using browser extensions such as
15
+
<ahref="https://addons.mozilla.org/en-US/firefox/addon/greasemonkey/" target="_blank">Greasemonkey</a> or <ahref="https://www.tampermonkey.net/index.php" target="_blank">Tampermonkey</a>, which
16
+
are available for all popular browsers and also work on mobile devices. Also, it's 100% free, <i>and</i> you can even write your own! You can find userscripts on sites such as
17
+
<ahref="https://greasyfork.org/en/users/354138-petracoding" target="_blank">Greasyfork</a> or <ahref="https://openuserjs.org/users/petracoding" target="_blank">OpenUserJS</a>.
18
+
</blockquote>
19
+
</section>
20
+
21
+
<sectionid="install">
22
+
<h2>Installing userscripts</h2>
23
+
<h3>1. Installing the browser extension:</h3>
24
+
<p>
25
+
To use userscripts you first need to install a browser extension with which you can install the userscripts. There are several available, but I recommend
26
+
<ahref="https://addons.mozilla.org/en-US/firefox/addon/greasemonkey/" target="_blank">Greasemonkey</a> for Firefox, or
27
+
<ahref="https://www.tampermonkey.net/index.php" target="_blank">Tampermonkey</a> for Chrome. They also work in the app versions. Just install these extensions like any other, and make sure the
28
+
extension shortcut is somewhere you can find it (because you will need the menu.)
29
+
</p>
30
+
31
+
<blockquoteclass="warning">
32
+
<b>Chrome:</b> In Google Chrome you need a few additional steps for the extension to work. Open the 'Manage Extension' page and enable "Developer mode" in the top right corner. Then, in the
33
+
settings of the extension you just installed, enable "Allow User Scripts". (See screenshots.)
<imgsrc="{{nesting}}assets/img/coding/userscripts/chrome-settings2.png" alt="A screenshot of Chrome." />
44
+
</a>
45
+
</div>
46
+
</div>
47
+
48
+
<hr/>
49
+
50
+
<h3>2. Installing the userscript:</h3>
51
+
<p>
52
+
Now you can use sites like <ahref="https://greasyfork.org/en/users/354138-petracoding" target="_blank">Greasyfork</a> or
53
+
<ahref="https://openuserjs.org/users/petracoding" target="_blank">OpenUserJS</a> to find userscripts you want to install. There, just click the "install" button of the script you've chosen.
<imgsrc="{{nesting}}assets/img/coding/userscripts/greasyfork.png" alt="A screenshot of the Install button." />
57
+
</a>
58
+
<p>
59
+
Your extension's (Greasemonkey/Tampermonkey) info might pop up and ask you whether you really want to install the script. Once you confirm the script should already work! Keep in mind that most
60
+
userscripts are created for specific websites (e.g. a YouTube ad blocker) and therefore only work on these websites.
61
+
</p>
62
+
<p><i>Please rate the userscript / give feedback to the creator!</i></p>
63
+
</section>
64
+
65
+
<sectionid="settings">
66
+
<h2>Changing userscript settings</h2>
67
+
<p>
68
+
Some (not all!) userscripts have settings you can change to customize the script's behaviour. If there is an UI for this it can be opened through the extension (Greasemonkey/Tampermonkey) menu:
69
+
</p>
70
+
<divclass="two-columns">
71
+
<div>
72
+
<p><b>Greasemonkey:</b> Select "User script commands..." to see a list of all possible options of installed scripts.</p>
0 commit comments