"Shoot. You're still here. I assume either the hyperlink doesn't work or you're just not the reader I was expecting. Poor soul was not that smart and was all beliefs and no facts. Probably from Texas, Oklahoma maybe. I assume they would fall for that distraction. Anyway. Let me get rid of those quotation marks real quick, they get in the way."
Now that's better. By the way, here's the source code of the table above. Not that you can do anything with it if you know nothing.
Now, for this lesson, I'll introduce the HTML table tag and all the various associated tags. Makes no sense? It will at the intermediate level.
I won't deal with borders or merging cells, just tags. There will be enough on your plate.
Oh and, name's Torial by the way, never forget that. There's a certain someone I really wish to isekai so if you're going to stick with me you're going to help me. I do the truck thing and you do the system annoucements. Fair?
Damn I really wished there was a way to check if you can read.
Beginner level ★☆☆☆☆ -- What's a Table
This is a table:
Isn't she beautiful? I made this one with the RoyalRoad (RR) editor. It's not based on the any truth or fact, so it's a fictionnal table because this is a fiction.
Anything that is sorted into rows and columns is a table. Each element of a table is a cell. Above, there's 1 row, 2 columns and a total of 2 cells. I know, I know. Those are facts but I can't really tell you there are 10 data cells. That would confuse you as you would obviously think it's written in binary.
Others might call it a blue box because that's how they look on RR and what they refer to is called a table. There's a button to add them in the editor -- only the chapter editor if you are an author, not the comment editor. Feel free to try it out. It should look like this: ?
Now you can make neet tables, even change some of their properties. At least you know it exists. It's easy to use and does the job most of the time. Now. Shoo~ Get out.
Basic level ★★☆☆☆ -- Source code
Sticking with me, huh? Maybe you're just looking for the source code? Note that you don't need to understand everything. Here it is:
You can copy-paste that code in a source code editor. There's a button to switch editors in both the chapter editor and the comment editor. Feel free to try it out. It should look like this: <>
Before I forgot and because this is a fiction, let me retell that. Real quick. "If thou seekth to lookth onto the beyondth that is the truth of the plain text you seeth, seekth and pressth the <> glyth". Yes, that's a load of baloney. But we need those, because if you were to open a book for the first time in your life, let's say The Grapes of Wrath and actually learned anything from it then suddenly it's not a fiction you're reading but a non-fiction! Or maybe it's just in Oklahoma that fictions are expected to teach you about real history--hello Tulsa--while nonfiction teach you about beliefs. *Ahem*
Tables are not exclusive to RR and you can definitively copy-paste tables from many sources, though some information might get lost. Here's a blank cell I copied from Excel:
You know I expect you to do quest. It's litterally a RPG and you are the hero's system but you still get to do quests, alright? I also don't mind you commenting bellow for the sake of testing tables. Just don't think this is an interactive fiction because I want nothing to do with you.
Do the quests. Really. They help. Trust me I have only the best intentions for you.
No. No. No. Only scrolling down to check the <> button. Promise?
Sigh. OK. Whatever, here's your achievement.
Intermediate level ★★★☆☆ -- HTML
You don't know when to give up, do you? Do you not fear being knowledgable? Sometime owning a book can be crime, because books are knowledge. Trust me it's better to be ignorant and staying ignorant. Bound to made up rules because you don't know how to read. Like a discord moderator? Or my texan reader...
Sigh, I assume you do are the kind to prefer tables over cows. Maybe you do even read enough books to understand they're not all about nonsense. Fine. Learn.
To understand what's HTML, first look at plain text.
What you see is HTML source code. This what your browser gets and what it uses before showing you text on your screen. This is not the only way to achieve the same result but this is a very convenient one and one that is used by RR.
HTML uses tags. Tags are written like this:
is a tag.
means paragraph. So whatever is after
is interpreted by your browser as good old text. And because everything that has a beginning has an end
means that the paragraph is over. The next line can be interpreted differently.
You can separate new tags on new lines but you don't have to.
That might have just been too much 4th wall breaking for a fiction. Baloney time: "Your reality is based on interpretations. There's your inner mind, your true self, your senses, your chakra, they enter in a bar, your true self asks if what he sees is real, your senses ask the bartender if that's true, the bartender gives them baloneys."
HTML is very robust so you can even write plain text in HTML code and software magic will add the
tags for you. Meaning you can mess up. Meaning some things are also out of your control and some fancy effects you intended might disappear.
Here's the simplest table you can make: 1 table, 1 row, 1 data cell:
If you want to write in a cell, then write between
and
. Usefull, for simple system greetings when encountering freshly isekai'd meat.
If you want to add a cell in the row, then add a
If you want to add a row. Add a
Instead of
Unauthorized reproduction: this story has been taken without approval. Report sightings.
There are no other rules, really. It doesn't even have to look like a table.
HTML code is ugly but it is not that hard once you get a hang of it.
Congrats! You do not really need to know more than this if you just want to reuse tables from others. You can go to the next lesson if there is one. I sure am not teaching you how to isekai someone. But at least now you could give them proper system announcements.
Always remain aware that HTML is an interpreted language, meaning the what you see is not necessarily what others get. RR sets default HTML parameters, that is why tables appear blue and not white or transparent. Change anything at your own risk. If you make all your tables black, there's a chance someone using RR dark mode will not notice whatever effect you wanted to give.
Intermediate level ★★★★☆ -- Tables Tags, All of them*
Still there. Huhuhu~ Someone likes me~ I'm not even a real teacher or anything. Actually, I don't even dislike you but I have to stay in character~
Here the list of tags you can put between the
I shamelessly stole this from by and I have to tell you it's licensed under . I mean I fictionally stole it, it's perfectly legal. Plus you're already accomplice in a first degree truck isekai. Baloney time: "No one died nor will die.".
But don't worry I took it from Mozilla, as in Mozilla Firefox, the open source browser. Easy target because they obviously have the knowledge of how browsers interpret HTML code and also happen to be very willing to freely share that knowledge no strings attached. See, it's nonfictionaly legal.
Feeling lazy here, so here's something I made with as many different tags as I could.
Yes, you didn't learn much. I separated it from the rest as it can get confusing. Some tags apparently have no effect and that's sort of true if you ignore attributes. The idea of , , and
Now, this is the point where you decide if you are content with what you know and decide how far you want to go down the rabbit hole.
Torial level ★★★★★ -- Sexy, Sexy tables
Welcome back~
All the tags above have attributes. Remember the first code? Here's a refresher:
style and border are attributes for table. They give options to alter the way stuff looks. And truth be told there is no way to know everything about them, you have to google it and experiment with it. You will find a number of websites offering documentation, forums where devs ask the same questions as you do, and online HTML table editors to experiment.
Now, as your kind teacher, I will pass the wisdom of generations of real life wizards.
This is also the part where I again give a fair warning: HTML is an interpreted language. Meaning different browsers will interpret HTML differently. This is why tables might be broken on some devices. At some point some attributes may also be depreciated -- no longer used by professional devs, they will be forgotten and might no longer work. One day our dearest admin overlord might also break the table feature and improvise a patch that might not fully work. Keep that in mind before doing something too crazy. Plain text has a longer lifespan.
Speaking of bugs, here is an example. RR has a feature to reveal hidden text. No use trying to type invisible text to fool your foes, there's a feature preventing that. Or is there?
Don't abuse it because it may be patched one day.
Congrats, you've sticked with me to the end. Now it wouldn't be fair if I didn't reward you with a completely over-the-top something? No hugs or anything, I wouldn't want to break you~ (? ???ω??? ?)
The HTML looks brutal, but most of it is just copy-pasted code fragments.
Now go dearest student and make ol' Torial proud~ I will never forget you~
*I will have to edit this chapter to check that the source code actually work as intented. This is to much work on a submission.
*To my anonymous first reader. Yes, Fiction Tutorial. This is on you. All of it. At least now it matches the tags.