---RESOURCES FOR LAYOUTS!!!---


This is just a messy dump of shit i use to make layouts- add shit yk? If ur looking for websites, resources, random bits of useful code- then uhh, here it is! yay!

ps copy and paste the gifts into your browser to visit the sites...duh


Websites for graphics-

https://pixelsafari.neocities.org/   -huge website full of dividers, blinkies, pixels, stamps etc- I use this all the time, stuff for every aesthetic

https://rentry.co/samuelsresources  -like pixels safari, not as much in other departments, but a shiiiiit ton of pixels

https://blinkies.cafe/ -to make custom blinkies!

https://adriansblinkiecollection.neocities.org/ -sooooooooooooooooooo many blinkies, its actually wild- u can find everything here srsly

https://y2k.neocities.org/blinkies -more blinkies broski (BIT OF A FLASH WARNING, ITS HEAVY ON THE EYES NGL)

https://raining-starss.neocities.org/stampcollection -stamps galore! loads of blinkies and some buttons too

https://blinki.es/ -blinkies- but organized and searchable...wow

https://horrorgifs.neocities.org/ - if u have a more gothic/dark/horror aesthetic, srsly check this out, its a huuuuuge database of gifs, its so sexy like, wow- SRSLY

https://en.wikipedia.org/wiki/List_of_emoticons -every single emoticon u could ever need, just copy and paste that shit bro


Useful bits of code!

copy and paste these into ur about me section


Music Autoplay
  1. paste the code into the about me section (doesnt have to be in the <style> tags)
  2. replace the VIDEOIDHERE with ur embedded video link (more info below)
  3. enjoy

<iframe width="0" height="0" src="https://www.youtube.com/embed/VIDEOIDHERE//?&;amp;;autoplay=1&;loop=1&;controls=1" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen="" loading="lazy">

</iframe>


How to embed links for music

  1. uUGo to youtube and pick the song you want
  2. click share
  3. click embed
  4. copy the jumble of numbers and letters (the video id)
For example:

this is the whole embedded link for London Dungeon by the Misfits-

<iframe width="560" height="315" src="https://www.youtube.com/embed/JrvHzIJ6zx8?si=qdXajcHfQ3jW9HIP" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>

The video id has been underlined and placed in bold- thats all ya need!


Loading Screen

make sure this is in the <style> tags, and just shove ur chosen url ending in .gif into where it says URGIFHERE

body:before {
    content: " ";
    height: 100vh;
    width: 100vw;
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100;
    background-image: url('
URGIFHERE');
    background-size: cover;
    background-repeat: repeat;
    background-position:center;
    background-color: black;
    animation: yourAnimation 2.5s ease 0s 1 normal forwards;
    pointer-events: none;
}
@keyframes yourAnimation { 0.0%{ opacity: 1;} 75%{ opacity: 1; } 100%{ opacity: 0;} }

 
 
Online icon

this changes the online thingy that uhh... says ur online, yk? again <style>


.general-about{
  position: relative;
  margin-top: 30px;
}
.online {
    content: url(
URURLHERE);
}


The image thingies that show up in the 'contacting ur name' bit...yea?

this is to change the little icons next to the words in ur contact box- does that make sense?
use ur common sense for this, its 2am rn cmon.
make sure its in the style tags.


.contact .inner a img {
  font-size: 0;
}
.contact .inner a img:before {
  font-size: 1em;
  display: block
}
.contact .inner a:before {
  content: ""
}


.contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a:before {
  /* add to friends */
  display: inline-block;
  background: url("
URLGOESHERE")no-repeat 0 0;
  background-size: 100%;
  width: 16px;
  height: 16px;
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
  /* add to favorites */
  display: inline-block;
  background: url("
URLGOESHERE")no-repeat 0 0;
  background-size: 100%;
  width: 16px;
  height: 16px;
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
  /* send Message */
  display: inline-block;
  background: url("URLGOESHERE")no-repeat 0 0;
  background-size: 100%;
  width: 16px;
  height: 16px;
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
  /* forward to friend */
  display: inline-block;
  background: url("URLGOESHERE")no-repeat 0 0;
  background-size: 100%;
  width: 16px;
  height: 16px;
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
  /* instant message */
  display: inline-block;
  background: url("URLGOESHERE")no-repeat 0 0;
  background-size: 100%;
  width: 16px;
  height: 16px;
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
  /* block user */
  display: inline-block;
  background: url("URLGOESHERE")no-repeat 0 0;
  background-size: 100%;
  width: 16px;
  height: 16px;
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
  /* add to group */
  display: inline-block;
  background: url("URLGOESHERE")no-repeat 0 0;
  background-size: 100%;
  width: 16px;
  height: 16px;
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
  /* report user */
  display: inline-block;
  background: url("URLGOESHERE")no-repeat 0 0;
  background-size: 100%;
  width: 16px;
  height: 16px;
}

ok i have a raging headache rn so im gonna leave it there, hope this helps!!! I'll probably make more of these little resource sheets cos its fun. ish. kinda fun. not rlly. ugh my HEAD HURTTTS. anyhoo, enjoy- if anything doesnt work...um...then may whichever god you believe in help you.

-mjrtom





7 Kudos

Comments

Displaying 1 of 1 comments ( View all | Add Comment )

terry :-)

terry :-)'s profile picture

the theme of this blog is nnneeeaaatttttt


Report Comment



yo ty!

by mjrtom61013; ; Report