Tutorial: Adding a Custom Favicon with a Plugin

Hey everyone!  Today, I’m going to tell you how to use a simple plug-in that can customize your blog in a big way.  I’m talking about the All in One Favicon plug-in for WordPress.

So first off, what is a favicon anyway?  A favicon is that tiny icon that shows up in the web browser tab that lets you know what page you are currently viewing.  It’s a great way to brand your website/blog using a logo or symbol.

img2

Favicons are generally created from a 16px by 16px .png or .ico image.  I have created a few cute favicons (saved as .png files) for you to try out at home so you can follow along with this tutorial. Here are the favicon’s included in the file:

faviconYou can download them HERE.  Or, feel free to create your own!

First, we need to install the All in One Favicon plugin.  Go to your WordPress Dashboard and click on “Plugins” and then “Add New.”

img3

Search for “All in One Favicon” by Arne Franken and click on “Install Now” under the name.  It will ask you if you are sure and just click OK.  Then, activate the plugin on the next screen.

img4

img5

Now you will see the All in One Favicon plugin under your “Installed Plugins.”

To upload your custom favicon so it will be present on your website/blog, click on “Settings” underneath the “All in One Favicon” title.

img6You will see the following screen.  Click “upload” by the “PNG frontend” option.  We are using a .png for this exercise, but this plugin also supports .ico, .gif, and Apple Touch icons as well.

img13

Find your favicon file you saved to your computer.  After it uploads, be sure to push “Save Changes” at the bottom of the screen.

img14And that’s it, folks!  See how easy that was?  Head on over to your website and see how your new favicon looks!

img15

Carrie

Summer Bucket List Printable

The temperatures are rising and summer is almost here! If you have school-aged children, you may be wondering how you’re going to fill those long summer days once the final bell rings. Or maybe you want to check off some sites you’ve been meaning to visit around town.

This free summer bucket list printable can help you make the most of your summer days.

summerbucketlist

You can either write your list directly on the printable, or have it printed at a photo lab and place it in a frame behind glass. You can write with a permanent or wet erase marker directly on the glass and wipe it off with a wet cloth when you’re ready to make a new list.

summerbucketlist

Click HERE to download.

The zip file contains both an 8×10 and 12×18 printable. (I trimmed my 12×18 print slightly to fit into an 11×17 inch frame.)

Happy summer bucket listing!

lindsey

Sound Off!

knowHere at Designer Blogs we LOVE our clients!  We continually say that we have some of the best ones out there.  We love seeing how you use your blogs to communicate your hobbies, grow your businesses, show off your cute kiddos and inspire those around you.

We are always doing our best around here to make it easy for you to show your blog’s content in the best light possible and to give you fresh, fun designs that reflect your personal taste.

Today, we want to hear from you – our beloved clients and readers.  Why do you blog?  What are you looking for in a really great blog design?  What can you absolutely not live without in a blog design?  And really, what about this whole blogging experience just curls your toes with excitement.

We love input from our friends around the blogosphere and love any thoughts on what we can to do make your experience better and your blogs and websites top notch.

So now’s your chance!  We’re excited to hear from YOU!  Drop us a comment and let’s discuss.

March, April & May Giveaway Winners

Giveaway Winners
We have  really dropped the ball with our giveaways over the past few months (we are so sorry!), so we are announcing three winners today to make up for our failure to post them the last three months. Our winners this month for a free WordPress or Blogger template of their choice are:

Bridgett Wynn

Allegra Shortill

Jennifer Zapatka Wright

Congratulations ladies! Please contact us at info@designerblogs.com by the end of May to claim your prize!

Remember you are automatically entered to win our monthly giveaways by following us on Facebook, Google+, Twitter & Pinterest.

The more of our social media sites you follow, the more chances you have to win!

Free May Desktop Backgrounds

db-free-may-desktop-backgrounds-preview

May is absolutely one of my favorite months of the year. The weather starts to get warmer after months of spring showers and all the lovely spring flowers start to bloom. Of course, when spring rolls around, it also means spring cleaning! Here are two free May desktop backgrounds to spruce up your desktop. Hopefully these desktop backgrounds add a little spring loveliness to your desktop this month.

Click here to download.

The zip file contains two 1280×800 png files for your desktop. Please remember that the backgrounds are for personal use only!

Anna

Free Easter Postcards

Since it’s almost Easter, I thought I would share with you several free Easter postcards that are print ready. They come in the standard postcard size (4×6 inches) and are available in three color options – blue, violet and full color.


1

2

3

You can download all versions for free HERE. Remember that they are for personal use only!

Free Easter Postcards

Color Love | Peach and Aqua

Peach-and-Aqua

Image source: The Bride’s Cafe

Spring is here and summer is just around the corner. I love incorporating shades of peach during warmer days. Teamed with aqua, this combination makes a wonderfully sweet and romantic spring to summer palette. It can also be taken through to Autumn, muted with shades of gray and gold. The tones can be used in a vintage fashion or with a modern flare.

Check out these beautiful peach and aqua Blogger templates created by our team of talented designers.

Peach-and-Aqua

Peach-and-Aqua

Peach-and-Aqua

These designs can be purchased in our Blogger Templates shop.

Free Easter & Spring Blog Backgrounds

Freshen up your blog with our free Easter & Spring blog backgrounds. Click on each image for installation instructions. These are for Blogger blogs only. Enjoy!

Tutorial: Adding Pages to Blogger Blog (UPDATED)

Blogger made an update recently to the way that pages are added to blogs. Here is an updated tutorial that will walk you through the new process, step by step.

Adding pages (aka: a navigation bar or menu bar) is a great way to organize your blog to make important information easily accessible to your readers. Designer Blogs offers several types of navigation bars:  a navigation bar with simple text links, a navigation bar with custom buttons, and a navigation bar with drop-down menu (click on links for examples). These navigation bars are customized to give your blog a unique & professional look and can be purchased through our accessories shop.

However, you may just want the basic, non-customized Blogger navigation bar, so today we are sharing a tutorial that explains how to get pages and a basic navigation bar added to your Blogger blog all on your own!

Steps for adding pages to your blog:

Step 1: Log in to the Blogger blog you are wanting to add pages to and click on the “Pages” link.

1

Step 2: Click the “New Page” button.

newpage

Step 3: Type the page title (this will appear as a link on the navigation bar), add the page content and then click “Publish.” Note: make sure the page is published or it will not show on your navigation bar.

3

Step 4: After your pages are published, you need to add the Pages gadget to your layout to make the categories appear on your blog. Go back to “Layout” and click on “Add a Gadget” in the space underneath the header. Note: If you want your navigation bar placed on your sidebar, click on “Add a Gadget” in the sidebar space.

newpage1

Step 5: Choose “Pages” from the list of gadget options.

newpage4

Step 6: Drag and drop your categories to rearrange them in the order you want them to appear and then click “Save.”

newpage5

Adding a web address to your navigation bar:

Step 1: You may want to add some web addresses or links to labels along with your blank pages. Click on the “Pages” gadget and choose “+ Add link page.”

newpage6

Step 2: In the first box, type the title you want to appear in the navigation bar. In the Web address (URL) box, insert the web address you want to link to.  Then click “Save.”

newpage7

Now view your blog to see your new pages and navigation bar!

6

If you’d like to adjust the positioning of the links, follow the below steps.

Step 1: In your dashboard, click on the “Template” link and then click on “Customize.”

7

Step 2: In the Blogger Template Designer click on “Advanced.”

8

 

Step 3: In the “Advanced” tab, scroll down until you find “Add CSS.”

9

 

To add more space to the left side of the navigation bar, add the following code:

.PageList {text-align:left !important; padding-left: 20px; }
.PageList li {display:inline !important; float:none !important; }

You will see a preview of how the design will look with the changes. If you adjust the “20″ to a larger number it will add more space. If you want less space adjust the “20″ to a smaller number.  Adjust it as you want and then click “Apply to Blog” to save the changes.

Example:
10

 

To center the links, add the following code:

.PageList {text-align:center !important; }
.PageList li {display:inline !important; float:none !important; }

You’ll see a preview of the changes. If you are happy with the way it looks, click “Apply to Blog” to save the changes.

Example:

11

For any further customizations you might need made to your navigation bar, you can visit our add-on shop to purchase one of our navigation bar options.

Please feel free to leave a comment or contact us at info@designerblogs.com with any questions you may have.

Free Facebook Cover Images

I am lucky enough to live somewhere where I am starting to see little signs of spring; melting snow, buds on the trees, birds chirping.  I am so excited to be done with snow!  This time of year always has me itching for spring cleaning and sprucing things up.  In that spirit, I am bringing you a few fresh free Facebook cover images to liven up your Facebook page.  Yay!

I’ve made three different covers that you can switch up as often as you like:

post2Spring Green

post3Blush Dots

post4Mint & Navy

Download Here & Enjoy!

emily