Report Blog Entry
welcome to my code collection!! this is a work in progress!! feel free to dm me if youve got anything to add, i wanna make this a really good resource :3
ok so main headings will be black and bold, details/normal text will be normal black, example text will be grey, code will be blue and results from the code will be red.
good luck, hope you find the code you want!! to search for it quickly, press the crtl + f keys on your keyboard and input what youre looking for :3
table of contents
^ instructions
1. typing
2. code
3. resources
1. typing (non-code, for bulletins, blogs, interest section, etc.)
putting text on a new line:
<p>example text</p>
<p>example text 2</p>
putting a break between text:
example text
<br/>
example text 2
making text bold:
<b>example text</b>
results
making text underlined:
<u>example text</u>
results
making text italic:
<i>example text</i>
results
making text into a scrolling marquee:
<marquee>example text</marquee>
highlighting text:
<mark>example text</mark>
results
strikethrough text:
<del>example text</del>
results
blinking text:
<blink>example text</blink>
inserting link:
<a href="link here">display text here</a>
centering text:
<center>example text</center>
results
2. other code (mainly for your profile, some can be used for blogs, bulletins etc.)
changing background color:
<style>
body {
background color: example color !important;
}
</style>
[you can use a color code, eg. #ffffff (white), or just a word, eg. 'white', in the 'example color' section. this applies to all codes.]
changing background image:
<style>
body {
background-image: url("insert link here") !important;
background-color: example color !important;
background-attachment: fixed !important;
margin: 0;
padding: 0;
}
<style>
inserting an image/gif anywhere:
<img src="insert link here"/>
changing your cursor:
[go onto cursors-4u.com, find a cursor you want, find the 'code' section, and copy it into your 'about me' in between two style tags. for example:]
<style>
<style type="text/css">* {cursor: url(https://ani.cursors-4u.net/symbols/sym-8/sym761.ani), url(https://ani.cursors-4u.net/symbols/sym-8/sym761.png), auto !important;}</style><a href="https://www.cursors-4u.com/cursor/2014/03/25/sexy-red-lips.html" target="_blank" title="Sexy Red Lips"><img src="https://cur.cursors-4u.net/cursor.png" border="0" alt="Sexy Red Lips" style="position:absolute; top: 0px; right: 0px;" /></a>
</style>
adding a dropdown menu:
<details><summary style="font-size: 13px;" class="mb8"><u>insert title here</u> </summary><p>
example text
</p></details>
results
results
adding a scrollbox:
<div style="width: 400px; height: 120px; background-color: none ; border-color: #black; border-width: 0px; border-style: dotted; color: #000000; font-size: 11px; overflow: auto;"><p>
example text
</p></div>
results
results
results
results
results
results
results
results
adding another box to your interest section (insert this into your 'heroes' section):
<tr><td>
<p>example title of new section</p>
</td><td>
<p>example content of new section</p>
</td></tr>
remove box from your interest section:
<style>
.table-section:nth-last-child(2) .details-table tr:nth-child(insert number here){display:none;}
</style>
rename box/es in your interest section:
<style>
.table-section:nth-last-child(2) .details-table tr:nth-child(insert number here) td:first-child p:before { content:"new name for the interest section"; font-size:.7rem; }
</style>
[this subsection is related to the previous two code snippets]
which number to replace the 'insert number here' text with (the numbers change which section you want to rename/remove):
1 - general
2 - music
3 - movies
4 - television
5 - books
6 - heroes
change dividers between navigation links:
<style>
nav .links li:not(:last-child)::after, footer .links li:not(:last-child)::after {
content: " symbol here (recommend a space on either side) ";
color: insert color;
}
</style>
changing the link titles in your contact box:
<style>
{font-size:12px}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a:after{content:"text for 'add/remove'"}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:after{content:"text for 'favorite'"}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:after{content:"text for 'sent IM'"}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:after{content:"text for 'forward to friend'"}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:after{content:"text for 'instant messages'"}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:after{content:"text for 'block'"}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:after{content:"text for 'add to group'"}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:after{content:"text for 'report'"}
</style>
changing the title of your contact box:
<style>
.contact .heading{ font-size:0; }
.contact .heading:before{ content: "insert contact box title"; font-size:.8rem; font-weight:bold;
</style>
changing the symbols in your contact box:
<style>
.contact .inner a img {
font-size: 0;
}
.contact .inner a img:before {
font-size: 1em;
display: block
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a:before {
*add to friends*
content: url("insert link")
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
*add to favorites*
content: url("insert link")
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
*send message*
content: url("insert link")
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
*forward to friend*
content: url("insert link")
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
*instant message*
content: url("insert link")
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
*block user*
content: url("insert link")
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
*add to group*
content: url("insert link")
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
*report user*
content: url("insert link")
}
</style>
removing contact box symbols:
<style>
.contact .inner a img {
font-size: 0;
}
.contact .inner a img:before {
font-size: 1em;
display: block
}
</style>
rename 'blurbs' title:
<style>
.blurbs .heading{ font-size:0; }
.blurbs .heading:before{ content: "insert title"; font-size:.8rem; font-weight:bold; color:insert color; }
</style>
rename 'about me' title:
<style>
.blurbs .inner .section:nth-child(1) h4{font-size:0}.blurbs .inner .section:nth-child(1) h4:before{content:"insert title";font-size:.8rem;
</style>
rename 'who id like to meet' title:
<style>
.blurbs .inner .section:nth-child(2) h4{ font-size:0;}.blurbs .inner .section:nth-child(2) h4:before{ content:"insert title"; font-size:.8rem;
</style>
change title above your blogs (on your profile):
<style>
.blog-preview h4{ font-size:0; }
.blog-preview h4 a{font-size:.8rem;margin-left:5px; }
.blog-preview h4:before{ content: "view [your name]'s blogs:"; font-size:.8rem; }
</style>
change title of your friendspace (on your profile):
<style>
.friends .heading{ font-size:0; }
.friends .heading:before{ content: "[your name]'s friends:"; font-size:.8rem; font-weight:bold; }
</style>
change title of your comment section (on your profile):
<style>
.friends#comments .heading{ font-size:0; }
.friends#comments .heading:before{ content: "[your name]'s profile comments:"; font-size:.8rem; font-weight:bold; }
</style>
change title of your interests and link sections (on your profile):
<style>
.profile .table-section .heading h4 { font-size:0; }
.profile .table-section .heading h4:before{ content: "[your name]'s interests + links:"; font-size:.8rem; font-weight:bold;
</style>
change spacehey logo (on your profile):
<style>
.logo{content:url("link to new image here")}
</style>
adding gifs/images to the corner of your profile:
*top right*
<div style="float: ; max-height: 400px; position: fixed; right: 1px; top: 9px; z-index: 200;">
<img src="insert link" width="250" height="250"/></div>
*top left*
<div style="float: ; max-height: 400px; position: fixed; left: 1px; top: 9px; z-index: 200;">
<img src="insert link" width="250" height="250"/></div>
*bottom right*
<div style="float: ; max-height: 400px; position: fixed; left: 1px; bottom: 9px; z-index: 200;">
<img src="insert link" width="250" height="250"/></div>
*bottom left*
<div style="float: ; max-height: 400px; position: fixed; left: 1px; bottom: 9px; z-index: 200;">
<img src="insert link" width="250" height="250"/></div>
adding autoplay music to your page:
<iframe width="0" height="0" src="insert link (only works with youtube as far as i know)" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen="" loading="lazy">
</iframe>
adding falling gifs/images to your page:
<div class="snowflakes">
<div class="snowflake">
<img src="insert image link"/>
</div>
<div class="snowflake">
<img src="insert image link"/>
</div>
<div class="snowflake">
<img src="insert image link"/>
</div>
<div class="snowflake">
<img src="insert image link"/>
</div>
<div class="snowflake">
<img src="insert image link"/>
</div>
<div class="snowflake">
<img src="insert image link"/>
</div>
<div class="snowflake">
<img src="insert image link"/>
</div>
<div class="snowflake">
<img src="insert image link"/>
</div>
<div class="snowflake">
<img src="insert image link"/>
</div>
<div class="snowflake">
<img src="insert image link"/>
</div>
<div class="snowflake">
<img src="insert image link"/>
</div>
<div class="snowflake">
<img src="insert image link"/>
</div>
</div>
<style>
*customizable snowflake styling*
.snowflake {
color: insert color;
font-size: 2em;
font-family: Arial, sans-serif;
text-shadow: 0 0 0px rgba(0,0,0,0.7);
}
@-webkit-keyframes snowflakes-fall{0%{top:-10%}100%{top:100%}}@-webkit-keyframes snowflakes-shake{0%,100%{-webkit-transform:translateX(0);transform:translateX(0)}50%{-webkit-transform:translateX(80px);transform:translateX(80px)}}@keyframes snowflakes-fall{0%{top:-10%}100%{top:100%}}@keyframes snowflakes-shake{0%,100%{transform:translateX(0)}50%{transform:translateX(80px)}}.snowflake{position:fixed;top:-10%;z-index:9999;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:default;-webkit-animation-name:snowflakes-fall,snowflakes-shake;-webkit-animation-duration:10s,3s;-webkit-animation-timing-function:linear,ease-in-out;-webkit-animation-iteration-count:infinite,infinite;-webkit-animation-play-state:running,running;animation-name:snowflakes-fall,snowflakes-shake;animation-duration:10s,3s;animation-timing-function:linear,ease-in-out;animation-iteration-count:infinite,infinite;animation-play-state:running,running}.snowflake:nth-of-type(0){left:1%;-webkit-animation-delay:0s,0s;animation-delay:0s,0s}.snowflake:nth-of-type(1){left:10%;-webkit-animation-delay:1s,1s;animation-delay:1s,1s}.snowflake:nth-of-type(2){left:20%;-webkit-animation-delay:6s,.5s;animation-delay:6s,.5s}.snowflake:nth-of-type(3){left:30%;-webkit-animation-delay:4s,2s;animation-delay:4s,2s}.snowflake:nth-of-type(4){left:40%;-webkit-animation-delay:2s,2s;animation-delay:2s,2s}.snowflake:nth-of-type(5){left:50%;-webkit-animation-delay:8s,3s;animation-delay:8s,3s}.snowflake:nth-of-type(6){left:60%;-webkit-animation-delay:6s,2s;animation-delay:6s,2s}.snowflake:nth-of-type(7){left:70%;-webkit-animation-delay:2.5s,1s;animation-delay:2.5s,1s}.snowflake:nth-of-type(8){left:80%;-webkit-animation-delay:1s,0s;animation-delay:1s,0s}.snowflake:nth-of-type(9){left:90%;-webkit-animation-delay:3s,1.5s;animation-delay:3s,1.5s}.snowflake:nth-of-type(10){left:25%;-webkit-animation-delay:2s,0s;animation-delay:2s,0s}.snowflake:nth-of-type(11){left:65%;-webkit-animation-delay:4s,2.5s;animation-delay:4s,2.5s}
</style>
adding a gif/image overlay:
<style>
html:after{
animation: grain 8s steps(10) infinite;
background-image: url(insert link here);
background-size: 8%;
content: "";
height: 200%;
left: -50%;
opacity: 0.08;
position: fixed;
top: -100%;
width: 200%;
pointer-events:none}
</style>
change base/root colors (for example, the light blue and orange from the default layout):
<style>
:root {
--logo-blue: insert color or type 'transparent';
--darker-blue: insert color or type 'transparent';
--lighter-blue: insert color or type 'transparent';
--even-lighter-blue: insert color or type 'transparent';
--lightest-blue: insert color or type 'transparent';
--dark-orange: insert color or type 'transparent';
--light-orange: insert color or type 'transparent';
--even-lighter-orange: insert color or type 'transparent';
--green: insert color or type 'transparent';
}
</style>
change 'online now' icon:
<style>
.online{content:url("insert link");}
</style>
adding a background to your contact box:
<style>
.contact {
border-radius: 25px;
background: url(insert image/gif link);
background-position: left top;
background-repeat: repeat;
padding: 0px;
width: 250px;
height: 150px;
color: insert color!important;
}
</style>
adding a background to your blurbs:
<style>
.blurbs {
border-radius: 25px;
background: url(insert image/gif link);
background-position: left top;
background-repeat: repeat;
padding: 0px;
width: 250px;
height: 150px;
color: insert color!important;
}
</style>
adding a background to you blog preview:
<style>
.blog-preview {
border-radius: 25px;
background: url(insert image/gif link);
background-position: left top;
background-repeat: repeat;
padding: 0px;
width: 250px;
height: 150px;
color: insert color!important;
}
</style>
adding a background to your interest table:
<style>
.table {
border-radius: 25px;
background: url(insert image/gif link);
background-position: left top;
background-repeat: repeat;
padding: 0px;
width: 250px;
height: 150px;
color: insert color!important;
}
</style>
changing the little icons on your page (verified checkmark, notification bell, etc.):
<style>
}
.url-info{display:none !important;}
.icon, .award img {
content: url(insert link);
display: inline-block;
height: 2.0em;
width: 2.0em;
margin: 0 .05em 0 .1em;
vertical-align: -0.3em;
color: rgba(0,0,0,0);
}
</style>
remove all icons:
<style>
.icon{display:none}
</style>
changing bell notification icon:
<style>
li.active .icon { content:url('insert link'); width: 20PX;height: 20px;}
</style>
changing 'new' icon (on navigation bar):
<style>
.links li:nth-child(12) a .icon {
content: url(insert link) !important;
}
</style>
change pin icon on your pinned blog:
<style>
.blog-preview .pinned .icon{
content: url('insert link');
}
</style>
change icons of your links in your links section:
<style>
*Twitter*
img[src="https://static.spacehey.net/social-icons/twitter.png"] {
content: url("insert link");
}
*Spotify*
img[src="https://static.spacehey.net/social-icons/spotify.png"] {
content: url("insert link");
}
*Website*
img[src="https://static.spacehey.net/social-icons/custom_web.png"] {
content: url("insert link");
}
*Tiktok*
img[src="https://static.spacehey.net/social-icons/custom_tiktok.png"]{
content: url("insert link");
}
*Last.Fm*
img[src="https://static.spacehey.net/social-icons/lastfm.png"]{
content: url("insert link");
}
*Tumblr*
img[src="https://static.spacehey.net/social-icons/tumblr.png"]{
content: url("insert link");
}
*Letterboxd*
img[src="https://static.spacehey.net/social-icons/custom_letterboxd.png"]{
content: url("insert link");
}
*Youtube*
img[src="https://static.spacehey.net/social-icons/youtube.png"]{
content: url("insert link");
}
*Twitch*
img[src="https://static.spacehey.net/social-icons/custom_twitch.png"]{
content: url("insert link");
}
*Facebook*
img[src="https://static.spacehey.net/social-icons/facebook.png"]{
content: url("insert link");
}
*Github*
img[src="https://static.spacehey.net/social-icons/github.png"]{
content: url("insert link");
}
*Reddit*
img[src="https://static.spacehey.net/social-icons/reddit.png"]{
content: url("insert link");
}
*Snapchat*
img[src="https://static.spacehey.net/social-icons/custom_snapchat.png"]{
content: url("insert link");
}
*Dribbble*
img[src="https://static.spacehey.net/social-icons/dribbble.png"]{
content: url("insert link");
}
*Pinterest*
img[src="https://static.spacehey.net/social-icons/pinterest.png"]{
content: url("insert link");
}
*Soundcloud*
img[src="https://static.spacehey.net/social-icons/soundcloud.png"]{
content: url("insert link");
}
*DeviantArt*
img[src="https://static.spacehey.net/social-icons/deviant-art.png"]{
content: url("insert link");
}
*Bechance*
img[src="https://static.spacehey.net/social-icons/behance.png"]{
content: url("insert link");
}
*VSCO*
img[src="https://static.spacehey.net/social-icons/custom_vsco.png"]{
content: url("insert link");
}
*Ello*
img[src="https://static.spacehey.net/social-icons/custom_ello.png"]{
content: url("insert link");
}
*Bereal*
img[src="https://static.spacehey.net/social-icons/custom_bereal.png"]{
content: url("insert link");
}
*Mastodon*
img[src="https://static.spacehey.net/social-icons/custom_mastodon.png"]{
content: url("insert link");
}
*Threads*
img[src="https://static.spacehey.net/social-icons/custom_threads.png"]{
content: url("insert link");
}
*Linktree*
img[src="https://static.spacehey.net/social-icons/custom_linktree.png"]{
content: url("insert link");
}
*Product Hunt*
img[src="https://static.spacehey.net/social-icons/custom_producthunt.png"]{
content: url("insert link");
}
*Telegram*
img[src="https://static.spacehey.net/social-icons/custom_telegram.png"]{
content: url("insert link");
}
*Patreon*
img[src="https://static.spacehey.net/social-icons/custom_patreon.png"]{
content: url("insert link");
}
*Paypal*
img[src="https://static.spacehey.net/social-icons/paypal.png"]{
content: url("insert link");
}
*Buy Me a Coffee*
img[src="https://static.spacehey.net/social-icons/custom_buymeacoffee.png"]{
content: url("insert link");
}
*Kofi*
img[src="https://static.spacehey.net/social-icons/custom_kofi.png"]{
content: url("insert link");
}
</style>
3. resources
masterlists (lots of links to different resources):
resources masterlist !! - zyozi's Blog | SpaceHey
neat websites for blinkies, stamps, gifs, etc!! - ♡ ꒰ঌ C.A CUPID !! ໒꒱ 's Blog | SpaceHey
follow yvesntual (gifs.crd.co)
general graphics:
Glitter Graphics: the community for graphics enthusiasts! (glitter-graphics.com)
Bonnibel's Graphic Collection (neocities.org)
GRAPHICS in DASLAMMER (neocities.org)
COLLECTIONS in DASLAMMER (neocities.org)
JACKISNOTBRIGHT HOARD (neocities.org)
../graphics/my_graphics (neocities.org)
another resource carrd (lifted.crd.co)
resources (2) (bloominglantanas.carrd.co)
graphics collection (xyz.crd.co)
graphics collection (xyz.crd.co)
graphics collection (xyz.crd.co)
follow yvesntual (gifs.crd.co)
mitzi's graphics carrd! (biscuit.crd.co)
mitzi's graphics carrd! (biscuit.crd.co)
buttons:
BUTTONS in DASLAMMER (neocities.org)
../graphics/buttons (neocities.org)
resources (2) (bloominglantanas.carrd.co)
blinkies:
BLINKIES in DASLAMMER (neocities.org)
../graphics/blinkies (neocities.org)
resources (2) (bloominglantanas.carrd.co)
mitzi's graphics carrd! (biscuit.crd.co)
dividers:
(Posts tagged pride dividers) (tumblr.com)
(Posts tagged master list) (tumblr.com)
another resource carrd (lifted.crd.co)
resources (2) (bloominglantanas.carrd.co)
follow yvesntual (gifs.crd.co)
mitzi's graphics carrd! (biscuit.crd.co)
stamps:
i put a pixel of a cat on my website and i am now at least 90% cooler (neocities.org)
../graphics/stamps (neocities.org)
resources (2) (bloominglantanas.carrd.co)
favicons:
resources (2) (bloominglantanas.carrd.co)
graphics collection (xyz.crd.co)
follow yvesntual (gifs.crd.co)
Comments
Displaying 14 of 14 comments ( View all | Add Comment )
𝙙✩𝙣𝙣𝙮
thank you for your kudos everyone i love feeling useful!!! :3
Aurèle
THANK YOU SO MUCH !!!
pyroclast-sh
i cannot exaggerate how useful this was, thank you ever so much. cheers 🍻
flurtz jr
im havinf troubles trying to change the color of where your stuff goes on like where your name is on the profile
im not sure what u mean, dm me if u like, ill send u some code or edit what u got!!
by 𝙙✩𝙣𝙣𝙮; ; Report
i mean by like an example the border where your interest n about is on if ykwim
by flurtz jr; ; Report
Alr,, I'll try n get u some code for that!!
by 𝙙✩𝙣𝙣𝙮; ; Report
xXd0ntGetAfr4id_.Yuki1Xx
TYSMM! GREAT AND HELPFULLZ BLOGGIZ!!! XD
thoogxd
is there a way to use the hex code colors for inserting the colors in the root?
電子戦
really nice list. we are using this in our myspace-like's help documentation with full credit ofc
mav
absolute life saver! I know absolutely nothing (or at least very *very* little) about coding and I was able to use and understand this! thank you!!
glad you found this useful!! if u need any more code, lmk :33
by 𝙙✩𝙣𝙣𝙮; ; Report
‧˚꒰SOPHIE꒱༘⋆
In the "Rename your interests title", it doesn't rename it, it just puts the text in front of the original title. (ExampleHeros)
okay ill try to fix that!! thanks for letting me know
by 𝙙✩𝙣𝙣𝙮; ; Report
im sorry but it seems like theres a spacehey-wide code problem right now with this, ill see if it gets fixed at some point!!
by 𝙙✩𝙣𝙣𝙮; ; Report
Oh, okay! Thank you! :}
by ‧˚꒰SOPHIE꒱༘⋆; ; Report
Goya ₍ᐢ..ᐢ₎
ty for this! it's super helpful! :DD
just XD now!!
THE JOSH VID HELP
clover
omg thanks!!!! this is so usefull :D
Mystii
i was told to give kudos to this but its honestly really cool omg
it looks like it took sm time for this whole thing bye
omg that's so cooool thanks :-D