
This is the master-post of all HTML codes that can be used to customize your sniff.
Please keep in mind when you're customizing your sniff that it adheres to Wolfhome's rules. Although we love creativity and individualism, we ask that you also be respectful of others and keep your sniffs within regulations. If you have any questions or concerns as to what you can and can't include into your sniff, please feel free to message an administrator or click the link below.
Wolfhome FAQ & Rules
The Basics:Topic Key:
Codes require you to put in certain numbers, names, and other things. Just replace these symbols with what you would like in the code.
# ➙ Insert desired number and color
!!!!! ➙ Insert desired font
*** ➙Insert desired words
Code: Select all
<b>BOLD</b>
Code: Select all
<u>UNDERLINE</b>
Code: Select all
<em>EMPHASIZE</em>
Code: Select all
<i>ITALICS</i>
Code: Select all
<center>CENTER</center>
Code: Select all
<p align="right">RIGHT</p>
Code: Select all
<p>new paragraph</p>
From order top to bottom; font size, font face, font color
Code: Select all
<font size="#">**********</font>
Code: Select all
<font face="!!!!!!">*******</font>
Code: Select all
<font color="##">*******</font>
From order top to bottom; clickable link, inserting image, image as link, background image, background image covers whole sniff (no idle), background image covers whole sniff (shows idle)
Code: Select all
<a href="linkhere">***********</a>
Code: Select all
<img src="link here">
Code: Select all
<a href="linkhere"><img src="linkhere"></a>
Code: Select all
<body background="linkhere">
Code above given courtesy of ScrimshawCode: Select all
<body text="#000000" bgcolor="#8285a3" onload="window.resizeTo(760,650); var trs=document.getElementsByTagName('tr'); for (var i=0; i<trs.length; i++) { var current = trs[i]; content=current.firstElementChild.innerHTML; if (content!=='Idle Time:') { current.style.display='none'; } else { spoiler=document.getElementById('spoilerMain'); spoiler.insertBefore(current, spoiler.firstChild); } }"> <body style="background-image:url(LINK HERE); background-attachment:fixed; background-size:cover; background-position:fit; text-align:center; visibility:hidden; overflow-y:auto;">
Code above given courtesy of ScrimshawCode: Select all
<body text="#000000" bgcolor="#8285a3" onload="window.resizeTo(760,650); var trs=document.getElementsByTagName('tr'); for (var i=0; i<trs.length; i++) { var current = trs[i]; content=current.firstElementChild.innerHTML; if (content!=='Idle Time:') { current.style.display='none'; } else { spoiler=document.getElementById('spoilerMain'); spoiler.insertBefore(current, spoiler.firstChild); } }"> <body style="background-image:url(LINK HERE); background-attachment:fixed; background-size:cover; background-position:fit; text-align:center; visibility:hidden; overflow-y:auto;"> <font color="#FFFFFF"><div id="spoilerMain" style="display:show; padding:1rem; font-family: Times New Roman; margin: 1rem 0; line-height: 1.5em; font-color:#ffffff; font-size: 16px; background:rgba(200,200,250,0);"></div></font>
From order top to bottom; fixed window size, image column, button, activated button, transparent box, scroll box, carrd code
- Code above given courtesy of Scrimshaw. Text and color doesn't work, just change the number values in the parenthesis to adjust width and height.
Code: Select all
<body text="#000000" bgcolor="#8285a3" onload="window.resizeTo(1000,900);">
Code above given courtesy of Scrimshaw. To align to the right, substitute the float from left to right. To make a text parallel to an image, it is suggested to use a long image otherwise the text will appear underneath it.Code: Select all
<p style="width: 900px;"> <img src="image link here" style="float: left;" /> body paragraph words </p>
Code above given courtesy of NVentousCode: Select all
<button>Button text</button>
Code above given courtesy of NVentous. Note that you need to use Javascript to use this code.Code: Select all
<button onClick="alert('hi');">say hello</button>
Code: Select all
<div style="background-color: rgba(114, 112, 124, .5); border-radius: 10px; padding: 30px; width: 80%; margin-bottom: 40px;"> <span style="opacity: 3; -khtml-opacity: 1; -moz-opacity: 1; filter: alpha(opacity=90);">******************</div>
Code above given courtesy of NVentous. Adjust how wide the line is by changing 1px to 3px, 5px, etc. accordingly.Code: Select all
<div style="width: 50%; margin: 0 auto; overflow: auto; background: transparent; border: 1px solid #000; padding: 2rem;">************</div>
Code: Select all
<meta http-equiv="refresh" content="0; url=CARRD URL" />
To add music or a video to your sniff, you must visit this link here. Copy your desired music or video into the link tab and adjust the settings as you please. If you want an invisible video, do not adjust the settings on the website. Generate the code and adjust the width and height to "0". For example, it should look like this:
Code: Select all
<div class="gaf210imvustylez_youtubebox" style="width:1px;height:1px;overflow:hidden"><iframe allow="autoplay" width="0" height="0" src="https://www.youtube.com/embed/VeHddLI-aY8?autoplay=1&loop=0" frameborder="0" allowfullscreen></iframe><!--Youtube player code generated @ http://gaf210.imvustylez.net --></div>
- 1. Carrd
2. HTML Color Codes
3. More HTML Codes