HTML For Formatting Badge Blogs

+23
Many people have been creating badge blogs like these recently. Copy the HTML code down below and edit the hyperlinks & text to make your own badge blog!

<style>

table, th, td {

  border: 1px grey;

}

</style>


<h1 style="text-align:center;">

<b>Badge Name</b>

</h1>


<p style="text-align:center;">

1 user has earned this badge

</p>


<table class="standard-table" align="center">


<tr>

<th>Quiz</th>

<th>Required Score</th>

</tr>


<tr>

<td>

<a href="First Hyperlink">Name of First Quiz</a>

</td>

<td>Score Required</td>

</tr>


<tr>

<td>

<a href="Second Hyperlink">Name of Second Quiz</a>

</td>

<td>Score Required</td>

</tr>


<tr>

<td>

<a href="Third Hyperlink">Name of Third Quiz</a>

</td>

<td>Score Required</td>

</tr>


<tr>

<td>

<a href="Fourth Hyperlink">Name of Fourth Quiz</a>

</td>

<td>Score Required</td>

</tr>


<tr>

<td>

<a href="Fifth Hyperlink">Name of Fifth Quiz</a>

</td>

<td>Score Required</td>

</tr>


</table>

As you can see, you can copy and paste each “set” of code to add more rows to the badge’s table. The outcome should look something like this:

Badge Name

1 user has earned this badge

Quiz Required Score
Name of First Quiz Score Required
Name of Second Quiz Score Required
Name of Third Quiz Score Required
Name of Fourth Quiz Score Required
Name of Fifth Quiz Score Required
Thank you for reading my blog. I hope you found it useful.

-Pandora

Back to Top
36 Comments
+2
Level 65
Oct 3, 2021
Updated - Fixed an error in the code which caused the table to add an unnecessary row at the bottom.
+2
Level 70
Aug 26, 2020
Or, you could open the source code and copy the code from there. That’s what I did, hehehe...
+2
Level 65
Aug 26, 2020
Lol
+6
Level 14
Aug 26, 2020

Vatican City Badge

1 user has earned this badge

QuizRequired Score
Vatican City Country Quiz 17/18
Countries Closest to Vatican City with a Radial Map 27/27
Vatican City Map Quiz 12/14
Vatican Multiple Choice 15/15
+2
Level 65
Feb 12, 2021
Nice looking thing ya got there
+3
Level 15
Aug 26, 2020
Nice blog!
+2
Level 65
Aug 26, 2020
Thanks!
+2
Level 51
Nov 30, 2020
Hmm...the checkbox doesn't seem to work.
+2
Level 65
Nov 30, 2020
why?
+2
Level 51
Nov 30, 2020
Dunno...I type it, but saving my blog deletes it. Is it same with you?
+3
Level 43
Dec 4, 2020
DON'T REMOVE THIS!
+5
Level 73
Mar 3, 2021
He won't I think
+2
Level 65
Feb 12, 2021
Thank you Pandora!
+2
Level 73
Mar 2, 2021
How do you make invisible text?
+2
Level 65
Mar 2, 2021
...and why would you need that?
+2
Level 73
Mar 3, 2021
Just because I want to know :)
+2
Level 65
Mar 30, 2021
change font size to white
+2
Level 55
Apr 5, 2021
color:white;
+7
Level 39
Jul 12, 2021
Yes, white is my favorite font size lol
+2
Level 65
May 9, 2022
color* lol
+1
Level 68
Sep 8, 2021
@SirPhilippines invisible text so you reach threshold for minimum characters without having to write 'something more substantial'??
+2
Level 55
Mar 2, 2021
Aww... why can't the input type date work here?
+2
Level 65
Mar 2, 2021
Wdym
+2
Level 55
Mar 2, 2021
< input type="date"> that's the best way I can explain it...
+2
Level 55
Mar 2, 2021
Here
+2
Level 92
Mar 28, 2021
I promise this is not Rickroll lol! Hopefully that link works... Good blog btw!
+2
Level 65
Apr 26, 2021
What about how to add VIDEOS?
+4
Level 65
Apr 26, 2021
Can't do that anymore
+2
Level 55
Apr 29, 2021
what happened to part 3? I have searched all over but I can't find it
+2
Level 65
May 9, 2022
deleted it
+2
Level 75
Aug 2, 2021
First of all: huge thanks for the work you did with those blog entries! That helped me a lot when creating my unofficial badges :)

Btw I would like to make the classic thin gray border of the table invisible. Is there a way to do so?

+2
Level 65
Oct 3, 2021
Everything is fixed now!
+2
Level 55
Nov 14, 2021
the rickrolling in blurb was cool
+1
Level 61
Apr 26, 2025
Might do this with my presidential trivia
+1
Level 52
Jul 17, 2025
I've also done a table tutorial! I hope you like it
+2
Level 65
Jul 17, 2025
cool! your blog is way better lol :3