Text editor guide

This guide is for the text editor you find on most places on this site. it works with html, so you can easily style it with css, but unfortunately a lot of things can get blocked by the htmlpurifier so keep it simple.
you don't need any html/css knowledge to follow this guide, so don't worry, it's easy.

1. italic/bold text

Just click on the b or i. 
unfortunately, underline is more complicated, i'll cover it later.

2. text size

this is the easy way to do it, just select one from here. you can also do it using the font-size property but that's more complicated. i don't recommend.

3. text bg color

You can make the text have a background color using this. tap on the "/" to remove and the pallete to open the color selector.

4. text position

this can be used to center the text in the page, or make it stick to the right or left side of the page. i have no idea what the last one does, guess it's up to you to discover.

5. list making

You can use this to make a list. it has a variety of dots for it, or numbers, or letters, just tap the little arrows pointing down.
the part framed in blue makes the text stick to the side of the page, or go a bit in. just look at the example.

6. links

just dumpimng a link in there won't do anything unfortunately. the link will be simply displayed as normal text. what you have to do is tap the hyperlink icon: 

There put the link in the "url" section. it will automatically fill the "text to display" section with the url, but you're free to change that to anything.

You can also make an image as a link, just add the image in the text editor, select it and tep the hyperlink icon and add the link there.

 

Anyway, this is how a working link should look: 

7. images

you can easily add images in the text editor. Just click this: 

then add the image url as the source. you can also set the image size. that only affects how big it is in page, the image would be the same size as original if downloaded or something, so don't worry about ruining it's quality: 

8. spoiler tag

you can use this to tag any spoiler content. tap the eye with a + to remove the tag:

9. switch to html editor

This will allow you to edit the html of the text, you can add undelines, change text color and stuff from here. it only works properly on computer though, it removes any changes on mobile and it's unusable.

10. fix images

First thing i recommend you add this in front of any images, or check first if needed. some images may overflow on a small screen, and this will fix it. you can copy-paste it from here.
class="post-img"

11. underline

Just add this on the line you want to underline:
style="text-decoration: underline"

12. change text color

add this on the line you want to change the color of, replace the zeroes with your color code:
style="color: #000000"

13. mention someone

It is quite easy, just @username

 

14. Add class="card card-body" to make somehting like this

 

15. Add style="font-family: Papyrus Condensed;" to write in this font.

 

16. Add style="font-family: Trickster Condensed;" to write in this font.

 

If you need help with the text editor, contact me at Mysteriousshine#1652 on discord. also pls report if any of the images don't display properly.
Created: 9 September 2022, 16:00:14 EEST
Last updated: 11 July 2023, 19:37:57 EEST