Follow Me:

Showing posts with label Tutorial. Show all posts

Tuesday, September 2, 2014

TNB Notification Style Using HTML, CSS and Javascript

TNB Notification Style Blog

I would like to share a simple and clean notification message style for adding it on your blog or website. There are a lot of ways to shown notification message to users but this notify shows the message and disappears within second. This notification is created using CSS, Javascript and HTML code.

Thursday, August 28, 2014

How to Add Facebook Graph Search on your Blog

Facebook Graph Search on your Blog

We all know about Facebook graph search which helps us discover a lot of thinks like find friends, movies, game etc and today we have created a simple graph search like Facebook for blogger. Our graph search doesn't work like the Facebook one but it simply created to search blog post and we call it the version 1 graph search or Blogger graph search. This is just a simple one with blog post search but next time we will include additional things to it.

Monday, August 25, 2014

How to Add 9GAG Style Social Media Buttons for Blog

9GAG Style Social Media Buttons for Blog
Today i am going to add some interesting CSS style code which you may have seen on 9GAG funny site header, the slogan and social love button. Some of you blog owners may be waiting to add this cause you may have a lot of gadgets on your blog or site sidebar cause the like box takes a lot of space in the sidebar and adding all the social link in one line on the top make it easy for people to follow and like your blog or site which even make it look clean.

Add Adsense Ad Right After <!--More--> Tag

Adsense Ad Right After More Tag

In today tutorial we will learn about multiplying your click through rate by adding the Adsense tag or any other ads. After focusing a lot about writing this week we came across some blogs adding ads above the post footer, or in the middle of the paragraph (Post Summary) or even right after the read more (Jump Break link). This will tell the browser to show the Ad zone using a div, right after the read more tag. If you are adding the tag right after the HTML "<!--more-->" tag, you will need to place a (460X60 Adsense content Ad) to make it look clean.

Saturday, August 23, 2014

Adding Blog Post Label On Image

Adding Blog Post Label On Image

I have seen a lot of professional blog design and top website having post labels on image, while normal blog and custom templates show their post labels below post footer or below the post title. If you are one of them finding to add label on image don't worry we have created one, this is been created using CSS and HTML code.

Friday, August 22, 2014

Make Blogger Navigation Bar Transparent + Hover On Post Image

Make Blogger Navigation Bar Transparent

I have got a few emails and questions from bloggers about the navigation bar which i am been using on my blog, how did't you make it transparent. So i will so you a tutorial on how to add this effect to your blog + Hover on Post Image .

Wednesday, August 20, 2014

Google Translate Widget Version 2

Google Translate Version 2

We have found out users are using flag style translate script in the their blog while Google has got its own translate, bloggers who are using Google translate know Google translator has 3 different styles Vertical, Horizontal and Dropdown while there is a lot.

Add Author Box Below Posts in Blogger

Author Box in Blogger

The big think today in blogger and website are article writer's and people find them on Google+ Twitter they even follow them on Facebook or add them as friends now what we have figure out, is adding author posted customize.

In custom blog's and designed template there is nothing more than by the author or written by this author with an description In today post i have created a simple author style with Google+ and Facebook follow button.

Tuesday, August 19, 2014

Add Facebook Like Sidebar Ads to Blogger

Facebook Sidebar Ads

You all have seen Ads on Facebook on the right sidebar. Today i am going to teach how to add Facebook ads on your blog with CSS code

You can add your website link and your own custom text to it by just changing the code so lets start the tutorial on how to create Facebook ads bar.

Friday, August 15, 2014

Remove Image or Picture Shadow from Blogger

Remove Your Blogger Picture or Image Shadow

Blogger's uploading image in blog post find their images with annoying borders and shadows, if you need to remove the annoying borders and shadows from the images you need to follow this steps below:-

Add Meta Description to Blogger

Meta Description Blogger

The most important part of blogging is SEO and meta tags which are added to the header of website that helps users visiting your site, these tag are used for giving information about the page, like the description, title, key word date and author name.

Shown Blogger Image on Main Page and Hide from Post Page

Some of you blogger might be wondering how or why anyone hide their images from blog post page and show them on homepage or main page. So the answer is adding more images on your blog post shows in the Thumbnail Gallery Post well some blogger don't need to show main image on their blog post page.

To use this you need to follow the steps:
Blogger's who are using the old interface need to first. Go to blog Dashboard then -Design- Edit HTML the main part is to (download the full template)

Creative Commons License