Max's profile picture

Published by

published
updated

Category: SpaceHey

How to write pretty blogs!!! (beginners!!)

SPACEHEY BLOG BASICS!!! 

(Long post!!!) here is a detailed tutorial with pictures on how to write blogs with better designs! There are many ways to write blogs better :D These are the just the basics for beginners!


⬇︎ Regular text ⬇︎

IMG-4592

This is where you write your blogs. You can’t use HTML here, so you can’t paste any photos/blinkies while you have the <> mode on.



⬇︎ HTML text ⬇︎

IMG-4593

This is where you can use HTML. You can paste URLs here, and when you switch back to <> mode, you can see the photo. (I will be explaining more of this in a different post!)



⬇︎ Header text ⬇︎

IMG-4594

This will let you change the size of your text. 

TEXT >:D (header 1)

text :3 (paragraph)



⬇︎ Text type ⬇︎

IMG-4595

This will let you edit the look of your text. You can combine multiple options to get what you want!




⬇︎ Text color ⬇︎

IMG-4596

The color wheel button can change your text color.



 ⬇︎ Text background ⬇︎

IMG-4597

The paint bucket button can change your text background color.



⬇︎ Mix and match! ⬇︎

IMG-4598

You can also use both at once!



⬇︎ Eraser tool ⬇︎

IMG-4599 

Select the text you wanna get rid of the effects. For demonstration, I’m gonna be selecting this  

 → WRITING  IMG-4600Click the eraser tool while selected, and all effects will disappear.



⬇︎ Linked text ⬇︎

IMG-4602 

Click on the chain ⛓️  button to open this screen. You paste your URL on the top and add the text on the bottom to create a linked textIMG-4603

The linked text will look like this, your blog viewers can click here.

(example) Look at my profile!



⬇︎ Adding images ⬇︎

Separate blog! ——> Adding images


⬇︎ Text placement, bullet/numbered points, dividers ⬇︎

IMG-4613

Text placement

It saves you a ton of time instead of just endlessly hitting space.

yeah!

Bullet/numbered points

Hit enter once to write your next point, or hit enter twice to end the points.

Divider

Adds a dividing line to your blog. Makes it easier to write separate topics, and easier to read!


Thanks for reading!!! If there’s anything else beginner bloggers should know, please tell me in the comments! Feel free to ask questions here!

If you found this helpful, leave some kudos on this post! :D


41 Kudos

Comments

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

Y3k_Nath

Y3k_Nath's profile picture
Pinned

Hey, I wanted to know something! There are people who have a personalized blog matching their profile, how do you do that? mine is always standard


Report Comment



body {
background-image: url("PASTE BACKGROUND URL HERE");
background-position: center center;
background-size: 5000;
background-attachment: fixed;
font-family: 'Georgia', serif;
}
.inner b {
color: #9D6C82; (TEXT COLOR FOR: DISPLAYING OF COMMENTS/COMMENTS TIME OF POSTING)
}
nav .top {
background-color: black;
}
nav .links {
background-color:black;
text-align: center;
border-radius: 4px 4px 0 0;
background-position: center;
background-repeat: no-repeat;
}
button {
color: #000000;
background-color: yellow;
}
.count {
color: #F1DAC4 ; (TEXT COLOR FOR: THE NUMBERS IN BETWEEN DISPLAYING OF COMMENTS)
}
a {
color: #42537D; (TEXT COLOR FOR: SPACEHEY RULES/ABOUT, NEWS, RULES, ETC AT THE BOTTOM/ YOUR NAME, VIEW PROFILE, VIEW BLOG, REPORT, CATAGORY YOU PICKED/ VIEW ALL, ADD COMMENT/ EDIT, DELETE, PIN TO BLOG)
}
nav .links a {
color:#F1DAC4; (TEXT COLOR FOR: TOP BAR HOME, BROWSE, SEARCH, MESSAGES, BLOG, ETC)
}
footer {
background-color: #6A8D97;
}
footer p {
color: #6A8D97 (TEXT COLR FOR: BROUGH TO YOU BY/ DISCLAIMER AT THE BOTTOM)
}
footer .links {
color: #9D6C82; (I'm sorry I don't know what this one is for)
}
.comments-table td:first-child, .comments-table td, .comment-replies, .details-table td:first-child, .details-table td {
background: blue;
color:#F1DAC4; (TEXT COLOR FOR: COMMENTS)
}
.edit-info {
background-color: #6A8D97;
border: 1px;
}
.blog-entry .title {
background-color: 6A8D97;
color: #42537D; (TEXT COLOR FOR: BLOG ENTRY TITLE)
padding: 5px;
}
p.links a:first-child
.icon{
content:url(BLOG ICON URL HERE);
width: 25px;
height: auto;
visabiliy: ;
}
p.links a:nth-child(2) .icon {
content: url(PROFILE ICON URL HERE);
width: 25px;
height: auto;
visabiliy: ;
}
p.links a:last-child .icon, table.comments-table td .icon {
content: url(REPORT ICON URL HERE);
width: 25px;
height: auto;
visabily: ;
}
.blog-entry .content {
background-color: #ee008c; (HOT PINK)
padding: 10px;
}
main {
background-color: #80c342; (LIGHT GREEN)
}
main .left {
background-color: #8ed9f9; (LIGHT BLUE)
color: #00ff15;
}
main .right {
padding: 1px;
background-color: #f4b5d2; (LIGHT PINK)
}





Paste this code on your blog (in html mode) and then change it to regular text mode
You’ll see the colors and stuff added on your blog.
You can change the colors and add backgrounds changing the hex code (#000000)<—— stuff that look like this.
Thanks 4 asking! :)

by Max; ; Report

thank you very much!!!

by Y3k_Nath; ; Report

Vilppu🌊

Vilppu🌊's profile picture

Thank youu!! Really helpful <33


Report Comment



Np!!!

by Max; ; Report

sigkinhater

sigkinhater's profile picture

AHHHH TYSM!!! (⁀ᗢ⁀)


Report Comment



glad it helped!!! :)))

by Max; ; Report