Skip to main content

Posts

A Beautiful jQuery Drop-Down Menu For Blogger Blogspot

Alright, this time, we are going to make a stylish and simple jQuery drop down menu. The main objective is to make it as simple as possible, with some little jQuery effect and easy to customize/ apply different style on it. To style it into your own design, you just have to modify the a tag CSS style. You can change colors or put background images, or the size and color of text. Steps Adding the jQuery Drop-Down menu Step 1. Go to Dashboard - Template - Edit HTML - Proceed Step 2. Expand Widget Template (make a backup) Step 3. Search for the following code: ]]></b:skin> Step 4. Add the following CSS code before/above it: #jsddm { height: 40px; margin: 0; overflow: visible; z-index: 2; padding: 15px; position:relative; } #jsddm li { float: left; list-style: none; font: 12px Tahoma, Arial; } #jsddm li a { display: block; white-space: nowrap; margin:1px 3px; border: 1px solid #AAAAAA; background: #cccccc; background: -webkit-gradient(linear, left top, left bottom, from(#ebeb

How to Add Emoticons/Smileys in Blogger Comments

Emoticons/Smileys are a great way of making discussions more interesting and fun, so it's a pity that Blogger don't support them. This tutorial will show you some simple steps on how to add some very cute emoticons called Kolobok to your Blogger/Blogspot comments, so that you and your blog visitors will be able to have an enjoyable time together. Now available for threaded commenting system too! DEMO How To Add Kolobok Smileys In Blogger Comments Step 1. Go to Dashboard - Template - Edit HTML - Proceed  Step 2. Expand Widget Template (make a backup) Step 3. Search (CTRL + F) for this tag: </body> Step 4. Copy and paste just above it, this code: For previous commenting system (comments without reply option) <!--kolobok-smileys--> <script src='http://helplogger.googlecode.com/svn/trunk/[helplogger.blogspot.com]smileys.js' type='text/javascript'/><noscript><a href='http://helplogger.blogspot.com/2012/04/how-to-add-emoticonssmileys-

How to Add A Comment Count Bubble To Blogger Post Titles

A comment bubble (or speech balloon ) with the current number of comments displayed on each blogger post titles might be an excellent addition if you want to make your blog more attractive and engaging. Having a comment bubble icon could help you not only to get more comments on your blog but may, as well, give your visitors a hint about which are the most popular posts on your blog. When a post has received many comments, it could reflect the popularity of your posts and thus, make your readers and visitors to be more interested in reading them. If you want to add a comment or speech bubble to your Blogger blog , then follow the next steps below: Step 1. Log in to your Blogger Dashboard > go to Template > click the Edit HTML button Step 2.  Click anywhere inside the code area and press the CTRL + F keys to open the Blogger search box Step 3. Find the following tag in your template: ]]></b:skin> Note: before anything, you need to click on the small arrow next to i

How to Create Static Pages in Blogger

What are Blogger static pages?  Blogger Static Pages allows you to create specific pages like About Me, Contact page, Privacy Policy etc. on stand-alone pages that are linked from your blog. The static pages basically are the same as post pages, but there are several things that make them different. One of the differences is that static pages don't appear in the home page, don't have a label, and are not indexed as archive pages. How to Create Static Pages in Blogger. Step 1. Log in to your Blogger Dashboard Step 2. Click on Pages Step 3. Click on New Page - Blank Page Step 4. Type the title and write the page's content. Step 5. Before publishing it, click on Preview to see how it will appear on your blog. Step 6. When you have finished the editing, click on Publish button. Step 7. Now you have 3 options: Keep it as nav menu below header - Top tabs Display the page in your blog's sidebar - Side Links Add the page's link manually to your template - Don't

How to change Blogger "Post A Comment" Message

While the main secret of getting comments is to have good friends and creating good content, sometimes it is difficult getting more comments when we have a brand new blog that is not visited very often. A pretty good technique is to put images to encourage visitors to comment. In this tutorial I want to show you how to replace the 'Post A Comment' text that appears above the comment form with an image. Also, I added a few cool images that you can use but you can as well add your own image, that depends on your tastes. So, let's start adding it! How to replace Post a Comment with an image In order to  replace "Post A Comment" message in Blogger / Blogspot, follow the steps below: Step 1.   Log in to Blogger, go to your Blogger Dashboard and select your blog. Step 2.  Go to Template and press the Edit HTML button Screenshot Step 3. Click anywhere on the code area, then press the CTRL + F keys and search for this code (if you can't find the entire code, the

How To SEO Optimize Your Blogger Blog Titles For Higher Search Results

This is called "Blogger/blogspot Title Swapping". Swapping blogs title can help boost your position in search engine results page listing and also increase clickthroughs. From an SEO (Search Engine Optimization) perspective, page title is the most important element in your blog in terms of ranking well in search engines. If you look at your browser's title bar you will notice that Blogger's default templates display your blog title in front of each page or post title. So page title would normally be displayed as: After swapping the blog title, it will be appearing like this: This kind of placement will be also appearing in google search results. The reason why you should put post titles at the beginning is because users are more likely to search for specific post content rather than the actual name of your blog. So having the post titles at the beginning increases your chances of being found. How to optimize blogger post titles Step 1. Log in to your Blogger Dashboar