DAY 1:
<style>
.general-about{
position: relative;
margin-top: 30px;
}
.general-about .profile-pic::before{
content: '';
background: url('https://media.giphy.com/media/rXyIg5TrQ3jYuZME1G/giphy.gif') no-repeat;
background-size: cover;
display: block;
width: 100px;
height: 100px;
z-index: 999;
position: absolute;
top: -43px;
left: -32px;
}
</style>
DAY 2:
Did you know that you can customize who can view your Profile, who can see when you were last active on SpaceHey, and who can start IM conversations with you?
Just head over to your Account Settings and change the options however you like!
For example, you can easily switch between a public profile (default) and a private profile. If you set it to private, only your friends (which you have to accept) will be able to view your profile.
DAY 3:
How do you plan to spend the festive season this year? Are you planning to celebrate with friends and family? Do you already have all gifts? Or are you more of a last-minute gift-buyer? 😅
DAY 4:
Happy 4th of December! 🎅
Did you know that we recently launched a mobile app for SpaceHey?
It's called SpaceHey Mobile and it doesn't have all features from SpaceHey web yet, but it's already a great companion for using SpaceHey on-the-go!
Try it out today if you haven't already!
DAY 5:
Santa Claus is coming to town... 🎵
Add the following code snippet to your profile for a special festive surprise :)
aria-hidden="true"
DAY 6:
Today I'd like to challenge you to do something good!
You could call a friend you haven't spoken to in a while, you could leave a positive comment on someone's SpaceHey profile or you could try to make someone laugh!
Take today as an opportunity to spread some festive joy and make the world a better place, one step at a time! 🎄
DAY 7:
Today, I want to show you a quick tip on how you can use a custom Font on your Profile!
First, you need to find a webfont which you like. You can use a site like
fonts.google.com which has a lot of great, free fonts!
Then, you need to get an @import code for the font you chose (on Google Fonts, you can get it by clicking on "Select" > "@import").
As a last step, you need to choose which elements on your Profile you want to appear in this Font. For example you can use a selector like "body" to select all the text on your whole profile or "h1" to just select all headings on your Profile (which is just your name in most cases).
Here is an example code snippet which makes your name on your Profile use the
Lobster Font from Google Fonts!
<style>
@import url('https://fonts.googleapis.com/css2?family=Lobster&display=swap');
h1{
font-family: 'Lobster', cursive;
font-size: 2.5em !important;
}
</style>
DAY 8:
Let's get your SpaceHey Profiles ready for Christmas! 🎅
How about adding some animated falling snowflakes to your profile today?
For example, you can use the following code:
<style>
/* customizable snowflake styling */
.snowflake {
color: white;
font-size: 1em;
font-family: Arial, sans-serif;
text-shadow: 0 0 5px black;
}
@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;user-select:none;cursor:default;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%;animation-delay:0s,0s}.snowflake:nth-of-type(1){left:10%;animation-delay:1s,1s}.snowflake:nth-of-type(2){left:20%;animation-delay:6s,.5s}.snowflake:nth-of-type(3){left:30%;animation-delay:4s,2s}.snowflake:nth-of-type(4){left:40%;animation-delay:2s,2s}.snowflake:nth-of-type(5){left:50%;animation-delay:8s,3s}.snowflake:nth-of-type(6){left:60%;animation-delay:6s,2s}.snowflake:nth-of-type(7){left:70%;animation-delay:2.5s,1s}.snowflake:nth-of-type(8){left:80%;animation-delay:1s,0s}.snowflake:nth-of-type(9){left:90%;animation-delay:3s,1.5s}.snowflake:nth-of-type(10){left:25%;animation-delay:2s,0s}.snowflake:nth-of-type(11){left:65%;animation-delay:4s,2.5s}
</style>
<div class="snowflakes" aria-hidden="true"><div class="snowflake">❅</div><div class="snowflake">❆</div><div class="snowflake">❅</div><div class="snowflake">❆</div><div class="snowflake">❅</div><div class="snowflake">❆</div><div class="snowflake">❅</div><div class="snowflake">❆</div><div class="snowflake">❅</div><div class="snowflake">❆</div><div class="snowflake">❅</div><div class="snowflake">❆</div></div>
DAY 9:
Happy December 9th!
I hope you have a great, festive day so far!
Today I want to share a tiny bit of code that will make your profile picture spin!
<style>
@keyframes spin{
from{ transform:rotate(0deg); }
to{ transform:rotate(-360deg); }
}
.general-about .profile-pic img{
border-radius: 50%;
animation: spin 7s infinite linear;
}
</style>DAY 10:
Hi! Today I want to share a comment I received from Marci a while ago:
Hope you learned something new today! :)
DAY 11:
Hi!
Did you know that you can use custom CSS to animated things on your profile?
Yesterdays post showed you how to use custom CSS to spin your profile pic, today you'll learn how to animate your profile's background!
<style>
body{
background: linear-gradient(90deg, #0e66dd, #25d8d3);
animation: gradient 10s ease infinite;
background-size: 400% 400%;
}
@keyframes gradient{
0%{ background-position: 0% 50%; }
50%{ background-position: 100% 50%; }
100%{ background-position: 0% 50%; }
}
</style>You can replace the two #color-codes in the third line with different colors to change the gradient!
Have fun!
DAY 12:
What's your favorite Christmas Playlist? Share it in the Comments below! 🎶
Btw: You can use an Embed-code from Spotify, SoundCloud or YouTube to embed a playlist directly into your profile! Just copy the HTML embed-code from e.g. Spotify and paste it in the "About me" section (or any other section) of your profile!
DAY 13:
Hey there everyone! I hope you're enjoying the festive season so far :)
Today, I want to share a great website with you which allows you to create amazing customized background patterns for your SpaceHey Profiles!
To use it, adjust the values (colors, opacity and spacing) to your liking, choose your favorite pattern and click on the "Copy CSS code" button on the pattern!
Then, use the following code on your SpaceHey Profile and make sure to replace [PATTERN CODE] with the pattern code you just copied!
</style>
body{
[PATTERN CODE]
}
</style>
For example, this should then look something like this:
<style>
body{
background-color: #e5e5f7;
opacity: 0.5;
background-image: linear-gradient(135deg, #1D4ED8 25%, transparent 25%), linear-gradient(225deg, #1D4ED8 25%, transparent 25%), linear-gradient(45deg, #1D4ED8 25%, transparent 25%), linear-gradient(315deg, #1D4ED8 25%, #e5e5f7 25%);
background-position: 19px 0, 19px 0, 0 0, 0 0;
background-size: 38px 38px;
background-repeat: repeat;
}
</style>
DAY 14:
Hello everyone - Happy 14th December!
Today I want to share a few sites I found with some amazing free Christmas Illustrations and Graphics! I think they're going to look great on your SpaceHey Profiles!
DAY 15:
I hope you have a great day so far!
Today I want to share a tiny bit of code with you that can make your profile picture turn into the shape of star! ⭐️
<style>
.general-about .profile-pic img{
clip-path: polygon(50% 0%, 67% 29%, 98% 35%, 75% 58%, 79% 91%, 50% 75%, 21% 91%, 25% 58%, 2% 35%, 33% 29%);
}
</style>I hope you like it!
If you want to turn your profile picture into a different shape, make sure to check out this site to get the "clip-path" codes for other shapes!
DAY 16:
Want to customize your SpaceHey Profile however you like without using a pre-made layout?
You can do this with a bit of HTML and CSS code!
Here are a few great free websites if you want to start learning CSS:
Have fun! It's not that hard ;)
DAY 17:
Today I'll share a tiny code-snippet which will make your profile have rounded corners everywhere! 😊
<style>
*{
border-radius: 9px;
}
.profile .contact .heading, .profile .table-section .heading, .home-actions .heading{
border-radius: 6px 6px 9px 9px;
}
</style>
Have a great day!! 🎅
DAY 18:
What's the most festive Profile you came across on SpaceHey yet? Post the link in the comments below!
DAY 19:
Here are some useful HTML code snippets you can use pretty much everywhere on SpaceHey - on your profile, in comments, in bulletins, in blog entries and on the forums!
Scolling Text
<marquee>Text</marquee>
Blinking Text
<blink>Text</blink>
Highlighted Text
<mark>Text</mark>
Example
Bold Text
<b>Text</b>
Example
Italic Text
<i>Text</i>
Example
Underlined Text
<u>Text</u>
Example
Strikethrough Text
<del>Text</del>
Example
Link
<a href="https://example.com">Text</a>
There are a ton of other supported HTML Tags, but these are the most common ones!
Hope this helps some of you!
Enjoy the festive season!
DAY 20:
Christmas is getting closer and closer! 🎅
If you want to get your Profile ready for Christmas, here's a last-minute code which adds some striped red borders and backgrounds to your profile - perfect for the festive season!
<style>
.general-about .profile-pic img,
.comments-table,
.profile-info{
border: 10px dashed #ee1b22;
}
.profile .blurbs .heading, .profile .friends .heading,
.profile .contact .heading, .profile .table-section .heading, .home-actions .heading{
background: #ee1b22;
color: white;
}
.profile .blurbs .heading, .profile .friends .heading a,
.profile .contact .heading, .profile .table-section .heading, .home-actions .heading a{
color: white;
}
.profile .contact, .profile .url-info, .profile .table-section, .home-actions{
border: 2px solid #ee1b22;
}
</style>
Have a great day, everyone!!
DAY 21:
We need more GIFs in our lives!! :D
If you want to add a GIF to your profile, here are some great sites to get GIFs from:
You can easily embed a GIF on your profile with the following code:
<img src="GIF_URL" alt="fallback text">
Did you find some other good websites with cool GIFs? Let me know in the comments!
DAY 22:
Happy December 22nd! It's not long until Christmas now!
If you don't have plans for today, why don't you try building a Gingerbread House? :)
DAY 23:
Today I'll show you, how you can fill any Text on your Profile (for example your name) with a graphic - E.g. a snowy-glitter GIF!
Here's how:
<style>
h1{
background: url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/191814/blue_glitter.gif') repeat;
color: transparent;
background-clip: text;
font-size: 20em;
}
</style>
[GIF SOURCE]
Alternatively, you can use a Glitter Text-GIF Generator like textanim.com or glittermaker.com to generate an animated Text Graphic you can embed on your Profile!
Hope you like it!
Have a super-festive day!
DAY 24:
I hope you enjoyed the random Christmas posts in the past 24 days a tiny bit :)
I wish every single one of you a Merry Christmas and wonderful Holidays! 🎄
Enjoy this Christmas and don't forget to take a break and talk to your loved ones and friends!
And if you still need a last-minute Christmas present for a SpaceHey friend, you can gift them a "Supporter" badge for their Profile, by donating to help keep SpaceHey alive (make sure to insert their Profile link when donating!). Thank you ❤️
Merry Christmas!
!!THIS WILL NOT BE DELETED THEN OF CHRISTMAS,IM DOING THIS BLOG FOR IF ANYBODY WANTS THE CODES THEN OF CHRISTMAS OR WHEN THE CALENDEER THING ENDS!! :3
Report Blog Entry
Comments
Displaying 0 of 0 comments ( View all | Add Comment )