skip to main | skip to sidebar
Tutorials
  • Home
  • Freebies
    • Backgrounds
    • Tutorials
  • Services
    • Custom Designs
    • Pricing
    • Gift Certificates
  • Portfolio
  • About
    • Contact
    • Blog
    • Terms of Use

How to Grant Admin Privileges

New Blogger
  1. Go to Settings
  2. In the permissions section, click on the link that says "+authors"
  3. Enter the email ID of the person you wish to grant Admin/Author rights
  4. Hit the invite button and then blogger will send an email to that person
  5. Once they accepts your email, you will see their e-mail/ID name on your settings page.  You won't be able to grant them admin privileges until they accept that invite. 
  6. You'll see word "Author" next to their email/ID name, click on that and choose the admin option instead.
If the person isn't showing up on your blog after they've accepted the invite you may need to log out of blogger and log back in.
They will now be an admin on your blog.

Old Blogger
  1. Go To Blogger: Permissions
  2. Click the Add Authors Button
  3. Enter the email ID of the person you wish to grant Admin/Author rights
  4. Hit the invite button and then blogger will send an email to that person. 
  5. Once he accepts your email, you will see their e-mail/ID name on your Permissions page.  you won't be able to grant them admin privileges until they accept that invite
  6. You'll see word "Author" next to their email/ID name and word "Admin" next to your Email ID. 
  7. Now to make that person an Admin and grant them full access to your blog, Click the "grant admin privileges" link.
You have now successfully transferred or shared your blog with another person.

Posted by Brooke Banta at 6:18 PM 0 comments
Labels: Granting Admin Privileges

Customizing your older, newer, and home links

You can replace the "older post" Newer posts" and Home inks at the bottom of your blog with any word/phrase you want or with an image that you create.


Creating an image is the same process as making a signature.  Except you are replacing your name with whatever word or phrase you want.  For the purpose of this tutorial I'll stick with "Older" and "New" and "Home".

In order to make your image links for the "New" "Older" and "Home" links, you can follow the same directions on how to make a signature without any graphics software here.  Or Carolynn at Makin Cute Blogs has a great tutorial on how to make signatures with Adobe Illustrator here.  But you can use any graphic design software to make a png file image for each link.

Make a separate image for "New", "Older", and "Home".  Make sure to save them as PNG files so the backgrounds are clear.

Once you've made the images upload them to any photo hosting account such as Photobucket or tinypic.  Just make sure you can get the HTML direct link to each image.

Now to install the images:

1.  Go into the Design settings of your blog.  Got to edit HTML.

Before doing any changes to your template you should always press that lovely link at the top of the template that says, "Download Full Template."  Just in case things go awry.

2. Click on the little box on the top right that says "expand widgets"

3. Find this code

The code in RED is the code for the "New" link
The code in GREEN is the code for the "Older" link
The code in BLUE is the code for the "Home" link

Change the codes from above to look like this

 

 Now if you don't want to get all crazy with making images you can still go in and customize your older and newer links by changing the words.

To change just the wording for your blog just replace the colored codes from above with whatever word or phrase you want.  It will look like this.

  Now you should have customized "New","Older", and "Home" links!
Posted by Brooke Banta at 12:12 PM 3 comments
Labels: Customize page links

Make your Blogger Navbar fade in and out

There are some out there that do not like the blogger navbar.  Mostly because it makes their blog look like, well... a blog.  There are tutorials on how to remove it completely from your blog somewhere floating out there in the great chasm that is the internet.  Or you can just find it here.

Personally I like the blogger navbar but that's because I use it all the time.  It’s useful to be able to navigate through a blog while I work on designs.  I honestly don’t really notice the blogger navbar, it’s just there.  I do however notice when it is entirely missing on someone’s blog. Heaven forbid I actually have to get back to my blogger dashboard by typing blogger.com into my browser. But it’s still annoying.

So someone somewhere came up with a lovely solution.  It’s a fading Navbar that shows up when you hover over it with your mouse.  Is that not the best idea ever?  Okay maybe not the best idea ever but it’s still a good one and it makes me happy.

The original tutorial for making your blogger navbar fade is found at Spice Up Your Blog.  He has many great blogger tutorials.  Including one where your navbar appears at the bottom of the blog.  I don’t know why you would want that but hey it’s there.   

Before you do anything to your template it's a good idea to back it up first.

So here’s the long and short of it.

Oh wait its SUPER short.

1. Go into your Design section of your blog.

2. Click on edit HTML

3. Find this code </b:skin>


(The easiest way to do this is to Press the Ctrl and F at the same time and a little search box will pop up at the top of your browser window.  Type in and it will take you right to it.)

4. Copy the code below and paste it into your HTML just BEFORE the </b:skin>

#navbar-iframe{opacity:0.0;filter:alpha(Opacity=0)}
#navbar-iframe:hover{opacity:1.0;filter:alpha(Opacity=100, FinishedOpacity=100)}


5. Save your template.

You now have a Blogger navbar that fades in and out.
Posted by Brooke Banta at 10:23 AM 2 comments
Labels: Blogger Navbar

Pattern Resources for making your own Blog Backgrounds

Making your own backgrounds can really become addicting.  Believe you me, I know.  I may or may not have a blog background designing “habit”.   Okay I’ll be honest, creating an entire site where I publicly exhibit my addiction for creating backgrounds is probably all the proof needed.

One of the easiest ways to create your own backgrounds is by using patterns.  Carolynn at Makin' Cute Blogs has a tutorial on how to install a pattern for a background.  

There are literally thousands of free seamless patterns out there.  I just wanted to share some of them with you.

Before I get into the list of resources be sure that as you download, upload, and use the patterns that you read the Terms of Use for each site and/or designer.   Some of the patterns DO NOT allow commercial use.   In some cases the designer asks that you credit them somewhere on your blog.   Please follow the Terms of Use.  When a designer is not credited it is stealing.  Be aware that they can take legal action.  So please give credit where credit is due.  I’ll get off my soap box now.

Here are some great places to find seamless patterns.


Pattern Cooler - This site gives you some control over sizing and most importantly coloring of the patterns.  Plus it is absolutely FREE for Personal Use.  He asks for a small donation for commercial use.

Just pick a pattern and go edit the colors.  It’s like a never ending coloring book.    

Once you’ve got the pattern how you want it, simply download the file to your computer as a png.  Then follow the tutorial on how to install patterns as a background.  Voila you just made your own custom background!


If you don’t want to color and make your own pattern there are many talented designers out there who offer their patterns for free.  Be sure to check the Terms of Use though. 


Click on the images to go to each website.


DinPattern- Free for Commercial and Personal Use

Patterific- Personal and Commercial Use.

Pattern 8- Check each pattern's TOU

Pattern Head- Free for Commercial and Personal Use

Background Labs
Background Labs- Free for Commercial and Personal Use



Everyday Icons- Personal Use ONLY



Ava7- Commercial and Personal Use

Squidfingers- Commercial and Personal Use


Patterns of Change- Personal Use ONLY






Brush Directory.com – is a directory of hundreds of patterns.

Deviant Art. Is another great place to find patterns and other design resources.

In some cases patterns are only available as a .pat file.  A .pat file must be loaded into Photoshop or Photoshop elements in order to use it.

If anyone else has a favorite designer or pattern, then feel free to leave a comment and a link!

There are tons of resources and this post needs to end sometime!

Have fun!
Posted by Brooke Banta at 3:26 PM 1 comments
Labels: Design it yourself

Blog Signature

Do you want a signature for your blog?  You can either: Order one from me; Make your own using photshop, Paint.net, or GIMP; or you can make one for free at My Live Signature. 
Go play around and make something you like.

Just a few hints and tips:

-Don't make anything bigger than about 150 x 70.  Any bigger and it tends to take over the entire post!

-When you're making a signature make sure you set the background as transparent.

- When possible use the same HTML color code that you've already got on your blog.  Don't know what I'm talking about? Check out this tutorial.

Here's a signature that I made using My Live Signature



What to do once you've made the signature:

Once you've got a signature made, save it as a PNG file.  This allows the background to stay transparent. 

Now you've got to upload the image of your signature to a photo hosting site.  There are a few options such as photobucket, flickr, and tinypic.  Make sure to get a hold of the URL code for your signature.  

Once you've got a signature go here to find out how to install it.   
Posted by Brooke Banta at 7:57 AM 1 comments
Labels: Blog Signature

Installing Signatures

There are 2 methods to install a signature.

The first method is easy to install and does not require going into your blogs HTML. However there are some drawbacks.

-The signature will only show up in your new posts. If you want the signature in your old posts you'll have to go back and manually place it in each and every post. Also if you ever want to change your signature you will then have to go change each and every post. When you've got 200+ posts . . . that doesn’t exactly spell fun.

-If you accidentally delete it you have to start a post over or manually paste the code into the post again.

Method 1

Step 1: Go to Dashboard, click on your Settings link, click on the Formatting tab, and scroll down to the box at the bottom that says Post Template.

Step 2: Copy and paste this code

<p><image class="centered"alt="post signature" src="Your sig URL" /></p>

Make sure to copy and paste the URL for your signature into the code.

Step 3: Click save

If you want to put the image in your older posts, make sure you click on the edit HTML link at the top of your post. Copy and paste the code from above at the bottom of your post.


Method 2

I prefer this method. It's much easier to edit and it automatically adds it to every single post! It does require you to go into the HTML of your blog. So if you don't feel comfortable going in there, Don't Do It. I do recommend saving and downloading your template just in case you do mess up.

Step 1: Go to Dashboard, click on Layout, click on Edit HTML. In teh right top corner checkmark the little box that says "expand widgets"

Step 2: Find this code: <data:post.body/>  it looks like this


 An easy way to find it and anything in your HTML is to hit "CTRL" and "F" at the same time. A little "find" box should appear above the blogger window.

Step 3: Copy this code.  Make sure to use your signature's  URL in between the quotations.

<br><img src='Your Sig URL'/></br>

Now paste it just behind the <data:post.body/> code.

Step 4: Save it!

Troubleshooting:

If you get a pop up in RED that says something about the XML code double, check the quotation marks around the URL of your image. It should either be double quotations " for method one.  For method 2 it should be single quoatations like this '.


Feel free to leave comments or questions.
Posted by Brooke Banta at 7:48 AM 4 comments
Labels: Installing Signatures

Getting your colors and fonts to match

If you want your blog text, titles, and links to match your blog background the simplest thing to do is get the HTML hex color code of the colors you are trying to match.  There are a few websites that have a list of the codes.  HTML Color Codes and Computer Hope.  Really if you just type "HTML Color Codes" into google a whole bunch of them will pop up.

Once you've found your code go into your layout and click on fonts and colors.  You'll see this:


To the right of the color palet is a lovely little spot that says: edit color hex code.  Delete the code that is there but make sure to leave the # sound.  Copy and paste the color code that you want and hit enter.  The color will appear in the "colors from your blog" box.  Now simply click on that color for whatever element you want that color.  Make sure you save your blog. 
If you're using any of the Do-it-yourself backgrounds.  Whatever color is your "Page Background Color" will appear as the inner wrapper.
Posted by Brooke Banta at 3:21 PM 1 comments
Labels: Matching Colors
Older Posts

New Background Set Up

Tutorials

  • Blog Signature
  • Blogger Dictionary
  • Blogger Navbar
  • Center your Header
  • Customize page links
  • Design it yourself
  • Granting Admin Privileges
  • Installing Backgrounds
  • Installing Signatures
  • Matching Colors
  • Remove old backgrounds
  • Resizing Backgrounds

Search This Blog

 

Babbling Brooke Designs All rights reserved © 2012