RESOURCE Templates by Ardent

Status
Not open for further replies.
Ardent

Ardent

your blood on my teeth
Original poster
FOLKLORE MEMBER
Invitation Status
  1. Not accepting invites at this time
Posting Speed
  1. Multiple posts per week
  2. 1-3 posts per week
  3. One post per week
  4. Slow As Molasses
Online Availability
12NN-4PM, 7PM~
Writing Levels
  1. Intermediate
  2. Adept
  3. Advanced
  4. Adaptable
Preferred Character Gender
  1. No Preferences
Genres
Horror, Dark Fantasy, Modern
Free Templates

You are free to tweak/use the templates below. All I ask is that you don't remove the link that says "Templates by Ardent", so that those who see my code out in the wild know where to find this free resource, should they also want to take advantage of it.

To view the code, simply give that particular post a rating. It makes me happy to know people like / use my codes!

All my codes are mobile-friendly / responsive, at least to my knowledge. If you encounter one that's acting strangely on your device, please let me know.

Want to learn how to code? Click on this link to see my coding guide.
 
Last edited:
  • Love
  • Bucket of Rainbows
  • Like
Reactions: deadhood, kroyote, Absyinthe_Artica and 1 other person
Reserved for Navigation
 
Comic Book Style

Font 1
Font 2
#5C5C5C

#AF1C24

#F69603

#064760

#E4E6D8
1 2 3 4
  • NAME NAME
    basics
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas egestas vehicula leo, et mattis mauris scelerisque et. Maecenas aliquet magna vitae est mattis, blandit faucibus dui mollis. Aliquam pulvinar maximus sagittis. Aenean vitae ultrices lorem, quis semper dolor. Sed ultrices tincidunt augue a laoreet. Donec in nulla eros. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Phasellus sit amet lectus orci. Morbi dignissim, purus quis tempus ultrices, nibh lorem tincidunt ligula, eu aliquam orci nulla ut lorem.

    Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Phasellus at tristique orci, nec bibendum est. Curabitur hendrerit nisl neque, id semper tortor commodo at. Etiam id nisi quis odio varius sollicitudin in in velit. Morbi luctus, tortor et ornare auctor, massa dolor elementum felis, quis mattis orci eros eget mauris. Aliquam vitae mi pharetra, ultricies risus sit amet, consequat justo. Etiam non turpis at mauris sagittis ornare. Proin vehicula mattis sem, a aliquet augue sodales sed. Pellentesque nec rhoncus ligula. Nunc mattis, magna vel blandit ultricies, libero leo fermentum nulla, non laoreet nisl velit porta nunc.

    Mauris finibus a arcu vel imperdiet. Sed egestas turpis ipsum, vel malesuada nisl luctus in. Quisque quis erat viverra, egestas neque a, pulvinar felis. Interdum et malesuada fames ac ante ipsum primis in faucibus. Proin vehicula vehicula mi ac feugiat. Donec dignissim eu libero a vulputate. Nullam sit amet ultrices tortor. Fusce fermentum risus vitae tortor pulvinar, a cursus nisi finibus. Vivamus dapibus, leo quis laoreet aliquam, libero lorem rutrum justo, quis venenatis nulla neque ac nulla. Donec quis semper ipsum. Etiam in diam lobortis, sagittis enim et, molestie dolor. Integer aliquam magna et eleifend accumsan. Morbi orci justo, cursus at lacus ac, vulputate fringilla metus. Ut pharetra egestas justo rutrum pellentesque. Interdum et malesuada fames ac ante ipsum primis in faucibus.

    Duis nec ligula ac erat fringilla sodales sed ac elit. In nulla sem, venenatis et elementum ac, dignissim nec odio. Sed faucibus non tortor sed commodo. Sed vitae turpis euismod erat laoreet rutrum. Pellentesque vehicula, nulla at lobortis dignissim, nulla magna scelerisque massa, eu convallis quam ex accumsan lacus. Sed urna leo, accumsan non ex eu, placerat rutrum ante. Praesent leo mi, fermentum ac condimentum eu, malesuada vitae nisi. Sed elementum porta nunc, non efficitur erat efficitur a. Nulla sed sapien enim. In hac habitasse platea dictumst.

    Fusce vulputate, felis eu vehicula maximus, dolor arcu tincidunt quam, et imperdiet magna ex lacinia ex. Sed iaculis nisi convallis tempus iaculis. Suspendisse ut nunc justo. Aliquam vehicula viverra cursus. Donec tincidunt eu nisl eget dictum. Nam lobortis tempus elit, sed vehicula nisi viverra ut. Ut sed dui libero. Donec vitae aliquet purus. Pellentesque suscipit arcu eu dui lobortis facilisis. Suspendisse at erat mi.
  • NAME NAME
    persona
    Personality
  • NAME NAME
    Biography
  • NAME NAME
    Miscellaneous


CODE:​
Hidden content
You need to react to this post in order to see this content.
 
Last edited:
  • Like
  • Love
  • Bucket of Rainbows
Reactions: MissyMay, Vacyr, gumiho. and 10 others
Dead or Alive

#592c15

#ae804f

#e1d6c1

#000000


FONT 1
FONT 2
FONT 3
BOUNTY HUNTERS ATTENTION
WANTED
☞ DEAD OR ALIVE ☜

"NAME NAME"
★ CASH REWARD ★
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin feugiat diam vitae ligula lobortis pellentesque. Sed diam dui, semper ut ultricies nec, semper et est. Nunc id leo vel est efficitur accumsan et vel nunc. In efficitur eros nec tincidunt fermentum. Etiam imperdiet pretium nisi, ac condimentum massa aliquam nec. Curabitur vel dui id nulla vestibulum pharetra. Vivamus vitae cursus sapien. Suspendisse non arcu malesuada nisi hendrerit consequat nec in metus. Nulla iaculis tortor non enim ultricies, sed mattis nisl eleifend. In et dictum lectus, at sodales erat. Nullam id leo at justo malesuada malesuada. Aenean dictum at nunc sed accumsan. Integer et malesuada sapien.

Vivamus ligula eros, sodales eu placerat non, rutrum ac neque. Praesent facilisis at quam in pulvinar. Nam efficitur, ipsum a pharetra blandit, libero turpis venenatis orci, sed bibendum diam dui ac massa. Nullam sit amet mauris sed leo suscipit finibus nec nec lacus. Pellentesque venenatis quam non condimentum luctus. Nulla facilisi. Sed varius nisi est, non semper libero tristique ut. Donec viverra elementum augue, non mollis augue consectetur a. Maecenas facilisis vitae neque sit amet placerat. Donec at tellus fringilla magna vestibulum vestibulum quis vel odio. Fusce at elit et sapien congue pretium. Nam consequat, quam ac euismod suscipit, ex lacus eleifend quam, eget mollis neque sapien nec eros. Cras ornare imperdiet est a sollicitudin. Donec elit justo, aliquet a justo ut, blandit posuere nunc. Integer rhoncus, neque malesuada volutpat suscipit, tortor eros luctus eros, at bibendum risus tortor vel orci. Proin posuere eros eu eleifend ultrices.

Sed et eleifend lectus, non tempor odio. Integer odio nibh, blandit sit amet consequat sit amet, venenatis vitae est. In ac erat ornare, mollis dolor a, consectetur massa. Sed hendrerit, nisl ut ultricies lacinia, enim sem tempus felis, venenatis fermentum metus nibh et est. In hac habitasse platea dictumst. Cras efficitur nibh vel turpis volutpat mattis. Aliquam eu lacus nec sapien lobortis lobortis quis a ligula. Praesent commodo nisi quis dolor porta efficitur. Pellentesque porttitor venenatis neque, quis consequat sem auctor fringilla. Sed purus lectus, imperdiet in risus nec, semper feugiat eros. Nam dignissim pharetra commodo. Vestibulum elementum tristique ipsum convallis fringilla. Sed sapien nisl, pellentesque sit amet sodales ut, suscipit id orci. Phasellus semper, tortor at euismod pellentesque, odio risus gravida dolor, id mollis velit dolor vitae enim. Quisque nec dolor leo.


CODE:​
Hidden content
You need to react to this post in order to see this content.
 
Last edited:
  • Nice Execution!
  • Like
  • Love
Reactions: captain, monkeydoll5 and Ghostly Boo
Ravenclaw


#633418

#896b2b

#194069

#FFFFFF

FONT1FONT2FONT3
STUDENT RECORD
Slide 1 2 3




  • FIRSTNAME LNAME
    basics
    bio
    misc.


    ➨House & Position
    (i.e. Gryffindor - Head of House/Deputy Headmistress)

    ➨Species
    Half-blood/Half-breed (Specify)/Muggleborn/Pureblood

    ➨Birthday & Age
    Include the year. The role-play's starting point is September 2020.

    ➨Height
    ➨Wand

    ➨Boggart

    ➨Patronus
    Omit if none.

    ➨Pet
    Omit if none.

    ➨Subjects
    See spreadsheet. Omit if not teaching.

    ➨Other Specialties
    See spreadsheet. Omit if not applicable.

    ➨Organisations
    See spreadsheet. Omit if none.




  • FIRSTNAME LNAME
    basics
    bio
    misc.
    ---
    ---
    ---
    Write about your character's personality and history. 1 paragraph minimum.
    ---




  • FIRSTNAME LNAME
    basics
    bio
    misc.
    ---
    ---
    ---
    Here goes any extra important information that your fellow role-players should know about your character.
    ---
Coded by Ardent


CODE:​
Hidden content
You need to react to this post in order to see this content.
 
Last edited:
  • Like
  • Nice Execution!
  • Thank You
Reactions: Queen Tink, monkeydoll5, waddledeedledee and 1 other person
Simple Accordions

#101419

#7F5A83

#8c6e92

#A188A6

#9DA2AB

Hello world.
section 1
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla pellentesque tellus ut purus consequat, a feugiat arcu bibendum. Donec quis convallis orci, sit amet consequat sapien. Praesent hendrerit purus nibh, quis fermentum nisi feugiat fringilla. Curabitur non nisl dignissim enim blandit molestie. Aenean tristique purus quis diam viverra luctus. Donec malesuada tortor sed tempor pulvinar. Ut blandit urna enim, vitae commodo mauris hendrerit sit amet. Proin ipsum nisi, feugiat sed sagittis vitae, varius eu lacus. Proin vel nisi consectetur, vehicula nunc maximus, suscipit erat. Morbi tincidunt ornare lorem, ac maximus odio sollicitudin vel. Morbi lectus tortor, rutrum sit amet nisl blandit, venenatis mollis enim.

Praesent sollicitudin euismod nulla, id egestas est finibus quis. Quisque sed lorem tincidunt, aliquam tortor bibendum, laoreet odio. Ut mi sapien, condimentum eget dictum id, tristique tempor diam. Nunc rutrum nibh id magna condimentum faucibus non sed est. Aenean non tincidunt sapien. Sed eu porttitor erat. Ut tincidunt odio non dolor pharetra convallis. Proin euismod vel ante ac ullamcorper. Vestibulum vel venenatis enim. Ut finibus feugiat enim, porttitor semper sapien egestas et. Vestibulum viverra imperdiet dui, id porttitor dui luctus eget. Aliquam sit amet euismod erat. Quisque arcu ante, accumsan at congue quis, euismod quis erat. Aenean rhoncus, nisi ac maximus posuere, metus orci egestas quam, et egestas nisl tortor vel nulla. Aliquam auctor vitae est quis dignissim. In nec est massa.
section 2
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla pellentesque tellus ut purus consequat, a feugiat arcu bibendum. Donec quis convallis orci, sit amet consequat sapien. Praesent hendrerit purus nibh, quis fermentum nisi feugiat fringilla. Curabitur non nisl dignissim enim blandit molestie. Aenean tristique purus quis diam viverra luctus. Donec malesuada tortor sed tempor pulvinar. Ut blandit urna enim, vitae commodo mauris hendrerit sit amet. Proin ipsum nisi, feugiat sed sagittis vitae, varius eu lacus. Proin vel nisi consectetur, vehicula nunc maximus, suscipit erat. Morbi tincidunt ornare lorem, ac maximus odio sollicitudin vel. Morbi lectus tortor, rutrum sit amet nisl blandit, venenatis mollis enim.
section 3
Just copy paste these slides if you want more sections.



CODE:​
Hidden content
You need to react to this post in order to see this content.
 
Last edited:
  • Like
  • Nice Execution!
  • Love
Reactions: QuietSuburbs, tapedeck, Bahiyya and 9 others
Old Gold

#0e0e0e

#5e533e

#fff


FONT 1
Lorem Ipsum
⬤ ⭘
Interactions
@username @username
location
everywhere
⭘ ⬤
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut vel facilisis arcu. Proin interdum velit et justo facilisis, quis rutrum urna porta. Duis vitae nisl in sapien gravida dapibus. Etiam odio eros, lobortis at rhoncus ac, scelerisque vitae ante. Integer lobortis consectetur nulla eu commodo. Nullam imperdiet dui sapien, sed varius mi placerat vel. Cras id purus aliquam, sagittis leo sed, tempor felis. Quisque sapien dolor, rhoncus ut elit id, semper dignissim arcu. Integer ut efficitur metus, vitae gravida leo. Aenean vehicula varius tellus eu laoreet. In aliquam luctus quam vitae consectetur. Pellentesque vel accumsan enim, a facilisis nisi.

Praesent iaculis bibendum quam vel scelerisque. Vivamus commodo placerat arcu vel sollicitudin. Phasellus venenatis metus nisi, nec semper mauris pharetra consectetur. Etiam quis mi varius, volutpat nulla at, molestie diam. Sed mauris turpis, lacinia et justo sed, placerat efficitur ipsum. Nullam tempus purus ac laoreet commodo. Ut tempus neque at finibus aliquet.


CODE:​
Hidden content
You need to react to this post in order to see this content.
 
Last edited:
  • Like
  • Love
  • Nice Execution!
Reactions: Sabatron, tapedeck, captain and 6 others
Sticky Note



FONT 1
// CONTENT HERE
  • Item 1
  • Item 2
  • Item 3


CODE:​
Hidden content
You need to react to this post in order to see this content.
 
Last edited:
  • Love
  • Like
Reactions: Absyinthe_Artica and Ghostly Boo
Sunflower Field
| FEATURES | Mobile-friendly, dynamic layout depending on screen size, customizable scrollbar

#676a6d

#f4ddd6

#e7a782


lorem
ipsum
Overview
Name:
Nickname:
Age:
Birthday:
Face Claim:

Personality
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque rhoncus, augue ac interdum tincidunt, quam mi fermentum eros, eget consequat ex nulla in nibh. Aliquam blandit, lorem ac commodo sollicitudin, dolor erat pellentesque sem, quis laoreet risus augue eu elit. Nunc eu fermentum nulla, sit amet blandit ex. Integer vitae orci sit amet ante pellentesque fringilla. Maecenas nibh erat, vulputate in faucibus at, fringilla in nibh. Sed et mauris tincidunt risus vestibulum bibendum. Cras risus nisl, interdum at ex et, tempor condimentum lectus. Maecenas eget massa sodales ex accumsan maximus. Sed lobortis quam ac metus feugiat porta. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam sit amet tristique felis, eget congue sem. Vivamus nec molestie purus. In sed ornare quam. Sed ultrices tincidunt tincidunt.

Biography
Donec justo libero, pellentesque in mollis id, lacinia nec eros. Sed mattis ornare nisl, ac porta tellus pretium a. Quisque fringilla quis mauris varius ornare. Sed sed enim varius, fermentum velit accumsan, efficitur magna. Suspendisse aliquam dictum maximus. In porta convallis tortor, ut molestie augue gravida eget. Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Proin eget justo nunc. Donec sollicitudin dui elit, sed pretium lectus tristique nec. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nullam et purus non elit volutpat tristique. Aliquam sollicitudin interdum odio at tempor. Nullam sit amet aliquam velit. Integer congue sagittis placerat. Proin ac aliquet ante, id lacinia quam.

Cras et ultrices eros. Fusce aliquet molestie ligula, placerat mollis eros condimentum in. Ut a ex non mi iaculis sagittis. Aliquam tortor metus, commodo et efficitur non, pretium eu metus. Sed et tellus sed lacus luctus semper. Nam nec faucibus libero, sit amet egestas magna. Sed porta quis ligula eget vehicula.


CODE:​
Hidden content
You need to react to this post in order to see this content.
 
Last edited:
  • Like
  • Love
  • Thank You
Reactions: Onslaught, wolf., t o a s t and 13 others
Fragmented

#1b1b1b

#de1446

#cccccc


| FEATURES | Fully functional music player(*), ease of editing with variables(**), animations(***)

* Music player: Go to the YouTube link of the song you want to use. Copy the characters after watch?v=. Paste between the tags [MEDIA=youtube]PASTE HERE[/MEDIA] that can be found in the code. Learn more about music players here.

** Variables: All variables are located in the first parent div. Simply swap out the values (image, color, font, etc.) for the ones you want. This is the easiest, most convenient way to edit this code to your preferences. There's no need to edit the rest of the code, unless you want to change something that wasn't specified in the variables section. Learn more about variables.

*** Animations: Animations will only play once, immediately after the page loads.



FONT 1
FONT 2
Lorem Ipsum Dolor
Lorem Ipsum Dolor
word
SONGNAME // ARTISTNAME


CODE:​
Hidden content
You need to react to this post in order to see this content.
 
Last edited:
  • Like
  • Love
  • Nice Execution!
Reactions: Sabatron, Ghostly Boo, tapedeck and 15 others
Simple Tabs

#1b1b1b

#4B1302

#cccccc


"Simple" and responsive tab layout with nine slides (the maximum number of linked tabs allowed). Some notes:

[1] Variables: All variables are located in the /* ROOT */. Simply swap out the values (image, color, font, etc.) for the ones you want. This is the easiest, most convenient way to edit this code to your preferences. There's no need to edit the rest of the code, unless you want to change something that wasn't specified in the variables section. Learn more about variables.

[2] Nav Links: Each navigation link will have to be edited directly, especially if you're swapping out the link colors or changing the names. This can be very tedious, but it is not something I could simplify. I suggest doing it for one slide first, then copy paste for every iteration.

[3] Removing a Slide: To remove a slide: first, remove all links to that slide. Then remove the slides themselves, starting from the latest {slide=9}{/slide} then work your way up as needed. For more information about tabs, see my resource: Learn more about tabs.

[4] Editing Fonts: If using Google Fonts, declare them in the first [div][/div] tag first. It's marked with the comment "LOADING FONTS"


Font 1
Font 2
1 2 3 4 5 6 7 8 9


CODE:​
Hidden content
You need to react to this post in order to see this content.
 
Last edited:
  • Like
  • Love
  • Nice Execution!
Reactions: rissa, QuietSuburbs, Ghostly Boo and 1 other person
LARGER MUSIC PLAYER


[1] Change the Song: Go to the YouTube link of the song you want to use. Copy the characters after watch?v=. Paste between the tags [MEDIA=youtube]PASTE HERE[/MEDIA] that can be found in the code. Learn more about music players here. A smaller, simpler version of the music player can also be found there.

[2] Variables: All variables are located in the /* ROOT */. Simply swap out the values (image, color, font, etc.) for the ones you want. This is the easiest, most convenient way to edit this code to your preferences. There's no need to edit the rest of the code, unless you want to change something that wasn't specified in the variables section. Learn more about variables.

[3] Editing Fonts: If using Google Fonts, declare them in the first [div][/div] tag first. It's marked with the comment "DECLARE GOOGLE FONTS"

No visible attribution required.



FONT 1
Elegia
New Order


CODE:​
Hidden content
You need to react to this post in order to see this content.
 
Last edited:
  • Like
Reactions: Ghostly Boo
Status
Not open for further replies.
Top Bottom
Back