Mostrando postagens com marcador featured. Mostrar todas as postagens
Mostrando postagens com marcador featured. Mostrar todas as postagens

quinta-feira, 14 de abril de 2011

Professional Blog Design Service Expands With Exciting New Offers

Over the last year i have been offering my services to work on your Blogs.The response has been amazing and i have had a lot of fun working on Blogs with Bloggers from all around the world.It has also been great to get such positive feedback and lets be honest I'm getting paid and an extra few bucks in the pocket is always nice.I have took on all sorts of projects from quick customizations to full blog makeovers and now i am excited to offer even more.

From today i am expanding the services offered to include some new and exciting options.

I have in the past had to sometimes refuse some work due to a simple lack of time but i have acquired the help of my Good Friend, Fellow Blogger and Design Genius Dasari Harish.Most of you will have seen the Awesome post he wrote on Spice Up Your Blog recently - Animated Flying Twitter Bird For Blogger.

Then There Were Two


I have been working with Harish on a number of things over the last few months and now together we can work to really Spice Up Your Blogs.Harish like myself specializes in Blogger design and he is also an Expert in all the latest web design coding including jQuery, Css3, Html5 and All the stuff that makes your blog beautiful without slowing it down.

Among other things have worked on the very advanced comment section you can now see on Spice Up Your Blog (Details On How You Can Get It Below) and the cool effect you see on the BuySellAdds banners at the top of the sidebar and header here (Fellow BSA Users Can Look Out For Upcoming Tutorial On This).

With Harish on board we can now take on almost any project and we have a few things in mind also.First as i said i have received amazing feedback over the last year here are a few samples..

What They Said (Thanks Guys) !

"...Service was quick and efficient...Definitely recommended - Annabel @ DizzyFunctional..."

"Paul, The work you did on my Blogger site is stunning....I would have scrapped the whole site if it wasn't for you. Now I have a professional, clean and functional blog - Lisa Drubec @ The Friendly Blogger "

"With your quick replies to emails and excellent explanations the process was very smooth even though we are on different sides of the globe - David @ My VST Charts "

"You did so quickly, and in a professional and creative manner. I felt you really understood what I was looking for. I would recommend you to anyone looking to "Spice Up" their blog - Emily Hanlon @ Fiction Writing, The Passionate Journey"

"When I first contacted Paul to redesign my blog, I gave him very specific instructions on the content and overall appearance.Not only did he follow through on my specifications, but he also added in his own touch on things I hadn't even considered that improved the quality of my site- Matty @ Matty Thoughts"

"I was having some major issues with blogger and you fixed those in a very short time. Then I decided to totally redo the blog and I love it! You were extremely fast and very helpful. Your prices are wonderful too - Joan @ Joan's Gardens"

What They Wrote (Thanks Again Guys)


New Look On Joan's Gardens

Blogs To Help You Blog Better

Need A Website Makeover ?

New Services And Specials


I am now confident there is nothing within reason (We cant get blogs to make coffee) we cant provide, So Go crazy or go simple or let us get creative.

Here are two new services starting with the much commented on comment section just added here on Spice Up Your blog.

Special - The Ultimate Blogger Comments Section ! : Have an Awesome comments section on your blog.Features include - Wordpress Advanced Style with Comment Avatars, Color coded Name and date line, Authors Comments (Comments You Write) use different color name and date line, different shade background and Animated Admin Sticker (Can use different Image such as signature).Default image (You Choose) For Commenter's with no avatar, Reply Button Or Link Is Optional.See them in action here - Ultimate Blogger Comments Section.5 Styles To Choose From And You choose the colors and images we create and install.

Wordpress Template Conversion - Seen a Wordpress template you just Love and want to use it on Your Blogger Blog ? No Problem, we will convert the template to Blogger and Upload it onto your blog.This will be a top quality job, many Wordpress conversions are rushed half hearted jobs that do not work properly on Blogger.

Full Pack - This is a complete Blog Makeover Not only Design, Template, SEO, Social Media, Gadgets and more but also advice on best practice for your particular blog.The work does not stop until your happy and i am on hand even after the job has finished to answer any questions.Resources such as screen capture video are used to communicate and make the process as easy as possible.

You can see more offers and a price list on the Hire Us Page and remember these are just suggestions, tell us what YOU want.

Professional Blogger Design - Hire Us Page

Comments And Questions Below.

Professional Blog Design Service Expands With Exciting New Offers

Over the last year i have been offering my services to work on your Blogs.The response has been amazing and i have had a lot of fun working on Blogs with Bloggers from all around the world.It has also been great to get such positive feedback and lets be honest I'm getting paid and an extra few bucks in the pocket is always nice.I have took on all sorts of projects from quick customizations to full blog makeovers and now i am excited to offer even more.

From today i am expanding the services offered to include some new and exciting options.

I have in the past had to sometimes refuse some work due to a simple lack of time but i have acquired the help of my Good Friend, Fellow Blogger and Design Genius Dasari Harish.Most of you will have seen the Awesome post he wrote on Spice Up Your Blog recently - Animated Flying Twitter Bird For Blogger.

Then There Were Two


I have been working with Harish on a number of things over the last few months and now together we can work to really Spice Up Your Blogs.Harish like myself specializes in Blogger design and he is also an Expert in all the latest web design coding including jQuery, Css3, Html5 and All the stuff that makes your blog beautiful without slowing it down.

Among other things have worked on the very advanced comment section you can now see on Spice Up Your Blog (Details On How You Can Get It Below) and the cool effect you see on the BuySellAdds banners at the top of the sidebar and header here (Fellow BSA Users Can Look Out For Upcoming Tutorial On This).

With Harish on board we can now take on almost any project and we have a few things in mind also.First as i said i have received amazing feedback over the last year here are a few samples..

What They Said (Thanks Guys) !

"...Service was quick and efficient...Definitely recommended - Annabel @ DizzyFunctional..."

"Paul, The work you did on my Blogger site is stunning....I would have scrapped the whole site if it wasn't for you. Now I have a professional, clean and functional blog - Lisa Drubec @ The Friendly Blogger "

"With your quick replies to emails and excellent explanations the process was very smooth even though we are on different sides of the globe - David @ My VST Charts "

"You did so quickly, and in a professional and creative manner. I felt you really understood what I was looking for. I would recommend you to anyone looking to "Spice Up" their blog - Emily Hanlon @ Fiction Writing, The Passionate Journey"

"When I first contacted Paul to redesign my blog, I gave him very specific instructions on the content and overall appearance.Not only did he follow through on my specifications, but he also added in his own touch on things I hadn't even considered that improved the quality of my site- Matty @ Matty Thoughts"

"I was having some major issues with blogger and you fixed those in a very short time. Then I decided to totally redo the blog and I love it! You were extremely fast and very helpful. Your prices are wonderful too - Joan @ Joan's Gardens"

What They Wrote (Thanks Again Guys)


New Look On Joan's Gardens

Blogs To Help You Blog Better

Need A Website Makeover ?

New Services And Specials


I am now confident there is nothing within reason (We cant get blogs to make coffee) we cant provide, So Go crazy or go simple or let us get creative.

Here are two new services starting with the much commented on comment section just added here on Spice Up Your blog.

Special - The Ultimate Blogger Comments Section ! : Have an Awesome comments section on your blog.Features include - Wordpress Advanced Style with Comment Avatars, Color coded Name and date line, Authors Comments (Comments You Write) use different color name and date line, different shade background and Animated Admin Sticker (Can use different Image such as signature).Default image (You Choose) For Commenter's with no avatar, Reply Button Or Link Is Optional.See them in action here - Ultimate Blogger Comments Section.5 Styles To Choose From And You choose the colors and images we create and install.

Wordpress Template Conversion - Seen a Wordpress template you just Love and want to use it on Your Blogger Blog ? No Problem, we will convert the template to Blogger and Upload it onto your blog.This will be a top quality job, many Wordpress conversions are rushed half hearted jobs that do not work properly on Blogger.

Full Pack - This is a complete Blog Makeover Not only Design, Template, SEO, Social Media, Gadgets and more but also advice on best practice for your particular blog.The work does not stop until your happy and i am on hand even after the job has finished to answer any questions.Resources such as screen capture video are used to communicate and make the process as easy as possible.

You can see more offers and a price list on the Hire Us Page and remember these are just suggestions, tell us what YOU want.

Professional Blogger Design - Hire Us Page

Comments And Questions Below.

segunda-feira, 28 de março de 2011

How to Create a Blogging Community

create blogger community
Guest Post - By Kitty Holman.

When we blog, we must try to create a thriving blogging community. In other words, it's important that we can access a network of like-minded bloggers who can help us if we need help and vice versa. In this case, blogging then becomes more than simply writing and publishing on our own blogs; instead, it becomes an activity that allows you and other bloggers to join together into a community of voices. Once this happens, you can really see how powerful blogging truly is.

But how do you create this thriving community? Follow these tips to see if you get any ideas.
Click Here To View Full Post >>

domingo, 27 de março de 2011

Beautiful Animated Hover Effect Captions For Images On Blogger

Css3 Blogger Tutorial
In this post we have not only an amazing effect you can add to the images you use in your blog posts but it's amazingly simple and amazingly fast so wont slow down you page load time.The effect is similar to what you will see on many Featured Posts Gadgets, when you hover your cursor over the image a caption scrolls up from the bottom with your selected text.

So, you can have the title of the image, a description, date taken, credit or anything you like.The code we will use has No Javascript this ensures it will load fast and as i said not slow down your blog.The code is all Css3 (Don't Worry I Will Keep It Simple) so you have a flowing and transparent effect with the caption.There is also a stylish Shadow edge around the image On-Hover.
Click Here To View Full Post >>

quarta-feira, 2 de março de 2011

Blogger Stylish Hover Effect Thumbnails Only Related Posts

Blogger Related Posts GadgetBack in December i published a post showing you a great Related Posts with thumbnails gadget.That gadget displayed a selected number of related posts generated using labels, the posts are displayed using a thumbnail with the title of the post below.That post has been one of the most popular on Spice Up Your Blog over the last few months and today i have another Related Posts With Thumbnails Gadget but with a very cool feature.

I found this gadget in a template i published on my Templates Blog BestBloggerTemplates.Net and knew it would be popular.This Related Posts gadget does not display the title of the post below the Thumbnail but rather has a Hover Effect to display the post title.So below your posts will be just the thumbnails but when you hover your cursor over them the thumbnail is replaced by the title.

Hmmm not easy to explain in text so take a look at the screenshots and live demo below.
Click Here To View Full Post >>

segunda-feira, 31 de janeiro de 2011

Why You Shouldn't Sell Text Links On Your Blog

dont sell text links
As your blog grows and becomes more popular, along with the benefits of increased traffic and depending on the nature of you blog increased AdSense earnings or sales comes some dilemmas.People will want to try take advantage of your success in a number of ways.One way unscrupulous marketers may try to take advantage of an Unwary blogger is an approach with an interest in buying a text link within a post.

A text link or hyper link is the name given to links you probably add to all your posts.If you write a post about Spice Up Your Blog you might add a link to Spice Up Your Blog within the post.These links help the site you link to in a number of ways, as we have previously covered Google follow links so if you add a link to this blog Google will follow that link and crawl this blog.Google also use links to determine the importance of a site, the more links Google find to Spice Up Your Blog the more importance they credit to it, basic SEO.
Click Here To View Full Post >>

segunda-feira, 10 de janeiro de 2011

Anatomy Of An Engaging Blog Post

Guest Post By : Edward Stern.

A blog post, at its best, is a carefully constructed body of work where each of its parts work together to convey information that is attention-grabbing, entertaining, and enticing—a good post bodes well for the blog as a whole and keeps new readers coming back for more. Constructing a successful blog post does not require surgeon-like precision, but it does demand an understanding of what parts are needed to create a functioning beauty rather than a revolting Frankenstein.

A concise, clever headline


As the very first element readers lay eyes on, the post headlines needs to be concise, but also instantly attention-grabbing. It also needs to be reflective of the content below. Play around with headlines, and don't be afraid to keep a post in the “drafts” folder until you come up with a better one. The best headlines will contain SEO keywords so that the post will rank highly in search engine results, thus driving more traffic to your blog.

Scannable content


If a reader sees a lengthy, college-level dissertation before them, they will lose interest before even giving the post a second thought. Blog readers have short attention spans and want short, bite-sized paragraphs for easy scanning to extract the information they need. The body of your blog post should be succinct; cut the fat by using concise, short paragraphs and by deleting any tangents or extraneous information.

Pictures and videos


Use images to complement your words. Blogging is a visual media, so incorporate pictures and videos as applicable to bolster your writing and provide the reader with a total sensory experience. However, don't go crazy on visual content to the point that it detracts from your content, and don't include pictures and videos just for the sake of having them. Again: no fat; use only what is necessary.

Writing void of spelling and grammar errors


Though blogging is a different kind of writing than, say, academic writing, it should still be proofread and free of mistakes. Spelling and grammar errors make a blog post look rushed, the writer look unskilled, and the content undeserving of consideration. Don't turn off readers by making easily avoidable mistakes.

Use tags and categories to your advantage


To attract readers to past posts, create categories that tie in with your blog content and that you will use frequently. Tags do the same thing but will also show up in SEO searches. If a reader likes a post with a particular tag, they’ll be likely to check out more posts with the same tag.

Keep it interesting, unique, and personable


The heart of any blog post is what makes it unique, what makes it something that cannot be found elsewhere and what will keep the reader coming back for more. Find a niche (whether it’s cooking or creative writing), and write with passion.



guest blog postBy Guest Author - Edward Stern is a guest blogger for My Dog Ate My Blog and a writer on online colleges for the Guide to Online Schools.




Comments, Views And Questions Are Invited Below.

sexta-feira, 7 de janeiro de 2011

Using SEO Keywords For More Google Search Traffic

keywords seo bloggerIn some of the more recent posts i have been looking at Search Engine Optimization (SEO) and making your blog better equipped for Search Engines.Google and the other leading search engines want to find and index your blog and have become very advanced at their methods but there is lots you can do to help them help you.As i mentioned before many of the blogs i visit are very poorly set up for SEO.I'm not talking about any advanced techie stuff that could go straight over your head but just basic steps anyone can take.

When you first look into Search Engine Optimization one of the terms you will constantly meet is 'Key Words'.Key Words are something all bloggers should get to grips with and try to understand.Implementing key words into your blog can have a huge effect in the performance of your blog on Google and other search engines.This also rings true when it comes to the performance of individual posts.Explaining Keywords without putting you to sleep can prove hard, the first draft of this post read like a book so here is the shortened version !

So lets start with a simple question.

What Are Keywords ?


Simply Speaking Keywords are words people type into search engines when they want to find something.

If i want a new laptop i might go to Google and type "Cheap Laptops" this is a keyword.Or if i want to improve my typing to speed up my blogging i would type "Improve My Typing Skills" this is also a keyword.

You will notice that i called each a keyword even though there are a number of words.This is just the term used, although "Improve My Typing Skills" has four words it is generally known as a single keyword.You will also hear it referred to as a "key phrase" which i think makes more sense but then i don't make the rules.

So your job is to find keywords related to your blog and individual posts that people search for.However while it would be great to rank on the first page of Google for the main keywords related to your blog the competition will be huge.It is almost imposable to make your health blog rank high for "health tips", or make your cookery blog rank high for "cookery tips" and so on.The competition for the most popular keywords is just too fierce.

Long Tail Keywords


This is where long tail keywords come into play.Long Tail keywords are longer keywords that are not as popular but are also not as competitive.Your cookery blog cold rank first for "Simple Sunday Lunch Cookery Tips", or your health blog could rank first for "New Alternative Cures For Teen Acne".

If you can find good long tail keywords related to your blog you can generate great search traffic with little competition.

Keyword Tools


You may be thinking how do i know what keywords are popular ? Well there are a number of tools that can help.Tools like the Google Keyword generator will generate a list of keywords that people have been searching for.When you type in a Popular keyword such as Cheap Laptops they will show you related long tail keywords and how popular the are.

Another neat tool is Word tracker, it works similar to the Google keyword tool.The free version will quickly generate pages of keyword suggestions.

Adding Keywords To Your Blog


When you write a post you add the keywords you generated.It is important the keywords fit with the content and are not 'Stuffed' in.Try to add the chosen keywords a few times depending on the length of the post in question.Now, it is also great if you can add your keyword or parts of the keyword to the title of the post.

If this seems like a bit too much work you can just keep keywords in mind as you blog.Simply adding some level of keywords to your posts will have a positive effect.So the next post you write if you want research the keywords you use or add some you think will work, make sure you help Google and other Search Engines help you ! Check out more of our Blogger SEO posts.

Drop Your Comments, Views And Questions Below.

quarta-feira, 29 de dezembro de 2010

Best SEO Tips And 150 Free Backlinks Every Day

You may be surprised to learn that i read a lot of blogs that are not tech or design related.I often find myself on personal blogs, cookery blogs, activity blogs and all sorts of general fun well written blogs.There are now millions of Blogs online and among the rubbish, spam and uncountable "Tried it for 3 months and quit" efforts are some real gems.I often follow a link from a comment on Spice Up Your Blog to see the blogs of people that leave a comment or if I'm really bored and have 10 minutes to spare i have found myself clicking the Blogger 'Next Blog' link in the navbar.As i adventure through these blogs the one thing that Screams Out is how poorly they are set up for SEO (Search Engine Optimization).Some of the best blogs i have found are so poorly set up for SEO that you could put Sherlock Holmes on the back of the Google Spider and he wouldn't find them.

I'm currently working on a Complete Blogger Ebook that i hope to release in 2011 and among the content will be lots of SEO advice.But i have already published many tips to help get your blog performing much much better on Google and the other search engines.In this post i will point you in the direction of these posts and also share you will a service i have been using for a few months that automatically generates back links to your blog Absolutely Free.

Backlinks are vital when it comes to SEO, every link to your blog is seen almost like a recommendation in the eyes of Google.I go deeper into this subject in possibly my most in dept post on SEO - Use Do Follow Blogs For Back Links And Page Rank.Other posts you Must check out to improve your blog in search include :

- Add Meta Tags And Description To Your Blog

- Submit Two Sitemaps Of Your Blog To Google

- Submit A Sitemap To Yahoo, Bing And Ask Search Engines


You can find more SEO tips in our SEO Tips Category Pages.I plan on focusing on more SEO tips in the upcoming posts.Now to creating a genuine 150 links to your blog every day.

Free Automatic Backlinks With ImAutomator


Note this site is no longer free, as of Janurary 2012 there is a minimum fee of $2.99.In my opinion this was a great free service but i personally would not pay for it.Thats just my opinion it's up to you.

IMautomator is a Bookmark submission tool that automatically submits your blog posts to various Bookmarking websites.With a free account you can add 10 Links every day, these ten links are submitted to 15 Bookmark directory's (10x15=150 easy math even for me).I have personally used the service and it works a treat.The sites it bookmarks on are not the most popular or highest PR but it takes seconds and is totally free.There is a paid option but you never need to avail of this.

-Follow this link (Not a referral link) to Imautomator and set up your free account.

-Once you have verified your account you can get to work.Log in and via the Bookmark submitter you can add links to be submitted (See Video Below).

What Should You Submit ?

First up there is the obvious links, your blogs home page and your posts with ten a day you could start adding your archive.Why not add you label pages ? Every label you have on your blog has it's own page.Basically you can add any URL connected to your blog including Bookmarking Bookmarks ! If you Bookmark your blog on Digg add the Digg URL.You should also take a look at the Top 20 Do Follow Bookmarking Websites.

That's it look out for more SEO tips and the Blogger Ebook (Don't Hold Your Breath Until About Mid Summer).Remember no matter how intelligent Google crawlers become you will always have to help them help you !

ImAutomation Intro Video



Check out more of our Blogger SEO posts.

Add Your Comments, Views And Questions Below.

domingo, 19 de dezembro de 2010

New Blogger Related Posts With Thumbnails Below All Posts

We all know the importance of Displaying Related Posts below each post on your blog.Displaying a list of Related Posts not only keeps readers on your blog clicking through your archive but they are also crawled by search engines.But to get readers clicking through the related posts you need them to be eye catching and that's where the related posts with thumbnails works so well.The related posts with thumbnails lists a selected number of posts and also grabs an image from each posts to display.The gadget we have in this post is similar to the popular Link Within Related posts but with some great extra features and options.

I have re sized the thumbnail and title so you can display more posts.Link Within Limits you to 5 posts with this gadget you can show as many as you like.This related posts gadget displays related posts using the labels, so it will list posts with the same labels as the posts it is below.You can add some extra customizations to this gadget and i will list them below the tutorial.

Screenshot 

blogger related posts

Live Demo - You can see this gadget below all posts on this blog.

Add The new Blogger Related Posts To Your Blog


Step 1. In your Blogger Dashboard Click > Design > 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 bar to help find the code - More Info)

</head>

Step 3. Copy And Paste The Following Code Directly Above / Before </head>

<!--Start Related Posts Script From http://www.spiceupyourblog.com-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
#related-posts {
float:center;
text-transform:none;
height:100%;
min-height:100%;
padding-top:5px;
padding-left:5px;
}

#related-posts h2{
font-size: 1.6em;
font-weight: bold;
color: black;
font-family: Georgia, &#8220;Times New Roman&#8221;, Times, serif;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
color:black;
}
#related-posts a:hover{
color:black;
}

#related-posts a:hover {
background-color:#d4eaf2;
}
</style>
<script type='text/javascript'>
var defaultnoimage=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMx6MByGLjeG2IaGIFlUqK2za9UfOcJ72O_cG3ZzUoLYEv4oiIFgZslV0sr4RWZZINOnixMlFMcgwjwRNDvk4uE9WwcJt2MTNkK7z5w2m4mTqXdM_dHbLYKDRbxl2dM65_v4-7h6AEN0rJ/s1600/No+Image.jpg&quot;;
var maxresults=7;
var splittercolor=&quot;#d4eaf2&quot;;
var relatedpoststitle=&quot;Related Posts&quot;;
</script>
<script src='http://yourjavascript.com/22811210832/RelatedPoststhumb3.txt.js' type='text/javascript'/>
</b:if>
<!--End Related Post From http://www.spiceupyourblog.com-->

Note - Change maxresults=7 in red above to the number of posts you want displayed.If the script can not find enough posts with the same label it will display as many as it finds.If you are comfortable making changes you can change the colors using a Hex Color Chart.

 Note 2 - You can change the title above the gadget, it is currently Related Posts.Simply Change the text In blue above.

Step 4. Now 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)

<div class='post-footer'>

Note - If you cant find that find and use <data:post.body/>

Step 5. Copy And Paste The Following Code Directly Below Under <div class='post-footer'>

<!-- start related posts-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != &quot;true&quot;'>
</b:if>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=6&quot;' type='text/javascript'/></b:loop>
<script type='text/javascript'>
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs(&quot;<data:post.url/>&quot;);
</script>
</div><br/><a href='http://www.spiceupyourblog.com/2010/12/related-posts-thumbnails-below-posts.html' target='_blank'><font color='#ccc' size='small'>Best Blogger Gadgets</font></a><div style='clear:both'/>
</b:if>
<!-- end related posts-->

Everything in the right place ? Cool save your template and check out your Blogger Related Posts With Thumbnails.Make sure to check out more of our Blogger Gadgets and Design Tips.

Leave Your Comments, Views And Questions Below.

quinta-feira, 16 de dezembro de 2010

New Script Add Images And Colored Text To Blogger Comments

images in blogger commentsIn this post Macro Raman shares a fantastic script he created that allows people for the first time to add images, different color text and scrolling text to comments on Blogger.Here on Spice Up Your Blog we have made great strides in improving the Blogger comments with tricks like Adding Replies To Blogger Comments and Adding Smileys and Emoticons to Blogger Comments.This script will bring the comments on your blog to another level allowing readers to use different colors, share images and just for fun use Marquee scrolling text when they comment.

Live Demo - Click To See The Demo : Blogger Comment Images And Colors

Macro writes his blog in Tamil but has done a great job in Writing this post in English to share his new script with Spice Up Your Blog Readers.I will summarise the steps and show you how to add a message above the comment form to let readers know of the options below Macro's post.

Note - This post and script can not be republished on other blogs by request of Author, if you want to share this you may link to this post.

New Blogger Scrip Display Images And Colors In Comments


Guest Post - By Macro Raman

We do see many of them chats with shorten words, symbols, smileys and more to tell in short form. Now its a time of zero typing where image speaks a lot more than words. Let us imagine there is a colorful animated new year greeting post where you like to greet the author the same way.You know greeting pictures speak Louder than words,so you too created a splendor greeting picture for the blog author but the blog restrict you to post images. Then?

Of course, Blogger.com restrict the readers to post images in their comments column.We know It is possible to posts picture comment in wordpress blogs by adding just <img> tags. then what is the solution for the blogger's blogspot? Here I introduce new javascript which try to minimize the maximum extend of this restriction. and be aware of it that it doesn't work in script disabled browsers.

How to add image?

This is just simple, you need to start with [im] and end with [/im] place your image address in between of it.Like This :

[im]http://domain.com/folder/sample.jpg[/im]


How to install?

This is the code

<a href='http://www.spiceupyourblog.com'><img alt='Best Blogger Tips' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-IlJVzvSCVVSsiCqqQ5Bn4soziCBcd7DetVFsPvbjCMRJ136yeOqY41CdMZtj3Bmb2_OwWRCin7zuIs-dxw9tyc2fitpdO8ZFi2IccLjOnhdWkFxtY-8y6mryCktW5nJpQbhnIa-_1ZaB/s1600/best+blogger+tips.png'/></a><script src='http://hosting.gmodules.com/ig/gadgets/file/105066904960012479556/nccode.js' type='text/javascript'/><a href="http://www.spiceupyourblog.com">Best Blogger Tips</a>

which you need to paste it before </body> in the source code of blogspot or any blogger's website.

That's it The Script take care of it, and don't forget to tell to your readers about picture comments.

What more ?

Do you need more colorful comments? then use :

[ma]....your text...[/ma]
for marquee effect i.e. running letters.

[co="red"]...your text...[/co]
for red colored text. you can change the color as your wish.You can try this code and add what you feel, if you agree.

Summary And Message Above Comments



Add The Script To Your Blog

Step 1. Click Design > 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)

</body>

Step 3. Copy And Paste The Following Code Directly Below / Under </body>

<script src='http://hosting.gmodules.com/ig/gadgets/file/105066904960012479556/nccode.js' type='text/javascript'/><a href="http://www.spiceupyourblog.com">Best Blogger Tips</a>

-To add an image to a comment wrap it in [im][/im] like this :

[im]Image URL Here[/im]

-To Change Color Of Text In Comment Wrap It In [co="color"][/co] Like This :

[co="red"]Comment Text Here[/co] - Change Red To The Color You Want.

-To Add Marquee Text Wrap It In [ma][/ma] Like This :

[ma]Comment Text[/ma]

Add Message Above Comment Form


You will want to let your readers know the options so below i will show you how to add a message above the comment form.You can see the message we are adding on the demo.

Step 1. In your Blogger Dashboard click > Design > Edit Html > Expand Widget Templates :







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)

<p><data:blogCommentMessage/></p>

Step 3. Copy And Paste The Code Below Directly After <p><data:blogCommentMessage/></p>

<a href='http://www.spiceupyourblog.com'><img alt='Best Blogger Tips' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-IlJVzvSCVVSsiCqqQ5Bn4soziCBcd7DetVFsPvbjCMRJ136yeOqY41CdMZtj3Bmb2_OwWRCin7zuIs-dxw9tyc2fitpdO8ZFi2IccLjOnhdWkFxtY-8y6mryCktW5nJpQbhnIa-_1ZaB/s1600/best+blogger+tips.png'/></a><b>Comment Options -</b> You Can Add Images, Colored Text And Marquee Text To Your Comment.<br/><br/><b>Image -</b> [im]Image URL Here[/im]<br/><b>Colors - </b>[co="red"]Comment Text Here[/co] - Change Red To The Color You Want.<br/><b>Marquee -</b> [ma]Comment Text[/ma]<br/><b>Get This -</b> <a href="http://www.spiceupyourblog.com/2010/12/images-colored-text-blogger-comments.html" target="_blank">Blogger Comment Script</a><br/>

Save Your Template and your readers will now know all the options they have.



guest blog postAuthor - Macro is a Blogger And Designer, he created this script and wanted to share with Spice Up Your Blog Readers.You can find Macro on his Blog.



New Script Add Images And Colored Text To Blogger Comments

images in blogger commentsIn this post Macro Raman shares a fantastic script he created that allows people for the first time to add images, different color text and scrolling text to comments on Blogger.Here on Spice Up Your Blog we have made great strides in improving the Blogger comments with tricks like Adding Replies To Blogger Comments and Adding Smileys and Emoticons to Blogger Comments.This script will bring the comments on your blog to another level allowing readers to use different colors, share images and just for fun use Marquee scrolling text when they comment.

Live Demo - Click To See The Demo : Blogger Comment Images And Colors

Macro writes his blog in Tamil but has done a great job in Writing this post in English to share his new script with Spice Up Your Blog Readers.I will summarise the steps and show you how to add a message above the comment form to let readers know of the options below Macro's post.

Note - This post and script can not be republished on other blogs by request of Author, if you want to share this you may link to this post.

New Blogger Scrip Display Images And Colors In Comments


Guest Post - By Macro Raman

We do see many of them chats with shorten words, symbols, smileys and more to tell in short form. Now its a time of zero typing where image speaks a lot more than words. Let us imagine there is a colorful animated new year greeting post where you like to greet the author the same way.You know greeting pictures speak Louder than words,so you too created a splendor greeting picture for the blog author but the blog restrict you to post images. Then?

Of course, Blogger.com restrict the readers to post images in their comments column.We know It is possible to posts picture comment in wordpress blogs by adding just <img> tags. then what is the solution for the blogger's blogspot? Here I introduce new javascript which try to minimize the maximum extend of this restriction. and be aware of it that it doesn't work in script disabled browsers.

How to add image?

This is just simple, you need to start with [im] and end with [/im] place your image address in between of it.Like This :

[im]http://domain.com/folder/sample.jpg[/im]


How to install?

This is the code

<a href='http://www.spiceupyourblog.com'><img alt='Best Blogger Tips' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-IlJVzvSCVVSsiCqqQ5Bn4soziCBcd7DetVFsPvbjCMRJ136yeOqY41CdMZtj3Bmb2_OwWRCin7zuIs-dxw9tyc2fitpdO8ZFi2IccLjOnhdWkFxtY-8y6mryCktW5nJpQbhnIa-_1ZaB/s1600/best+blogger+tips.png'/></a><script src='http://hosting.gmodules.com/ig/gadgets/file/105066904960012479556/nccode.js' type='text/javascript'/><a href="http://www.spiceupyourblog.com">Best Blogger Tips</a>

which you need to paste it before </body> in the source code of blogspot or any blogger's website.

That's it The Script take care of it, and don't forget to tell to your readers about picture comments.

What more ?

Do you need more colorful comments? then use :

[ma]....your text...[/ma]
for marquee effect i.e. running letters.

[co="red"]...your text...[/co]
for red colored text. you can change the color as your wish.You can try this code and add what you feel, if you agree.

Summary And Message Above Comments



Add The Script To Your Blog

Step 1. Click Design > 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)

</body>

Step 3. Copy And Paste The Following Code Directly Below / Under </body>

<script src='http://hosting.gmodules.com/ig/gadgets/file/105066904960012479556/nccode.js' type='text/javascript'/><a href="http://www.spiceupyourblog.com">Best Blogger Tips</a>

-To add an image to a comment wrap it in [im][/im] like this :

[im]Image URL Here[/im]

-To Change Color Of Text In Comment Wrap It In [co="color"][/co] Like This :

[co="red"]Comment Text Here[/co] - Change Red To The Color You Want.

-To Add Marquee Text Wrap It In [ma][/ma] Like This :

[ma]Comment Text[/ma]

Add Message Above Comment Form


You will want to let your readers know the options so below i will show you how to add a message above the comment form.You can see the message we are adding on the demo.

Step 1. In your Blogger Dashboard click > Design > Edit Html > Expand Widget Templates :







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)

<p><data:blogCommentMessage/></p>

Step 3. Copy And Paste The Code Below Directly After <p><data:blogCommentMessage/></p>

<a href='http://www.spiceupyourblog.com'><img alt='Best Blogger Tips' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-IlJVzvSCVVSsiCqqQ5Bn4soziCBcd7DetVFsPvbjCMRJ136yeOqY41CdMZtj3Bmb2_OwWRCin7zuIs-dxw9tyc2fitpdO8ZFi2IccLjOnhdWkFxtY-8y6mryCktW5nJpQbhnIa-_1ZaB/s1600/best+blogger+tips.png'/></a><b>Comment Options -</b> You Can Add Images, Colored Text And Marquee Text To Your Comment.<br/><br/><b>Image -</b> [im]Image URL Here[/im]<br/><b>Colors - </b>[co="red"]Comment Text Here[/co] - Change Red To The Color You Want.<br/><b>Marquee -</b> [ma]Comment Text[/ma]<br/><b>Get This -</b> <a href="http://www.spiceupyourblog.com/2010/12/images-colored-text-blogger-comments.html" target="_blank">Blogger Comment Script</a><br/>

Save Your Template and your readers will now know all the options they have.



guest blog postAuthor - Macro is a Blogger And Designer, he created this script and wanted to share with Spice Up Your Blog Readers.You can find Macro on his Blog.



terça-feira, 7 de dezembro de 2010

Awesome New Blogger Numbered Page Navigation Gadget

new blogger page navigation gadgetBack in July i published a popular post showing you how to add a numbered page navigation gadget below your posts on Blogger.The Numbered page navigation is a must have gadget, making you blog much easier for readers to navigate and keeping them on your blog longer looking at more of your content.I'm sure you have seen page nav on many blogs, basically it's below all posts with 'Next Page' Previous Page' and numbered pages for the reader to choose from.

The script for the page navigation i published in July has since caused a lot of trouble often only working some of the time and in some cases not working at all.So i have worked at getting a new script with a much easier format that will work on all blogs all the time.I have also hosted this script myself to guarantee it wont let you down.

Adding the navigation gadget to your blog is also easier with this new script as you don't need to add a huge chunk of Css to your Blogger template.Just a small piece of code added to a html/javascript gadget and your done.So lets look at the screenshot and demo then add this great new gadget to your blog.

Screenshot

Blogger Page Navigation Widget

Live Demo - You can see The New Page Nav On Our Blogger Templates Site : Blogger Page Navigation Gadget

Add The New Blogger Page Navigation To Your Blog


Step 1. In your Blogger Dashboard Click > Design > Add A Gadget > Choose 'Html/Javascript' From The Pop Up Menu :







Step 2. Copy The Code Below And Paste It Into The Html/Javascript Gadget :

<a href='http://www.spiceupyourblog.com'><img alt='Best Blogger Tips' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-IlJVzvSCVVSsiCqqQ5Bn4soziCBcd7DetVFsPvbjCMRJ136yeOqY41CdMZtj3Bmb2_OwWRCin7zuIs-dxw9tyc2fitpdO8ZFi2IccLjOnhdWkFxtY-8y6mryCktW5nJpQbhnIa-_1ZaB/s1600/best+blogger+tips.png'/></a><style type='text/css'>.showpageArea a {text-decoration:underline;}.showpageNum a {text-decoration:none;border: 1px solid #cccccc;margin:0 3px;padding:3px;}.showpageNum a:hover {border: 1px solid #cccccc;background-color:#cccccc;}.showpagePoint {color:#333;text-decoration:none;border: 1px solid #cccccc;background: #cccccc;margin:0 3px;padding:3px;}.showpageOf {text-decoration:none;padding:3px;margin: 0 3px 0 0;}.showpage a {text-decoration:none;border: 1px solid #cccccc;padding:3px;}.showpage a:hover {text-decoration:none;}.showpageNum a:link,.showpage a:link {text-decoration:none;color:#333333;}</style><script style='text/javascript'>var pageCount=10;var displayPageNum=5;var upPageWord="Previous";var downPageWord="Next";</script><script style='text/javascript' src='http://spiceupyourblogextras.googlecode.com/files/newbloggerpagenav.js'></script>

Important - I have set the posts per page at 10 (In Red Above), you can increase or decrease this however you must match this in your Blogger settings.So once you save the gadget go to your Blogger settings > Formatting > Set the posts per page to the same as the number in your page navigation code (See Image Below).Basically if you leave the number at 10 make sure your posts per page setting is 10, if you change to 8 make sure your posts per page is 8 and so on..



Step 3. OK just to keep your design page in proper order i recommend you drag and drop the gadget below the posts section.

That's your new numbered page navigation widget in place below your posts, if your comfortable with changing the code you can change the colors used.We have lots more Blogger Widgets and Blog Design Posts for you to check out.

Drop Your Comments, Views And Questions Below.

quarta-feira, 1 de dezembro de 2010

4 Tips for Designing A Killer Logo

design blog logo tipsGuest Post By : Sarah Wallace

When you’re starting blog, like a business there are a few foundational bricks which are vital. A niche, product or service, a name, a business model, and a plan are only a few of the many steps in the entrepreneurial marathon. But with each stride forward, there should be an eye toward long-term branding. And one of the most important aspects of building a brand is the creation of a logo. While it may not seem as though creating a tiny little image is one of the building blocks of a great blog or business, it is a small but crucial brick. When it comes to making a logo everyone’s ultimate goals will be different. But for anyone, a logo needs to be a memorable, visual encapsulation of your business. It’s a tall order for a little picture. But it’s not impossible, here are a few tips for making it happen.

Research 


The first thing you want to do is look at other logos. You wouldn’t make a pie for the first time without looking at recipes, and you shouldn’t design a logo without taking a good hard look at what you like and hate about other people’s logos. Start by reviewing the logos of some of the world’s most famous brands. What makes them so successful? Why do you think they’ve stood the test of time and helped these businesses rise to the top of their industry? Search your own market, find your future competitors and scope out their logos. Taking stock of what others have done can help you figure out what aspects you really want to incorporate and what mistakes you want to avoid. Once you have your list the fun part begins.

Use Font and Color Wisely


Selecting your colors and font styles is a crucial part of designing a logo. There are both practical and theoretical reasons to examine every choice carefully. As human beings our psyches are predisposed to respond in different ways to the various shapes and colors on the spectrum. Certain colors evoke specific emotions triggering different instincts on a primal level, and cultural and social conventions have created numerous color related cognitive connotations.

We can harness all of the powers of colors and use them to help re-enforce our messages. Red, for example can help create a sense of urgency and green is associated strongly with both money and the environment. Some colors like purple are representative of opulence but are also popular among children. This multi-faceted personality makes it a great color for both luxury items and products geared toward kids. The point is, selecting your color palate should take into account our most basic reactions to color, and capitalize on them in a way which supports our goals rather than contradicting them.

Font choice is another important decision because typeface can say as much about a company, website or blog as the words it illustrates. With an ever broadening buffet of font types available there are some distinct decisions to be made. Is the company very buttoned-up and traditionally corporate? Then the font should convey professionalism. Is the company more free-spirited and artistic? Then the typeface can be more creative and unusual. In any case, the choice of font styling should be in line with the overall essence of the company. But most importantly, it must be readable. If the font is so artistic that it becomes difficult to read it becomes counterproductive. For small companies with limited resources, sticking to something more traditional and simple to reproduce may be in their best interest.

Versatility is Key


No matter what colors and fonts you wind up choosing, the logo it self must be versatile. A logo will appear in numerous places related to your business, which means it needs to adapt to each situation seamlessly. An image should be equally effective on large and small scales. The same logo must be able to fit a 30-foot banner and a 3-inch business card. Color wise, a logo should work aesthetically with your marketing materials. But many colors don’t represent well on a website or on paper. Multi-colored logos should also work as monochromatically, for situations that call for one color or black and white. A logo should be recognizable in any form or color and should work well on paper, online or on logo products. Versatility is served well by simplicity. A design which is uncluttered will translate better across multiple channels than something which is highly detailed. It’s important to experiment and view the logo in different sizes and formats to ensure that it will look clean and memorable under any circumstances.

It Doesn’t Take an Expert…But It May not hurt.


If you are creative and have a basic understanding of any graphic design program, you can probably bang something out. Even without Adobe, there are numerous free logo creators on the web. But with only basic skills or generic free tools, you do sacrifice some degree of character and complexity. Essentially if you use the same basic elements that everyone has access too you will not wind up with the most unique of icons. Granted it’s totally possible to create something distinct, functional and even good with limited resources, but if you want something outstanding or borderline ingenious, it could be worth looking for a designer. It doesn’t have to take hundreds or thousands of dollars to have someone create a brand new logo. What it does take is someone with graphic design skills and a thorough understanding of exactly who your business is and what you want your logo to accomplish.

Not every logo will reach the iconic status of McDonalds or Nike. But not every logo needs to. What it needs to be is a well thought out, well researched and carefully designed representation of your blog. It should be something which is instantly recognizable and compelling. But above all, it should be something that speaks to the heart of who you are and what you represent.



guest blog postAuthor - Sarah is a writer for Quality Logo Products website offering promotional products and branded items. She has been a blogger and marketer for several years. She specializes in brand and website consulting when she is not freelance writing.


terça-feira, 9 de novembro de 2010

Finally Open Google Custom Search Results In Blogger Blogs

open custom search results blogger The Google custom search bar returns in my opinion the most accurate results for your blog.The search bar itself is compact and stylish and can be easily added to your blog.For those of you not familiar with the Google Custom search bar it basically looks the same as the search on the Google home page and when added to your blog returns results in the same format.The big difference is the results returned are All posts on Your Blog.This is a great way to let the readers of your blog quickly find exactly what they are looking for.The Google custom search bar has been vastly improved over the years and is still constantly getting better but i have always had one Big Issue with using Google Custom search on my Blogger blogs.

One of the great options you are offered when setting up a Google custom search box for your blog is to open the results within your site or blog.So instead of readers leaving your blog and going to a separate Google page to see the results of their search they will see the results on a page that is actually part of your blog.This has a number of benefits here are three of the main ones :

- It's never good to send readers away from your blog and the separate Google page does not have a direct link back to your homepage.
- As they stay in your blog it increases your views and the search results page will be crawled by Google helping SEO.
- Displaying the results within your blog looks much more professional.

That's Fantastic but because of the minimum requirements set by Google such as minimum width of search results pages Blogger users cant actually choose the option to display the Search results on within their blog...Until Now !

In this post i will show you how you can create a totally unique page on your blog and display the results from Google Custom search on that page.

Important Update - Since this post i have created an easier way to display the results in your blog.You can still create a unique page as shown here but for the new method go to this post - Easily Open AdSense For Search Results In Blogger

Demo 1 - Go to our demo blog and use the search bar in the header to see the results page :

Demo Click Here

Cool Eh ? - But that's just a plain page, take a look at how you can customize the page :

Demo 2 - I have fully customized the search results page for Spice Up Your Blog, use any of the search bars on this log to see the result:

Click Here To Open Spice Up Your Blog In A New Window

Extra Cool eh ? - You can see more results by using any of the search bars on this blog.

There are a number of step involved to get your search bar and search results page.

- You need to create a new Google custom search bar for your blog.Only AdSense members have the option to Embed results in their Blog if you have not yet joined AdSense apply here - Google AdSense.

- You need to create the page for the results and add code to your template to customize the page.

Don't worry i will walk you through all the steps.So lets get stared, make sure to back up your template and take your time.

Open Google Custom Search Results In Your Blog

Create The Page For The Google Search Results

Step 1. First we will create the page that displays your search results.From your Blogger dashboard click 'New Post' or 'Edit Posts' > and in the top menu click 'Edit Pages' > Now Click 'New Page'.



Step 2. Add A Title Like 'Search Results' to your page but leave the actual content area totally blank and publish the page.You will now be asked how you would like the page to appear choose 'No Gadget - Link To Pages Manually' and publish.OK you will now be presented with the option to view the page, click that link.

Step 3. For the next step we need the URL of the blank page you just created so copy the URL from the address bar and keep it or you can go back for it when needed.

That's the first part covered We will Create the search bar In your AdSense account.

Get The Search Bar Code From AdSense

Many of you will have created an AdSense custom search bar previously and it's a fairly straight forward process, this time we just have to chose to use the 'Open Results In My Own Site' Option.Lets have a look :

1. Log Into AdSense

2. Click the 'Get Ads' option the the top menu > Tick 'AdSense For Search' and continue.

3. AdSense walk you through the steps of creating the Search Bar:

- In the third page you will see the 'Opening of search results page' section > Choose 'Open Results In My Own Site.

- Below this is 'Enter URL where search results will be displayed' > Enter the URL of the page you created above and just leave the width at 800px then scroll down.

- You will be asked to choose the style of the search results page > I have set up the page to work with the default pallet so leave this and move on.

- The next page requires you to accept the AdSense Terms and name your search bar (The name of the bar is only to help locate it in your AdSense account and is not important).Click 'Submit and get Code'.

- Usually you would now be presented with one snippet of code for the search bar this time you will get two.The first snippet is for the search bar and the second is for the search results page.Save both pieces of code or keep the page open as you will need both later.

OK back to your Blogger Dashboard (Are you keeping up)

Add The Search Page Code To Your Template

Step 1. In your dashboard click 'Design' > '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)

</body>

Step 3. Copy and paste the following code Directly Below / Under </body>

</b:if >

Step 4. Don't save you template we have the final step to complete - 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)

</head>

Step 5. Replace </head> with the code below :

<!--search page code by www.spiceupyourblog.com-->
<b:if cond='data:blog.url == &quot;URL-OF-YOUR-PAGE&quot;'>
<style>
body{
margin:0;
padding:0;
background:#ffffff;
font:70% Arial, Helvetica, sans-serif;
color:#555;
line-height:150%;
text-align:left;
}
#container{
margin:20px auto;
width:850px;
background:#fff;
padding-bottom:20px;
border-left:1px solid #bebebe;
border-right:1px solid #bebebe;
}
#content{
margin:0 20px;
}
h1 {
background:none repeat scroll 0 0 #DDDDDD;
font-family:sans-serif;
font-size:27px;
font-style:italic;
font-weight:lighter;
text-align:center;
text-shadow:1px 0 0 #FFFFFF;
margin:0px;
}
p{
margin-bottom:18px;
font-style:italic;
font-family:Georgia, Times, serif;
font-size:24px;
color:#bfe1f1;
padding:0;
}
a {
text-decoration:none;
}
ul {
margin:0px;
padding:0px;
}
ul li {
border-left:1px solid #000000;
color:#BEBEBE;
font-family:Arial;
font-size:13px;
font-style:italic;
list-style:decimal inside url(&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvsbNlLLNgOWdyusGj4ZdKT0Zo6AZ7p1WDID9gLOuxNwCqTPYXUCMQEb_1aXoPdnHDNKoFGPgvkWZn4BZpdf3t5_0rTzWZHajxjgmErIu6Sy1CEyC3K4QrZgQZRB0rDJOUoaIV1sH7jhWn/&quot;);
margin:0 0 0 15px;
padding:8px 8px 8px 0;
}
li a{
text-decoration:none;
color:#057fac;
display:block;
margin-top:-12px;
padding:0 0 0 30px;

}
li a:hover{
text-decoration:none;
color:#999;
}
</style>
<!--[if IE 6]>
<style>
li a{
display:inline-block;
padding:0 0 0 5px;
margin-top:-10px;
}
</style>
<![endif]-->
</b:if>
</head>
<b:if cond='data:blog.url == &quot;URL-OF-YOUR-PAGE&quot;'>
<body>
<div id='container'>
<h1>YOUR-BLOGS-TITLE</h1>
<div id='content'>
<table border='0'><tr><td><a href='URL-OF-YOUR-HOME-PAGE'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgraNCN_lm4WFXC6ASrH-a1A2Rj5PQFH9x0GjenRuClkcrJ37-hCfffD6VjXz61Ya6Y42V6VKixke2KdaSrTeaxaTt_H7b4o4rWkIgpmHXvZyjiuJsDyW7DIQok3VWzujMSlIxUOsr0HJkB/s1600/ico-home.png'/></a></td><td><a href='URL-OF-YOUR-HOME-PAGE'>Home Page</a></td></tr></table>

<!--REPLACE THIS WITH THE SEARCH RESULTS CODE-->

<a href="http://www.spiceupyourblog"><small>Results Page From
Spice Up Your Blog</small></a>
</div>
</div>
</body>
<b:else/>

<!--end search page code by www.spiceupyourbog.com-->

Important - We now need to add a few things to the code.

1.Where you see URL-OF-YOUR-PAGE( Twice)  in red - Replace with the URL of the blank page you created in step 1.

2. Where You See YOUR-BLOGS-TITLE in blue - Replace with the title of your blog (You could also use 'Search Results' etc..)

3. Where you see URL-OF-YOUR-HOME-PAGE (Twice) - Replace with the URL of your blogs home page.

4. Where you see <!--REPLACE THIS WITH THE SEARCH RESULTS CODE--> - Replace with the second section of code provided by Google AdSense.

Add The Search Bar  - OK if you took your time and sure all the code is in the right place save your template.Now add the code for the actual search bar you your blog > Just head to your Design page > Add A Gadget > Choose Html/Javascript > Paster in your search bar code and save.

That's it go test out your search bar - Very Important - While you can test your new search bar Do Not click the ads on the search results page !

As you have seen by the results page for Spice Up Your Blog you can add lost more customizations to the code.If you need more help drop a comment below.There are a lot of steps involved and it has been a hard tutorial to write but if you take your time I'm sure you will have no problems.

Make sure to check out more Helpful Posts On AdSense and our post showing you how to use the same styling to create a Totally Unique Table Of Content Site Map (Check out my Site map from the top menu for a demo).

Drop Your Comments, Views And Questions Below.

Finally Open Google Custom Search Results In Blogger Blogs

open custom search results blogger The Google custom search bar returns in my opinion the most accurate results for your blog.The search bar itself is compact and stylish and can be easily added to your blog.For those of you not familiar with the Google Custom search bar it basically looks the same as the search on the Google home page and when added to your blog returns results in the same format.The big difference is the results returned are All posts on Your Blog.This is a great way to let the readers of your blog quickly find exactly what they are looking for.The Google custom search bar has been vastly improved over the years and is still constantly getting better but i have always had one Big Issue with using Google Custom search on my Blogger blogs.

One of the great options you are offered when setting up a Google custom search box for your blog is to open the results within your site or blog.So instead of readers leaving your blog and going to a separate Google page to see the results of their search they will see the results on a page that is actually part of your blog.This has a number of benefits here are three of the main ones :

- It's never good to send readers away from your blog and the separate Google page does not have a direct link back to your homepage.
- As they stay in your blog it increases your views and the search results page will be crawled by Google helping SEO.
- Displaying the results within your blog looks much more professional.

That's Fantastic but because of the minimum requirements set by Google such as minimum width of search results pages Blogger users cant actually choose the option to display the Search results on within their blog...Until Now !

In this post i will show you how you can create a totally unique page on your blog and display the results from Google Custom search on that page.

Important Update - Since this post i have created an easier way to display the results in your blog.You can still create a unique page as shown here but for the new method go to this post - Easily Open AdSense For Search Results In Blogger

Demo 1 - Go to our demo blog and use the search bar in the header to see the results page :

Demo Click Here

Cool Eh ? - But that's just a plain page, take a look at how you can customize the page :

Demo 2 - I have fully customized the search results page for Spice Up Your Blog, use any of the search bars on this log to see the result:

Click Here To Open Spice Up Your Blog In A New Window

Extra Cool eh ? - You can see more results by using any of the search bars on this blog.

There are a number of step involved to get your search bar and search results page.

- You need to create a new Google custom search bar for your blog.Only AdSense members have the option to Embed results in their Blog if you have not yet joined AdSense apply here - Google AdSense.

- You need to create the page for the results and add code to your template to customize the page.

Don't worry i will walk you through all the steps.So lets get stared, make sure to back up your template and take your time.

Open Google Custom Search Results In Your Blog

Create The Page For The Google Search Results

Step 1. First we will create the page that displays your search results.From your Blogger dashboard click 'New Post' or 'Edit Posts' > and in the top menu click 'Edit Pages' > Now Click 'New Page'.



Step 2. Add A Title Like 'Search Results' to your page but leave the actual content area totally blank and publish the page.You will now be asked how you would like the page to appear choose 'No Gadget - Link To Pages Manually' and publish.OK you will now be presented with the option to view the page, click that link.

Step 3. For the next step we need the URL of the blank page you just created so copy the URL from the address bar and keep it or you can go back for it when needed.

That's the first part covered We will Create the search bar In your AdSense account.

Get The Search Bar Code From AdSense

Many of you will have created an AdSense custom search bar previously and it's a fairly straight forward process, this time we just have to chose to use the 'Open Results In My Own Site' Option.Lets have a look :

1. Log Into AdSense

2. Click the 'Get Ads' option the the top menu > Tick 'AdSense For Search' and continue.

3. AdSense walk you through the steps of creating the Search Bar:

- In the third page you will see the 'Opening of search results page' section > Choose 'Open Results In My Own Site.

- Below this is 'Enter URL where search results will be displayed' > Enter the URL of the page you created above and just leave the width at 800px then scroll down.

- You will be asked to choose the style of the search results page > I have set up the page to work with the default pallet so leave this and move on.

- The next page requires you to accept the AdSense Terms and name your search bar (The name of the bar is only to help locate it in your AdSense account and is not important).Click 'Submit and get Code'.

- Usually you would now be presented with one snippet of code for the search bar this time you will get two.The first snippet is for the search bar and the second is for the search results page.Save both pieces of code or keep the page open as you will need both later.

OK back to your Blogger Dashboard (Are you keeping up)

Add The Search Page Code To Your Template

Step 1. In your dashboard click 'Design' > '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)

</body>

Step 3. Copy and paste the following code Directly Below / Under </body>

</b:if >

Step 4. Don't save you template we have the final step to complete - 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)

</head>

Step 5. Replace </head> with the code below :

<!--search page code by www.spiceupyourblog.com-->
<b:if cond='data:blog.url == &quot;URL-OF-YOUR-PAGE&quot;'>
<style>
body{
margin:0;
padding:0;
background:#ffffff;
font:70% Arial, Helvetica, sans-serif;
color:#555;
line-height:150%;
text-align:left;
}
#container{
margin:20px auto;
width:850px;
background:#fff;
padding-bottom:20px;
border-left:1px solid #bebebe;
border-right:1px solid #bebebe;
}
#content{
margin:0 20px;
}
h1 {
background:none repeat scroll 0 0 #DDDDDD;
font-family:sans-serif;
font-size:27px;
font-style:italic;
font-weight:lighter;
text-align:center;
text-shadow:1px 0 0 #FFFFFF;
margin:0px;
}
p{
margin-bottom:18px;
font-style:italic;
font-family:Georgia, Times, serif;
font-size:24px;
color:#bfe1f1;
padding:0;
}
a {
text-decoration:none;
}
ul {
margin:0px;
padding:0px;
}
ul li {
border-left:1px solid #000000;
color:#BEBEBE;
font-family:Arial;
font-size:13px;
font-style:italic;
list-style:decimal inside url(&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvsbNlLLNgOWdyusGj4ZdKT0Zo6AZ7p1WDID9gLOuxNwCqTPYXUCMQEb_1aXoPdnHDNKoFGPgvkWZn4BZpdf3t5_0rTzWZHajxjgmErIu6Sy1CEyC3K4QrZgQZRB0rDJOUoaIV1sH7jhWn/&quot;);
margin:0 0 0 15px;
padding:8px 8px 8px 0;
}
li a{
text-decoration:none;
color:#057fac;
display:block;
margin-top:-12px;
padding:0 0 0 30px;

}
li a:hover{
text-decoration:none;
color:#999;
}
</style>
<!--[if IE 6]>
<style>
li a{
display:inline-block;
padding:0 0 0 5px;
margin-top:-10px;
}
</style>
<![endif]-->
</b:if>
</head>
<b:if cond='data:blog.url == &quot;URL-OF-YOUR-PAGE&quot;'>
<body>
<div id='container'>
<h1>YOUR-BLOGS-TITLE</h1>
<div id='content'>
<table border='0'><tr><td><a href='URL-OF-YOUR-HOME-PAGE'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgraNCN_lm4WFXC6ASrH-a1A2Rj5PQFH9x0GjenRuClkcrJ37-hCfffD6VjXz61Ya6Y42V6VKixke2KdaSrTeaxaTt_H7b4o4rWkIgpmHXvZyjiuJsDyW7DIQok3VWzujMSlIxUOsr0HJkB/s1600/ico-home.png'/></a></td><td><a href='URL-OF-YOUR-HOME-PAGE'>Home Page</a></td></tr></table>

<!--REPLACE THIS WITH THE SEARCH RESULTS CODE-->

<a href="http://www.spiceupyourblog"><small>Results Page From
Spice Up Your Blog</small></a>
</div>
</div>
</body>
<b:else/>

<!--end search page code by www.spiceupyourbog.com-->

Important - We now need to add a few things to the code.

1.Where you see URL-OF-YOUR-PAGE( Twice)  in red - Replace with the URL of the blank page you created in step 1.

2. Where You See YOUR-BLOGS-TITLE in blue - Replace with the title of your blog (You could also use 'Search Results' etc..)

3. Where you see URL-OF-YOUR-HOME-PAGE (Twice) - Replace with the URL of your blogs home page.

4. Where you see <!--REPLACE THIS WITH THE SEARCH RESULTS CODE--> - Replace with the second section of code provided by Google AdSense.

Add The Search Bar  - OK if you took your time and sure all the code is in the right place save your template.Now add the code for the actual search bar you your blog > Just head to your Design page > Add A Gadget > Choose Html/Javascript > Paster in your search bar code and save.

That's it go test out your search bar - Very Important - While you can test your new search bar Do Not click the ads on the search results page !

As you have seen by the results page for Spice Up Your Blog you can add lost more customizations to the code.If you need more help drop a comment below.There are a lot of steps involved and it has been a hard tutorial to write but if you take your time I'm sure you will have no problems.

Make sure to check out more Helpful Posts On AdSense and our post showing you how to use the same styling to create a Totally Unique Table Of Content Site Map (Check out my Site map from the top menu for a demo).

Drop Your Comments, Views And Questions Below.