Showing posts with label Minima. Show all posts
Showing posts with label Minima. Show all posts

1.03.2011

How to Get a Cute Non-Web Font for your Blog.


Part 1: Get Set up

12.29.2010

Making a Custom Header using Picnik. SO EASY and FREE!

Step #1: Making the Header
I found this really cool website called Picnik it is so easy to use, and the best part is that it is FREE and NO registration required!!  I will show you how I made this header, so that you can make one that is 100% Custom for you!


First, head over to Picnik, and click on Get Started!

12.15.2010

EASY DIY Custom Blog Design Part 3: Wide 2 Column Template

This is a Series of Tutorials, so if you need to start at the beginning, CLICK HERE.

In this part of the tutorial, I am going to show you how to make a wide 2 column template with nice white space.  If you want to make a 3 column template instead, I have a tutorial HERE.

This tutorial uses the Minima Template (if you started at the beginning, I already had you do this).

First, you will need to head over to your Edit HTML page and scroll down to #header-wrapper { and change 660px to 1000px (or change it to what ever width you would like, in my example I am doing 1000px).

Next do the same thing on your #outer-wrapper {

Now I need to adjust the #main-wrapper {  I changed my width to 640px.

Then adjust the  #sidebar-wrapper {  I changed mine to 300px.

If you like your sidebar on the right, you can stop here, but if you would like to change it to the left, I will show you how to do that now.

Go to your #main-wrapper {  and change $startSide to $endside, and go to your #sidebar-wrapper {  and change $endSide to $startSide.  Now it should look like this!

Now Save your Template, and you are set!

12.02.2010

The Easy Way to Make a Seamless Pattern in Adobe Illustrator and Install it in Blogger.

I used to make all of my blog backgrounds about 1600px X 1000px, which is all good....  but I hated it when I would look at my designs on my dad's 30in monitor and I would see all that nasty white space on the sides of my beautiful designs.

Hopefully with this simple tutorial, I can get you hooked on seamless patterns as backgrounds.  Not only are they simple to make, and oh so lovely, the go on forever and ever, no nasty white space.  Oh, and don't let me forget, they are smaller in file size, therefore, they will show up quicker when you are loading your page.

So on to the tutorial!  This is going to be the first of 2 tutorials, and this one is the UBER EASY way to do it.  We are going to take a dingbat font (this is "Davys" that I found at fontsquirrel.com) and make that into our seamless pattern.

11.30.2010

DIY Custom Blog Design Part 6: Custom Signature

This is Part 6 of a series of tutorials, if you need to start at the beginning, click here.

I have made my Custom Signature in Adobe Illustrator (Here is a Tutorial if you are interested), but if you don't have Illustrator, or you are just more of a Photoshop kinda girl (or guy).  That is fine too!  If you don't have either, you can use the free Paint.net, or My Live Signature.


I made my signature 175px Wide by 100px Tall, but remember this is custom :)  So once you have your signature made, upload it to your Photobucket account (Start at Part 1 if you need help there).

11.27.2010

DIY Custom Blog Design Part 5: Sidebar Titles

This is Part 5 of a series of tutorials, if you need to start at the beginning, click here.

 In this part of the tutorial, we will make sidebar titles and I will show you how to install them.


You are going to first make the Sidebar title the same way that you did the Header.  If you need to see that Tutorial, CLICK HERE.  The only thing that you need to do differently, is to make the size of your sidebar titles, with the same width as your sidebar. You can find the width in your Edit HTML page here:

11.22.2010

DIY Custom Blog Design Part 4: Header

This is Part 4 of a series of tutorials, if you need to start at the beginning, click here

In this part of the tutorial, we will make a simple header and I will show you how to install it properly.

I am making my header in Photoshop CS5.  If you don't have Photoshop, you can use Paint.net it is similar to Photoshop, and 100% FREE!

11.05.2010

DIY Custom Blog Design Part 1: Getting Started

I am so excited to do this tutorial, it is something that I have thought about for a long time. I wanted to put together a completely custom blog design and show everyone that is ambitious enough how to do it themselves.

So there are TONS of ways to approach a custom blog design, so I just decided to pick one direction and go with it. I am going to take a digital scrapbooking kit and make a custom blog design from that.

Here is a quick list of places that I found to get free digital scrapbooking kits (NOTE: Make sure to check the owner's Terms of Use, many are NOT for Commercial Use, only Personal):



I chose to go with one of my favorite bloggers' kits, "The Fall Collection" at kevinandamanda.com! Check her out, because she has FREE fonts as well, and they are super cute!

So the first thing that we need to do to get started is to set up a photobucket account. Go to Photobucket.com and set up the FREE account. Once that is set up, you need to make sure to click on "(more options)" see below, and select "1 megabyte file size"

Back in blogger, the very FIRST thing you need to do is to back up your template, to do that, go to "Edit HTML" and click on "Download Full Template". Take that file and make sure you know where it is so that if you need to go back you can.

We need to change our template to Minima, it is an older template, so you will need to go to your "Edit HTML" page, and click on "Select Layout Template", then you will see it :) When you click on "Save Template", it may or may not ask you if you wish to keep your widgets, if it does, keep them, unless you want to loose everything on your sidebars.

10.25.2010

Tutorial on How to Adjust the Position of Your Header

This is a very basic tutorial, but very useful.  I am going to show you how to do it in 2 different templates.

Tutorial # 1:  Using the good old "Minima" Template.

Upload your header image like you would normally and get rid of the lines around your header.  If you don't know how to do that, I have an easy tutorial here.


Next head over to your "Edit HTML" page, and scroll down to your

7.05.2010

Where Did Minima Go?!?!?

As a blog designer, I am sure that I am not the only one that started panicing when I saw all the changes that were being made to blogger.... The biggest fear I had was when I opened up the new templates to find the Minima Template gone. But, no worries, I found it! It is under your Edit HTML page, at the very bottom, under "Select Layout Template"

Related Posts with Thumbnails