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 20 of 25 comments ( View all | Add Comment )
.:absntGen★81:.
thank you for your kudos everyone i love feeling useful!!! :3
dave
ur an angel for this bro
cωunch ♡
absolute life saver <33
🍮🎀lucian🍓💌
how do you get the gifs in the corner to follow the screen (like when you scroll? for me it just appears in one spot that isnt even at the top for me :(
(i use mobile if that helps)
🐰🥩 Jay
Quick question, how do I change the text for the mood box? I tried this code, but it still shows both the 'Mood:' and custom text I've made on my profile xD"
.mood { font-size:0px; }
.mood:before{ content: "📖 Currently Reading: "; font-size: 12px; font-weight:bold; }
you might have some more code hidden in there thats contradictin ur custom one,, press ctrl f, search 'mood' and delete any code u dont want!!
by .:absntGen★81:.; ; Report
The only code that has the word 'mood' in it is my own code, nothing else ^^; maybe there's a parameter I'm missing? (I know some of the text to be switched needs to be specified as h4 and such)
by 🐰🥩 Jay; ; Report
try this:
.mood p:first-child b {
color: transparent !important;
text-shadow: none !important;
letter-spacing: -100px;
}
.mood p:first-child b::after {
color: #000 !important;
letter-spacing: normal !important;
content: "Currently Reading 📖:";
}
by .:absntGen★81:.; ; Report
Yes this is perfect, thank you so much!! :D
by 🐰🥩 Jay; ; Report
🎂 nori 🎂
hiii i wanted to ask if u have a code that makes the text and images on the middle..? i mean, the about me and who id like to meet. SORRY IM SO BAD AT EXPLAINING
sure!! try
.blurbs .heading {
text-align: center;
}
in between style tags!! lmk if it dont work
by .:absntGen★81:.; ; Report
its not working but its prob because im just not doing it right! ty 4 the fast reply tho
by 🎂 nori 🎂; ; Report
꩜shrimpy꩜
this is the holy grail🙏 thank youuu
🩸pierce,,
thanks for this it really did help!!!!!!!!!!!!!
ROBYBOW
THANKS SM!!!! this helped me out so much. youre awesome<3
Hats 9999
Oh my goodness, I am super happy that I’ve discovered your profile now, THANK YOU SO MUCH
glad to b of service hats 9999
️
by .:absntGen★81:.; ; Report
CREATURA
I absolutely love this
Kali
I'm having problems with the autoplay, whenever I save it on my profile the youtube link goes away. Do you know why that might be happening??
TEST ACC TO MAKE LAYOUTS
Is it ok to copy/paste bits of code? Just don’t wanna plagiarise
copy+paste the whole thing if ya want man,, dw bout it
by .:absntGen★81:.; ; Report
Aurèle
THANK YOU SO MUCH !!!
pyroclastTech
i cannot exaggerate how useful this was, thank you ever so much. cheers 🍻
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 .:absntGen★81:.; ; 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 .:absntGen★81:.; ; 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 .:absntGen★81:.; ; Report
Oh, okay! Thank you! :}
by ★ ⋮ sophie ⸝⸝; ; Report