Top 8!

Tags: top 8, top eight, myspace, friends, friendspace, code, hyperlink, table

Description:

Add me to your friends list here

Make sure to credit me by linking my page on your profile or adding me to your top 8 😁.

This Top 8 will not have it's own fonts, so it will automatically change based on the styles you used on your page. This makes the code more responsive. Oh and it's supposed to squish when on mobile, just so that it doesn't go outside your page.

-----------------------------------------------------------------------------------------------------------

Copy and paste this text into a friend's comment section to persuade them to get a top 8! PS everyone should have a top 8 until it becomes a real feature like back in the day:

Hey! You should definitely get a top 8! I have one and you should have 1 too! It's really cool. It's just like MySpace's official feature back in the day, attach the plugin to your profile at https://layouts.spacehey.com/layout?id=27380 I hope you add me btw!

--------------------------------------

If my layout doesn't work, try this one instead

DO NOT use spacehey static profile direct links (Right clicking on a profile picture on spacehey and then copying the image url). Spacehey deletes images frequently, then recovers the ones in use to ease the load of storage needed for these pictures. Instead, open the images in a new tab and download them to your drive. After that, you'll need to host them online. You can use photobucket, imgur or my favourite (discord). Obtain each image URL and insert them where needed. I get this issue mailed to me alot, I noticed this ages ago and decided to just add this info to the code.

Rai's instagram

Preview:

click on the image for a larger preview

Code:

<!-- (c) Layout created by rai_Blogz08 (https://layouts.spacehey.com/layout?id=27380) -->

<!-- rai's TOP 8 -->
<!-- If the Top 8 isn't working, contact rai at: https://spacehey.com/raidynamics -->
<div class="top-eight">
<div class="top-eight-header">
    <h2>Top 8 friends </h2>
  </div>

<!-- #1 -->
  <div class="person">
    <a href="https://spacehey.com/raidynamics"><!-- #1 Link to profile -->
    <p class="one-four">rai!</p></a><!-- NAME -->
    <a href="https://spacehey.com/raidynamics"><!-- Link to profile -->
        <img src="https://cdn.discordapp.com/attachments/1087104094847651900/1087104130767667321/EdTWc5LWoAYFSur.jpg"/><!-- Link to profile picture --></a>
  </div>
 
<!-- #2 -->
  <div class="person">
    <a href="profilelinkinserthere"><!-- #2 Link to profile -->
    <p class="one-four">Name</p></a><!-- NAME -->
    <a href="profilelinkinsert"><!-- Link to profile -->
    <img src="imageURLhere" alt="profile picture"/><!-- Link to profile picture --></a>
  </div>
 
<!-- #3 -->
  <div class="person">
    <a href="#"><!-- #3 Link to profile -->
    <p class="one-four">3-slot</p></a><!-- NAME -->
    <a href="#"><!-- Link to profile -->
    <img src="https://cdn2.iconfinder.com/data/icons/metro-ui-dock/512/myspace_alt.png" alt="profile picture"/><!-- Link to profile picture --></a>
  </div>
 
<!-- #4 -->
  <div class="person">
    <a href="#"><!-- #4 Link to profile -->
    <p class="one-four">4-slot</p></a><!-- NAME -->
    <a href="#"><!-- Link to profile -->
    <img src="https://cdn2.iconfinder.com/data/icons/metro-ui-dock/512/myspace_alt.png" alt="profile picture"/></a><!-- Link to profile picture -->
  </div>
 
<!-- #5 -->
  <div class="person">
    <a href="#"><!-- #5 Link to profile -->
    <p class="five-eight">5-slot</p></a><!-- NAME -->
    <a href="#"><!-- Link to profile -->
    <img src="https://cdn2.iconfinder.com/data/icons/metro-ui-dock/512/myspace_alt.png" alt="profile picture"/></a><!-- Link to profile picture -->
  </div>
 
<!-- #6 -->
  <div class="person">
    <a href="#"><!-- #6 Link to profile -->
    <p class="five-eight">6-slot</p></a><!-- NAME -->
    <a href="#"><!-- Link to profile -->
    <img src="https://cdn2.iconfinder.com/data/icons/metro-ui-dock/512/myspace_alt.png" alt="profile picture"/></a><!-- Link to profile picture -->
  </div>
 
<!-- #7 -->
  <div class="person">
    <a href="#"><!-- #7 Link to profile -->
    <p class="five-eight">7-slot</p></a><!-- NAME -->
    <a href="#"><!-- Link to profile -->
    <img src="https://cdn2.iconfinder.com/data/icons/metro-ui-dock/512/myspace_alt.png" alt="profile picture"/></a><!-- Link to profile picture -->
  </div>
 
<!-- #8 -->
  <div class="person">
    <a href="#"><!-- #8 Link to profile -->
    <p class="five-eight">8-slot</p></a><!-- NAME -->
    <a href="#"><!-- Link to profile -->
    <img src="https://cdn2.iconfinder.com/data/icons/metro-ui-dock/512/myspace_alt.png" alt="profile picture"/></a><!-- Link to profile picture -->
  </div>



<style>
.top-eight {
padding: 15px !important;
border: 1px solid white;
border-radius: 3px;
  display: grid;
  grid-gap: 7px;
  grid-template-columns: repeat(4, [col] auto ) ;
  grid-template-rows: repeat(2, [row] auto  );
  background-color: transparent;
  color: #444;
  margin: 0px;
  width: 100%;
  }
 
  .top-eight-header {
text-align: center;
border: 3px solid white;
border-radius: 3px;
    grid-column: col 1 / span 4;
    grid-row: row 1;
    background: transparent; 
    color: white;
    font-weight: semi-bold;
    padding: 0px !important;

  }
 
  .top-eight-header p {
    padding-bottom: 0px !important;
    margin-botton: 0px;
  }
 
  .one-four{
    grid-column: col 1 / span 4;
    grid-row: row 2;
  }
 
  .five-eight{
    grid-column: col / span 4;
    grid-row: row 3;
  }

.profile .top-eight .person img {
border: 1px solid white;
border-radius: 10%;
width: 100px;
height: 100px;
}
</style></div>
<div>
<a href="https://layouts.spacehey.com/layout?id=27380">Click here to view code</a>
</div>

Copy and paste this code into the "About me" section of your Profile to use it.

Caution: This Layout was not inspected by SpaceHey — use it at your own risk.

Comments

Displaying 20 of 49 comments ( View all | Add Comment )

B4d_Guyz_F4n4t1c_	1747497037 sick!! might b using and reccomending 2 a friend!! :3 Report Comment
B4d_Guyz_F4n4t1c_	1747497037 sick!! might b using and reccomending 2 a friend!! :3 Report Comment
Meech 🖤 Murder	1746812789 Using < 3 Report Comment
₊‧°𐐪꩜🦇Mr.Joy🍓꩜𐑂°‧₊	1745691957 using Report Comment
xXzezezombieXx	1745260327 Might useee Report Comment
micah . . .	1743970463 using Report Comment
Liesel XD	1743804155 Using :))) Report Comment
💿 ; pee girl 🎧	1742783281 Usinggg Report Comment
⌓⌓ 　 graves　,　dude	1742769422 usingg Report Comment
TropicalAvery🌺🌴	1742630630 this is going to cause some drama but using :3 Report Comment it doesn't work :((( by TropicalAvery🌺🌴; 1742631745; Report yeah im having trouble with it too. i wish spacehey would make an actual top 8 feature by ˚ ༘♡ ⋆｡˚ ꕥ 𝓼𝓽𝓮𝓹𝓱𝓪𝓷𝓲𝓮; 1745793217; Report
RAYY/ᐠ ˵> ⩊ <˵マ(Sakuya Izayoi enthusiast)	1742550966 Using Report Comment
Phoenix_WWE_Overload	1741272425 Using!! Report Comment
PixieKannibal	1740337394 using!! Report Comment
♱༻CRZYANG4L༺♱	1740211637 using! Report Comment
♱༻CRZYANG4L༺♱	1740211632 using! Report Comment
˜”°•.˜”°• 4SH3R •°”˜.•°”˜	1739410725 using!! (having a bit of trouble figuring it out but i think i got it!!) Report Comment I'm glad it's working for you ️ by rai_Blogz08; 1741778990; Report
FrostyBeescuits	1738729908 Super cool but im having some trouble. I downloaded and uploaded my friends profile pictures to Imgur, and copied the link but it doesnt display the pfps. any idea what i did wrong? Report Comment Are you copying the "direct links"? It should be the direct image links because the CSS needs to display a hosted image file. It doesn't work with full web pages. Let me know if it works. by rai_Blogz08; 1741779085; Report cuz I opened the image links on ur profile and it says that the acces is denied or something like that. Try using plain direct links. Don't copy the embed iframe links because we already have a container to embed the images in the Top 8 code. by rai_Blogz08; 1741779189; Report
ARII/ARROW	1737438837 this just isnt working, the link works fine, but the profile pictures arent working... can somebody tell me why that might be? i opened image in a new tab, posted into discord and copied the link from there. and put into "link to profile picture" i dont see why it wouldnt work?? Report Comment click on "copy image address" thats the only way it'll actually work by twinkfart69420; 1737925356; Report Heyyy. Discord stopped allowing images to be hosted permanently on their servers as hotlinks a while ago. Maybe a year. I recommend imgur. Discord temp ohotos expire on CDN. by rai_Blogz08; 1738179130; Report AH OH SHOOT! i see now, ILL GIVE IT A TRY... SORRY LMFAO TOT by ARII/ARROW; 1738692932; Report NO WORRIES HAHAHAA! I used to use discord too! It's a shame they did that. by rai_Blogz08; 1741778951; Report
⦻Ezmir X3⦻	1735098659 tyring to use and have used before in the past but it just isn't showing up for me except the click to view code link :( Report Comment It might be something to do with the scripting that’s already on ur profile. Ur script might be interfering with my code. by rai_Blogz08; 1735935384; Report
Spencer SWAG !!!!!	1734646453 i wanna use this but i don't understand how to use it, every time i put it on my profile without changing the code it just shows up as WAY too big for my profile, also i just...don't know how to set it up sigh i cant code at all Report Comment Aww, I recommend changing the container size. by rai_Blogz08; 1735935417; Report