Seven Of The Best Image Effects Tips And Tricks For Blogger

Recently we have published some more blogger tips helping you create cool effects with images and pictures used on your blog.While writing the last post showing how to make images fade or blur when hovered over i thought i should list the best effects in one post.So in this post we will look at the best image tips and tricks we have covered in the archive.Not only will we look at effects like the blur effect but also some of the other image and picture tutorials.

You don't need a great knowledge of code to use any of this image tricks and effects and I'm sure there is something for everyone in the list.So in the order of when first posted here are some of the best image effects, tips and tricks for your blog.

Seven Great Image Effects And Tips For Your Blog

1. How To Round The Corners Of Any Image

This post shows how you can easily spice up an image by rounding the corners.The effect is easily achieved with only a few clicks required.

Link : Round The Corners Of Pictures And Images

2. How To Add A Fixed Floating Image To Your Blog

This post shows how you can have a fixed image on your blog.A fixed image is an image that will appear for example in the corner of the page and will stay fixed in place when the page is scrolled.Any image can be used and the image can be a Hyperlink (Clickable link).

Link : Fixed Floating Image Tutorial

3. How To Add An Image Divider Between Your Blog Posts

This post is still very popular and the tutorial is quiet easy.If you want to create some space between posts on your homepage or just add a decorative divider this one is for you.Included are some images you can use as dividers.

Link : Image Divider Between Posts

4. How To Create A Roolover Changing Image Effect

Once again a very popular post that i recently updated and improved.The effect achieved here is awesome yet surprisingly easy.The trick involves two images, when you hover your cursor over the first image it changes to the second image.You really should check out the post to see the preview.


Link : Roolover Changing Image Effect

5. How To Create A Stylish Signature And Place It Below Your Posts

Want to add some style to your blog posts ? Why not sign off with a neat handwritten signature.This post shows the steps required to have you actual signature below your blog posts or pick from hundreds of premade signatures.

Link : Create Signature For Your Blog

6. Image Opacity Blurred Hover Effect

This post show how to add a blurr effect to selected images on your blog.The effect makes images appear blurred but they become clear when you place your cursor over them.

Link : Hover Blurr Effect For Images

7. jQuery Blurred Picture Effect

The tip in this post is almost the opposite to the effect in the post above.While the opacity effect turns images from blurred to clear this effect turns images from clear to blurred.

Link : jQuery Blur Image Effect

So that's just a few of the posts we have published helping you create something different with the images you use on your blog.You can find more in the archive and if you have seen an effect elsewhere and wondered How can i do that ? let me know and maybe we can help.

Drop Your Comments And Questions Below.

Get Your Blog Listed On The Blogger Showcase

Some time back i stumbled across a blog that had been specially set up to showcase the best blogs hosted on Blogger.I decided to submit Spice Up Your Blog as the process was simple and their was no strings attached.Having seen many attempts at similar ventures after submitting my blog i forgot about it and carried on with my business.

However it's been a few months since i submitted Spice and i have been surprised with the results.I'm not one of the bloggers who are constantly checking stats and traffic, let alone checking were the traffic comes from.But every time i do check my Analytics or Hitstats accounts i see a steady flow coming from The Blogger Showcase.

I love to see any attempt by fellow Bloggers to provide an outlet for people to showcase their work.People new to the game can quickly become disenchanted when it comes to getting their blog noticed and many quickly give up.So I'm happy to promote this great site and hopefully help The Blogger Showcase grow as well as help bloggers display their work.

The Blogger Showcase is for Blogger Powered blogs only and lists the latest blogs with screenshots on the homepage.You can also browse blogs by their category or the top rated blogs in each category.



Screenshot Of Blogger Showcase

Remember you can get all these tips sent directly to your email and stay a step ahead.Its a quick and easy service Provided for Free by Google.Just fill in the Email form below the post.If you need extra help on this or any tutorial just leave a comment, I love comments and feedback so this Blog is Do-Follow - when you comment here it helps Your Blogs Google rank !

Here is the link to the site and once there you can use the 'Submit A Blog' link on the right under the header to have your blog listed : The Blogger Showcase

You can find Spice Up Your Blog listed here (Maybe add a review in the comments) : Spice Showcase Page


Browes through some of the blogs listed and you may find some new blogs to follow.Let me know what you think of the Showcase Site.As i said their are lots of similar sites but i think the as The Showcase is for Blogger only it is a great way to get exposure for your Blogger blog.

How To Add An Exploding Fireworks Effect To Your Blog

In today's post we are going to have a look at a very cool Fireworks effect you can add to your blog.The effect looks like exploding fireworks falling down all the pages of your blog.Last Christmas i published a post showing how to add a snowfall effect to blogs, the post was hugely popular so In January i followed up with a Falling flower effect that showed how to have three different types of flowers falling gently down your blog, once again a very popular post.So it's about time i added another tutorial with a new effect.

I choose to go with a firework effect because it looks great and whether you want the effect on your blog permanently or just for occasions like maybe your birthday or July 4th or Halloween the Exploding fireworks effect is easily added and just as easily removed.

Once again i have tried to create a effect that will add to your blogs appearance without effecting or obstructing the reader.The image used should not block the text or images on your blog.Of course you will want to see how the fireworks effect looks on a blog so i have a preview or demo set up for you to have a look.

Update - This post has been updated July 2012.I have had trouble seeing the fireworks in Firefox, let me know your expirence.

Demo Of Fireworks Effect

Here's the link : Fireworks effect demo

So lets look at the steps required to add the fireworks effect to your blog.

Add Exploding Fireworks To Your Blog

We have two types of fireworks to add.


Fireworks 1.

Screenshot



Add To Your Blog

Fireworks 2.

Screenshot



Add To Your Blog

Once you have saved the gadget you can move it to the bottom of your page.

Drop Your Comments And Questions Below.

Add Opacity Blur Effect To All Images On Your Blog With jQuery

Back in February i published a popular Blog Tip how to use an opacity or blurred effect with images on your blog.In the post i showed you how to add some code to your template and images which resulted in images being blurred until you placed your cursor over them.So i thought maybe some of you would like to have the effect but the other way around.In this post i will show you how to have all the images on your blog clear but they will blur when your place your cursor over them.This time the blurred image effect is achieved using jQuery so there is only a small piece of code needed.

Remember while the original Opacity effect could be used on selected images this effect will be on all images within your blog.Heres how it's done..

jQuery Blurred Image Effect

Step 1. In you dashboard click 'Layout' > 'Edit Html'

Step 2. Find the following piece of code in your blogs Html :
(Click Ctrl and F for a search bar to help find the code - More Info)

Step 3. Copy and paste the following code Directly Before / Above

With the code in place you can now save your template and check out the cool new image effect on your blog.

If you want to check out the original post with the opposite opacity effect here is the link : How To Use An Opacity Blurred Hover Effect On Images And Pictures

Drop Your Comments And Questions Below.

How To Show Post Titles Only On Your Blogs Homepage

One of the most popular Blogger tips ever was the 'Read More' or 'Post Summary's' hack.Before Blogger made the read more function standard you had to add a large amount of code to your template to achieve the effect of having only the first paragraph displayed on the homepage with a link to read the full post.The trick i will show you in this post goes a step further and only displays the post title on the home page which can be clicked to lead to the full post.You could show 20-30 posts on your homepage and they will appear like a recent posts list.This is a very useful trick and quiet easy to implement.By displaying only the post titles on your blogs home page you can have more posts listed, make the page load time faster and make your blog easier to navigate for readers.

Also Blogger have controversially started 'Auto Pagination' which limits the amount of content you can have on your home page.Unless you have a lot of full posts on your homepage you should not be effected but it's worth noting.I'm currently using this format on another blog and it fits perfect with the topic and theme of the blog.Only a small piece of code needs to be added to your template so lets walk through the steps.



Post Titles Only On Homepage

Step 1. In your dashboard click 'Layout' > 'Edit Html' > Tick the 'Expand Widget Templates' Box :

Step 2. Find the following code in your blogs Html :
(Click Ctrl and for a search bar to find the code - More Info)

Step 3. Replace the code you found with the following code :

Step 4. Save Your Template.

Remember you can get all these tips sent directly to your email and stay a step ahead.Its a quick and easy service Provided for Free by Google.Just fill in the Email form below the post.If you need extra help on this or any tutorial just leave a comment, I love comments and feedback so this Blog is Do-Follow - when you comment here it helps Your Blogs Google rank !

Once you template is saved you can check out your new style homepage.If your not happy with the post titles only style you can easily reverse the change.

Lets us know if your using this new format, the read more format or listing full posts on your homepage.

Fix The Sharing Is Caring / Sexy Photobucket Images

Having been away from my computer for a few days i have returned to see the images i provided for different tutorials via Photobucket have been replaced with the dreaded 'Exceeded Bandwidth' Image.Apologies to anyone that was effected, i try to host as many images as possible within Blogger as they do not have a limit (Not one we are likely to reach anyway).I am in the process of moving the photobucket images to other hosting options so the problem will soon be solved although you will have to replace the image code you have used from some tutorials.

Update 18 October 2010 - We have recently added the instructions for using the latest improved version of this gadget on your blog.Check out Version 2 of the Sexy Bookmarks here - New Version Share The Love Sexy Bookmarks For Blogger

The most comments received regarding this issue were on the Sharing is caring and Sharing is sexy social bookmarking gadgets.In both those posts i have updated the code and replaced the images with images hosted in Tinypic.com and both are now working fine.If you removed the gadgets because of the problem you can now reinstall them, if you still have the gadgets in place with the broken image here is how to quickly fix the problem.


Replace Broken Photobucket Images In Sharing Gadget

Step 1. In you dashboard click 'Layout' > Edit Html' > Tick the 'Expand Widget Templates' box :

Step 2. Find the following piece of code in your blogs Html :
(Click Ctrl and F for a search Box to help find the code - More Info)

http://i941.photobucket.com/albums/ad259/spiceupyourblog/sexybookmarksbuttons.png

Step 3. Replace the code you found above with this code :

http://i44.tinypic.com/1znbj83.png%27

Save your template and your social bookmarking gadget will look and work perfect again.

Remember you can get all these tips sent directly to your email and stay a step ahead.Its a quick and easy service Provided for Free by Google.Just fill in the Email form below the post.If you need extra help on this or any tutorial just leave a comment, I love comments and feedback so this Blog is Do-Follow - when you comment here it helps Your Blogs Google rank !

Help Fix All Broken Links

If you notice any images within Spice Up Your Blog with the same error please leave a comment to let me know.And a Big thanks to those who commented and contacted me to inform me of the problem already - You guys Rock ! (Photobucket Suck)

P.S. If you also think Photobucket suck you can add you opinion to this forum of fellow photobucket haters :) http://amplicate.com/sucks/photobucket

View Versions Of Your Blog From The Past

Yesterday i removed a sidebar gadget from this blog accidentally, a little silly but it can happen.I'm sure a lot of bloggers have had that "Oh No" moment when they mistakenly removed something.I no longer had the code for the gadget yet within a few minutes i had the gadget back in place.

How ?

The way i managed to get the code back for the gadget was using "Google Cached Pages".

Every time Google crawl your blog they store a version of your blog at the time they visited.This is true for every individual post on your blog also and you can see your blog on the date they last crawled very easily.The version Google provide of your blog when they visited is called "Cached" and i simply went to the cached page were the gadget was still in place, viewed the source, grabbed the code and added it again.

In this post i will show you how to view cached web pages and how to view the code that makes up any page on the web.

How To See Cached Pages

Presuming your blog is not brand new and Google have crawled and indexed it you should be able to access a cached version.

Lets look at the example of this blog - if you search Google for "Spice Up Your Blog" (Click Here To See The Google Results) you will get this :

Below the results circled in red you can see the cached option :

When you go to the cached page you will see a information header stating when the page was captured :

For more information on cached pages use this link to go to Google explanation : Catched pages

How Often Will Your Blog Be Cached

Because Spice Up Your Blog is well established it is crawled very often by Google the cached version is updated most days, You may find your blogs cached version is updated weekly, either way its good to know the option is there and it may come in very useful as it did for me yesterday.

Remember you can get all these tips sent directly to your email and stay a step ahead.Its a quick and easy service Provided for Free by Google.Just fill in the Email form below the post.If you need extra help on this or any tutorial just leave a comment, I love comments and feedback so this Blog is Do-Follow - when you comment here it helps Your Blogs Google rank !

How to get code from a cached page

As i said above i managed to retrieve the code for a gadget from the cached page so how do we get code from a web page ? This is a little difficult to follow for a beginner but you can get the hang of it.

You can in fact get the code that makes up Any page on the Internet.Once on a web page click the 'View' button at the top of your browser and then click 'View Source' (May differ depending on your browser).You will then be presented with a document containing the code that makes up that page :

You can use 'Ctrl and F' for a search bar to find the exact code you are looking for in the document.

You may not need to get a cached version of your blog or any web page today, you probably wont need to see the source of a web page at the moment but I'm certain this information will come in very useful in the future.

If you have any additional questions or have something to add just leave a comment and i will do my best to help !

New Blogger Template Gallery - Get The Latest And Best Blogger Templates

All us Bloggers love to see the latest Blogger templates and themes and the new Spice Up Your Blog template gallery has arrived making sure you don't miss any great templates.I have been using the same template on Spice Up Your Blog for almost a year but that has not stopped me checking out the newest releases, in a way it's like window shopping.So if your on the look out for a new template to spice your blog or like me just love browsing, the template gallery will make it easier than ever to see whats happening.

Their are now more Blogger template designers than ever and they are creating better templates than ever.With the Blogger template gallery i will be keeping up to date with the latest creations from all the designers and bringing their templates to you all in the one place.If your a template designer i have yet to meet you can even submit your templates and get some great exposure.



How To Get To The Template Gallery

The Spice Up Your Blog Template Gallery Is A Separate Blog Using A Separate Domain called a Sub domain :

www.Templates.SpiceUpYourBlog.Com

As the template Gallery is a separate blog to keep updated with the latest posts and Newest templates you will need to subscribe to the feed and follow the friend connect even if you already follow or subscribe to Spice Up Your Blog.You will find the follow and Rss subscription in the side bar of the template gallery.

The Latest Blogger Templates

The Spice up your blog template gallery will be updated daily with the latest templates and some of the great templates you may have missed.Included in each post will be a demo, download link, screen shot, link to the original designers page, link to video instructions for using custom templates and more.

I created the template gallery a few weeks back but wanted to have a good selection of templates added before informing the great readers and followers of Spice.I look forward to adding lots more templates and of course adding lots more great tips and tricks here on spice up your blog.

How To Make Your Own Sub Domain

As i pointed out above the template gallery URL is a sub domain of www.spiceupyourblog.com and you can see how to create a sub domain in this post : Blogger Custom Domains - How To Create A Sub Domain

Let me know what you think of the template Gallery and any suggestions you may have, Thanks !

Change The Width Of The Google Search Bar On Your Blog

Once again this post was suggested by a reader asking how i managed to get the very wide Google Search bar below the posts on Spice Up Your Blog.The search bar in question is above the comments on every post and i have made a slight change to the code to make the bar stretch across the lenght of the posting area.First if you are not sure how to get the standard Google search box for your blog check out this post - Google Search Bar For Blogs or if you have an AdSense account you will find details in that account.



Change The Width Of Google Search Bar

Once you get the code for your search box you can add it to your sidebar or anywhere in your template.To change the width you simply change the input size.So look through the search bar code until you find this snippet :

size="31" />

Now change the size from 31 as it is above to the size you require.The search bar i use below the posts uses the size 62 :

size="62" />

You can play around with the sizes until you find what your looking for.

Important : While it is OK to change the width of the Google search bar do not ever change any code for AdSense ad units as it is against the AdSense T.O.S.

Just a nice quick tip if you need more help just ask.

Should You Use Traffic Exchanges To Promote Your Blog ?

I recently received an Email from a reader telling me they were using traffic exchanges to get new readers to their blog.In the Email they went on to say most of their traffic came from traffic exchanges so they felt it was quiet successful.Having previously been involved in affiliate marketing and having run a very successful blog on affiliate marketing I'm very familiar with traffic exchanges.

Traffic exchanges are one of the top forms of promotion for affiliate marketers so i have seen the pros and cons involved.In this post i will give you a brief outline of the pros and cons but before you even consider using a traffic exchange their is one major factor that you must recognise.If you use AdSense on your blog using traffic exchanges will get you banned, The use of any traffic exchange is strictly banned by AdSense.



What Are Traffic Exchanges ?

The idea behind a traffic exchange is quiet clever at first look.You open an account with a traffic exchange website like Traffic Swarm and submit the URL address of your blog with a short description.Now you click a Surf Websites button.Once you click the button you are brought to a website which you must stay on for 15 seconds, after the 15 seconds you click Surf Websites and go to another website for 15 seconds and so on...

Lets say for example you surf through 20 websites, then 20 other people who log on just like you did will go to your website for 15 seconds.This is all controlled by a credits system, when you visit another site you earn credits and when another user visits your site you loose credits.

Pros And Cons

I hope i got the idea of how it works across and it does look foolproof but like everything there is more than meets the eye.

*You can not use AdSense on your blog if you use traffic exchanges
*Most traffic exchange surfers open the traffic exchange in a new window so don't even look at the sites they are surfing
*You are not getting a target audience - Most of the traffic will not be interested in your blogs subject
*Premium members are given extreme preference - Premium members who pay a monthly fee get free credits and the best traffic with a longer timer
*The traffic is not real - The traffic you receive is only on your blog to get credits.The rate of return visitors will be almost zero with the time spent on your blog rarely passing the 15 seconds.
*As you can be sent to any website there is a danger of being sent to a website that could infect your computer.

As you can see i am totally against the use of traffic exchanges and not trying to hide it.I had some success with them when they were new and exciting but they have run their course.You will get traffic but it will be useless traffic and you will have to waste hours building credits, time that could be spent improving your blog or working on S.E.O. and other blog promotion methods.

What Are The Options

If you would like to check out some of the traffic exchange sites here are a few of the most popular.
(Note you can build credits from affiliate links - These are NOT affiliate links)

Traffic Swarm
Smiley Traffic
EasyHits4u

Remember you can get all these tips sent directly to your email and stay a step ahead.Its a quick and easy service Provided for Free by Google.Just fill in the Email form below the post.If you need extra help on this or any tutorial just leave a comment, I love comments and feedback so this Blog is Do-Follow - when you comment here it helps Your Blogs Google rank !

This was probably not the most fair post i have published as it's very one sided.But blogging is about opinions and in my opinion using traffic exchanges to promote your blog is an absolute waste of time.They can still have limited success for affiliate marketing but even that is diminishing.

Do you use traffic exchanges ?

Have you a different opinion on traffic exchanges ?

Do you want more info on the subject ?

Let Us Know...