How I Made my Blog Look Awesome

I wanted to share with you how I designed my blog.

Here are some tips I was willing to share, but keep in mind: they are just tips, not steps! :)

Well,  first, I visited a few other popular blogs to see how they did theirs and examined them.

My first impression was that ALL popular and good-looking blogs have white backgrounds. 

And I'm not against it, but I want to have the joy of looking at pleasant designs and colors while I'm reading, and the joy of designing it.

It really is fun! It's not stressful if you look at things and handle them carefully.

I visited this website:

http://thecutestblogontheblock.com/

After deciding what color themes I wanted, I chose a background that totally expresses me.

I found a matching Banner and downloaded it, which then I edited in an art program called Inkscape, which you can get here, and put simple text on it, with a little flourish to express the blog and its purpose.

I noted these simple tips:

*To write like this. Not all blogs do it, but the best do. Hard returns between each sentence makes it easier for people to read, and more professional. It may seem silly, but I like blogs like that. They're right. Its alot easier to read and you don't get overwhelmed with a bunch of words spilling out over the page.

*A "readable" font. I understand if you want to make it look elegant by making the fonts cursive, or fun by making them look curly, but its hard to read. Pick a font like the one I'm using, a straight and neat one, and more people will read your posts. I promise, it works. Every blog I've seen with simple fonts has more views. If you really want, say "Crafty Girls" font (which, BTW, I thought was adorable, but...), you can make your gadget and post titles and things like that in that font.

*Huge photos. That's a big thing. If you're going to be putting a bunch of pictures on your blog, whether its a photography blog, or a craft blog, or whatever, if you like posting pictures, there'll be more of them, so you want to make that part of your blog. I make mine X-large. Pictures are awesome. People look for bright and vivid and huge pictures when they read good blogs. I do, at least. :D It's also just another one of those things to make your blog look more fancy anyway.

*Remove Navbar. The Navbar is the bar up top on your blog. Once you remove it, it will make people focus more on your blog, and not Blogger. {see how to remove Navbar below}#

*Center your words. When you make a post, just go up top and click the second option for how you want to position your post.

*Make your letters in the Blogger size, "Large", so others can read it. That's the size I use, and I think its pretty decent, don't you?

*Follow these other steps and tips. :)

How to remove Navbar:

#Go to your Dashboard, then click on your blog. Go to Layout, and in the right-hand corner, you should see a gadget titled, "Navbar". Click it, scroll to the bottom, select "Off", and click save.

I added blinkies, which thcutestblogontheblock.com also has, and searched for some CSS codes.

To add CSS, go to your blog>template>customize>advanced>add CSS.

Here they are:

For a bigger profile picture:

.profile-img{

height: auto;

width: 200px;}

To remove the Blogger symbol beside your profile name:

.profile-name-link

{ background-image:none !important}

To remove border from pictures:

.post-body img, .post-body .tr-caption-container, .Profile img, .Image img,

.BlogList .item-thumbnail img {

  padding: none !important;

  border: none !important;

  background: none !important;

  -moz-box-shadow: 0px 0px 0px transparent !important;

  -webkit-box-shadow: 0px 0px 0px transparent !important;

  box-shadow: 0px 0px 0px transparent !important;

}

To center page tabs:

.PageList {text-align:center !important;}

.PageList li {display:inline !important; float:none !important;}

To make links italic when hovering:

a:hover { color: none; font-style: italic;
text-decoration: none; }

For a divider between gadgets:

.sidebar .widget {
border-bottom: 2px solid #F2F2F2;
margin:0 0 1.5em;
padding:0 0 1.5em;
}

*Be sure to hit enter before applying it to the blog, or else it won't work. You might notice the orange button at the top become a bolder shade when it allows you to save.*

These were just a few tips. I'm still learning tricks. Check back for more later!

Thanks to 

http://belovedbluebird.blogspot.com/2013/07/basic-blogger-css-codes-to-improve-your.html

for helping me!

Bree