Blogger Tip Tricks and Widget

January 2014

Color Code Generator

Posted by: Unknown Posted date: 2:50 pm / comment : 0 Blogger, Blogger Tips, Seo Tips, Widgets

This Color Code Generator will help you get the six digit color code i.e hexadecimal value. It could be very effective if you want to get a perfect combination of colors for your blog and if you have a good experience about color picking and selection matching, this will help you to make your blog to look really professional. The Color Code Generator is also very useful when you try to blend the Google Adsense Ads with the site content.

Instruction
- Drag the bar on the "Hue" selector to the area of your desired color palette.
- Then click inside the Brightness/Saturation area and drag the cursor until you have achieved your desired colour. The "Swatch" bar shows you the final colour result.
- The hexadecimal colour code is generated in the "Hex" box. Simply copy the six digit code i.e #000000

How To Hex Color Code Generator?

Advertisments

Author Box Widget for Blogger

Posted by: Unknown Posted date: 1:14 am / comment : 0 Blogger, Blogger Tips, Facebook, How to, Seo Tips, Social, Widgets

I Am going to show you how to add Cool Author Box Widget for Blogger Every post/page.. Actually This widget made up of CSS+HTML & no JavaScript is used.

In this widget you can add your Google+, Twitter, Facebook and Feedburners ID so that your blog visitors can contact you easily. Also it has a subscribe email bar beside the social icons. The demo of this author box can be seen by clicking the below button

Live Demo

click here it is my new template for blogger
and it`s under constraction[Shadows-villa]

Adding The CSS.

Add The Below Code Just below <head>

Adding The HTML.
Add Html enter Post footer-line-1 by Ctrl + F and Find
<div class='post-footer-line post-footer-line-1'>

Add the code given just below <div class='post-footer-line post-footer-line-1'>

Note:If you may find more then 1 <div class='post-footer-line post-footer-line-1'>
so make sure that you are pasting under the right one.If the author box doesn`t work paste
the code, under the second tag.

<b:if cond='data:blog.pageType == "item"'>
<div class='abt-author_info'>
<div class='abt-author_photo'>
<img alt='author' height='150' src='YOUR PIC URL' width='150'/>
</div>
<h2 style='color:#444;font-family:verdana;text-shadow: 3px 3px 3px 3px #ABABAB;'>
This Post Was Written By :</h2>
<p>
Add information about you here.</p>
<div class='abt-linediv'/>
<div class='abt-email'>
<small style='text-align:center;'>Get Free Email Updates to your Inbox!</small>
<form action='http://feedburner.google.com/fb/a/mailverify' class='abt-emailform' method='post' onsubmit='window.open('http://feedburner.google.com/fb/a/mailverify?uri=FeedUsername', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true' target='popupwindow'>
<input name='uri' type='hidden' value='FeedUsername'/>
<input name='loc' type='hidden' value='en_US'/>
<input class='abt-emailinput' name='email' onblur='if (this.value == "") {this.value = "Enter your email...";}' onfocus='if (this.value == "Enter your email...") {this.value = ""}' type='text' value='Enter your email...'/>
 <input class='abt-emailbutton' title='' type='submit' value='SignUp'/>
</form>
</div>
<ul class='abt-social'>
<li class='rssicon'>
<a href='http://feeds.feedburner.com/FeedUsername'>Rss</a>
</li>
<li class='twicon'>
<a href='http://twitter.com/TwitterUsername'>Twitter</a>
</li>
<li class='fbicon'>
<a href='http://facebook.com/FBUsername'>Facebook</a>
</li>
<li class='gicon'>
<a href='https://plus.google.com/GplusID'>Google +</a>
</li>
</ul>
</div>
</b:if>

Search All Below And Change with your desired:

YOUR PIC URL

Add information about you here.

FeedUsername(you found 3 change )

Twitter

Facebook

Google +

Advertisments

How Can i Display Html Code Better On my Blogger Blog

Posted by: Unknown Posted date: 12:28 am / comment : 0 Blogger, Blogger Tips, How to, Seo Tips, Widgets

Hello Friends In this Simple Tutorial I am show you How to Display Your Html Code on Blogger or Blog Post/Page etc Just 2 Step very Easy And Very Helpful This is the version1 Click Here and i you want know More About blog plz visit Blogger Tips,Blogger Tricks, or Blogger , Seo Tips lables Okey! Let`s Start

Step 1

-Go To Blogger >> Dashboard >>
-Past Code after <head> Below

Step 2

and the following code in to <body> Wherever To Want To Put Your Code

# Your Ruby Code

Or Use This code in Your Post/etc

Advertisments

Text Border

Posted by: Unknown Posted date: 1:58 pm / comment : 0 Blogger, Blogger Tips, Seo Tips

Use Multple Text-Shadows

text-shadow: 2px 0 0 #fff, -2px 0 0 #fff, 0 2px 0 #fff,

0 -2px 0 #fff, 1px 1px #fff, -1px -1px 0 #fff, 1px -1px

0 #fff, -1px 1px 0 #fff;

Alternatively, you could use text stroke, which only works in webkit:

-webkit-text-stroke-width: 2px;
-webkit-text-stroke-color: #fff;

Advertisments

Add Alt and Title Attributes To SEO Optimize Images

Posted by: Unknown Posted date: 1:08 am / comment : 0 Blogger, Blogger Tips, How to, Seo Tips

How ALT and Title Tags For Image Optimization Works?
Before understanding the process, it is important to know that what actually ALT and Title tags are? These are the HTML attribution or tags which are used for images. ALT is specially for image whenever you can use the Title tag anywhere. These tags describe about the thing in which they are implemented. For example, if I add "Best SEO Tips" keyword in image then it will tell the search engine's crawler that this image is about SEO Tips and this will help the search engine robot to understand the media content and rank them appropriately. If you put the most searched, popular and appropriate keywords in your image then your images will be ranked higher in image search results and you will be getting enough traffic from it
===========================================
Example:

How To Add These Tags To Images In Blogger?
So if you're using Blogger Platform for your blog then continue reading. In WordPress, that platform automatically take and add the keyword from image name but in blogger you will need to implement this manually. In order to implement this tactic in your images, Go To Blogger >> New Post >> Upload Image

After adding images, Click on the image, some options will appear in the horizontal line. Click on the Properties

Now the image properties pop up will appear with the ALT and Title fields. Simply write the appropriate and main keywords in those fields and hit the OK button

Advertisments

Customized Label Widget In Blogger V2

Posted by: Unknown Posted date: 12:21 am / comment : 0 Blogger, Blogger Tips, Widgets

Okey! i am back with v2 After long searching i`ve found this label For Blogger.for Version 1 Click Here So, This is colorful Flat UI label cloud widget in which tags or labels are having multiple colors. That's why we've put "Colorful" word in its name. After this, It's look is inspired from Flat UI designs which is mostly famous these days. The colors which we've used in this widget are also Flat UI colors. Another specialty of this widget is that when someone hovers the mouse on any label it will give a beautiful effect on hover. This widget is customized using pure CSS3 and we've not used any JavaScript or any other heavy programming language which means that it will not affect on the loading speed of your blog. You can have its live demo by looking in the right sidebar of this blog. We're also using it here. So, let's start the tutorial on how can we implement this colorful Flat UI label cloud widget for Blogger

How To Add Label Widget In Blogger?

Click Here

How To customized Label Wdiget?

Step 1: Adding Labels Widget.

Go To Blogger >> Layout >> Add a Gadget

Choose {Label} Widget

Make Setting Like The Blow Image and {Save} It

Step 2: Customized Labels Widget

Go To Blogger >> Template >> Edit Html [note.Plz backup your template for Crashing]

Click And Find ]]></b:sking> Ctrl+F

Copy and Past The Following Code Above ]]></b:sking>

.sidebar .label-size {
  position:relative;
  text-transform: uppercase;
  text-decoration:none;
  font-size:13px;
  font-family:Open Sans;
  color:#fff!important;
  }

.sidebar .label-size a {
  color:#fff!important;
  font-weight:bold;
  padding:8px 10px;
  margin:0 6px 6px 0;
  float:left;
  display:block;
  -moz-transition: all 0.4s ;
  -o-transition: all 0.4s;
  -webkit-transition: all 0.4s ;
  -ms-transition: all 0.4s ;
  transition: all 0.4s ;
}

.sidebar .label-size-1 a {background:#1abc9c;border-bottom:3px solid #127F69;}
.sidebar .label-size-1 a:hover {background:#16a085;}
.sidebar .label-size-2 a {background:#3498db;border-bottom:3px solid #226693;}
.sidebar .label-size-2 a:hover {background:#2980b9;}
.sidebar .label-size-3 a {background:#2ecc71;border-bottom:3px solid #1F8C4C;}
.sidebar .label-size-3 a:hover {background:#27ae60}
.sidebar .label-size-4 a {background:#9b59b6;border-bottom:3px solid #74398E;}
.sidebar .label-size-4 a:hover {background:#8e44ad}
.sidebar .label-size-5 a {background:#e74c3c;border-bottom:3px solid #922C20;}
.sidebar .label-size-5 a:hover {background:#c0392b}

Click Save "Template"

Enjoy! You've successfully customized colorful Flat UI label cloud widget in your blog.

Label Widget In Blogger v1

Posted by: Unknown Posted date: 2:21 pm / comment : 1 Blogger, Blogger Tips, How to, Widgets

Blogger is a huge platform to customize sites and make changes what you want. You can easily change all widgets in Blogger. By default in blogger templates label widgets also including with simple effect but you can change this style because Blogger provide to customize all widgets and blogger template with html and css. For this cause i am now sharing this beautiful label widget. Add this in your site / blog by following the below steps.

Blogger is a huge platform to customize
sites and make changes what you want.
You can easily change all widgets in
Blogger. By default in blogger templates
label widgets also including with simple
effect but you can change this style
because Blogger provide to customize
all widgets and blogger template with html
and css. For this cause i am now sharing this beautiful label widget. Add this in your site / blog by following the below steps.

How to add Label Widget in blogger?
Click Here

How To Customize Label Widget

Follow my steps:

1.Go To Blogger >Template

Click Edit HTML

Search for ]]></b:skin> by Pressing Ctrl+F

And This Following Code Above it.

Click Save Button Done!

Enjoy:new Label Style

How To Add Categories Section On Blog

Posted by: Unknown Posted date: 3:24 pm / comment : 0 Blogger, Blogger Tips, How to, Widgets

Blogger Blog does not support categories but has only comes with labels, In this tutorial i will show you how to manually create categories in Blogger blog. Category is a very important section of any blog or website, because with the help of categories people can easily find what they are looking for. Now we would manually create category section in blogger from labels, This tutorial is aimed at beginner bloggers, Let me explain how to add category section in blogger blog.

The first and easiest way to create categories section in Blogger is to rename the section of labels widget as categories. Of-course this is not the appropriate solution for a blog in which there are huge number of labels. An easy way round this problem is create a separate categories section.

How To Add Categories Section on Blog?

1. First of all you have to decide how you want to group your articles, according to the labels applied, and what group heading you want to give to each grouping of articles.

2. Navigate individual page of the label for first category which you want to use by clicking on the label in side bar. Copy URL address of this page. For example the URL address of the label of Blogger Widget on my site is :

http://blogger-tips-tricks-widget.blogspot.com/blogger-tips-tricks-widget.blogspot.com/search/label/Widgets

3. Now go to Dashboard > Layout > Add a Gadget > Link List

4. Enter "Categories" as the title

5. In the Configure Link List dialog box, paste the link of the label you've copied from the address bar to Site URL

Info:Title your Categories section,

Second Box:It is a limiter set your limit if want or not so leave blank

i hope you understand ,after past your label url in [new site URL] box click add link

That`s All Enjoy

Popup Window

Posted by: Unknown Posted date: 12:58 am / comment : 0 Blogger, Blogger Tips, How to, Widgets

You might notice in some websites that a popup window opens suddenly without the knowledge of you which leads to other websites and they do it for some promotional purpose.

It’s easy to add popup window for blogger and adding popup window helps in increasing page views of your blog and you can help visitors to know useful links within your site and other external sites.

How To Create A Popup Window For Blogs?

Go To Dashboard >> Layout

click "Add Gatget" from sidebar or footer

Open HTML/JavaScript

Note:

Make Sure To Change The http://blogger-tip-tricks-widget.blogspot.com URL

Customize The Width and Height of the POPUP Window

Now a popup window opens pointing to that page when users click somewhere on your blog.

How To Add Widget On Blog

Posted by: Unknown Posted date: 2:45 pm / comment : 0 Blogger, Blogger Tips, How to

Very easy to add widgets on blog just follow my steps

Step1:

Go to your Blogger Dashboard

Select your blog and click Layout

Click Add a Gadget

Step2:

find HTML/JavaScript on pop up window and click on it

Step3:

1: Type your widget Title

2: Past your widget code on this section

3: Click Save Button

you have Done!

Enjoy

More Blogger Tricks

Live Visitor Showner Widget

Posted by: Unknown Posted date: 11:13 pm / comment : 0 Blogger, Widgets

Live Visters Showner Widget for your Blog/Site More Widget click on it

Actually This post about Live Visiters showner For this widget click on this link

whos.amung.us

Follow my Steps:

Step 1: click on widgets page

Step 2: Choose Widget
There Are many types of widgets example blow

Type # 1

Type #2

Type # 3

Type # 4

The Tab Widget

Type # 5

Type # 6

Step 3:copy The code and past to your site/blog
the code in JavaScript form
Enjoy

How Mark Zuckerberg Facebook CEO Travels Like A Billionaire Facts

Posted by: Unknown Posted date: 3:11 pm / comment : 0 Facebook

To live the rich lifestyle. Facebook announced on Wednesday through its submitting an initial public offering (IPO) just how the organization worked out in the 2011, and also keep in mind, its employees has extreme work up as well as they spent vast earnings last year.

What Is The Actual Salary Of Mark Zuckerberg Facebook CEO?

Ones Facebook IPO offered details in regards to the base income of the team, wich inculudes Chief Executive Officer(CEO) Mark Zuckerberg getting ongoing revenue of $483,333, which includes a $220,500 bonus and also other award worthy of $783,529.

How Much Money Mark Zuckerberg Spend On Transport?

The submission revealed that he spent almost $700,000 expenses related to personal private airplanes he used “chartered regarding it's specific protection program and also on which family and close friends travelled during 2011with him.” Which will involve ride fees, gasoline, crew and also food catering costs. Yet another $90,850 of that money ended up being for “price tags interrelated to estate and financial planning.”

Officials were under fire in the past few years because of the bank account bailout issues for spending top dollar on renting private aeroplanes. But quite a few high-paid executives most notably Steve Jobs continue to made some room for traveling in luxury. In fact, flying private was one of the few splendid luxuries.

Actually Mark Zuckerberg Was Not The Top Paid Person In The World Then Who?

Even though Zuckerberg was not the highest paid Facebook employee during 2011. In fact, COO Sheryl Sandberg who is a Facebook Employee- who achieved a basic salary of $300,000 -raked in $30.87 million last year.
Unfortunately, if Facebook is able to raise this capital, it might be on a shortlist for the biggest tech IPOs of all time, and Zuckerberg’s net amount worth will skyrocket mainly because he owns 28.4% of the company. In fact, Zuckerberg’s wage may fall to $1 annually.

Facebook Current Statistics At Present

Facebook - that earned $1 billion on sales of $3.7 billion in 2011 - presently has 845 million active users on the site,the estimated 800 million peoples using the site back in September. This company also noted that 250 million pictures are uploaded daily and 2.7 billion likes and comments are made each day.Totally there are 100 billion friendships found on the site.

Bring Facebook Like/Dislike From Social To Real World

Posted by: Unknown Posted date: 3:00 pm / comment : 0 Blogger, Facebook

Finally, you can get a dislike button which allows you to stamps upon stuffs that you really dislike.Facebook will never Provide the dislike button simply because these people hate the concept of disliking things, so atleast you will get a dislike or like button on a rubberized stamps set, just for entertaining.

For example you don't like your Friends high marks in the exam so you can stamp it as dislike in his paper.

Like that you can make stamp on papers,pictures,on some ones face,like a tattoo,or in your wall,in your bike,car,in your computer, laptop skins,status etc. you don't like/dislike using the seal of approval stamp

Like this in your girl friends face

So how much it cost to buy?

EBay-US $12.95

Pages

Latest

Total Pageviews

Followers

Blog Archive

Visitors

Advertisment

Advertisment

Feature Post

Color Code Generator

Author Box Widget for Blogger

How Can i Display Html Code Better On my Blogger Blog

Text Border

Add Alt and Title Attributes To SEO Optimize Images

Customized Label Widget In Blogger V2

Label Widget In Blogger v1

How To Add Categories Section On Blog

Popup Window

How To Add Widget On Blog

Live Visitor Showner Widget

How Mark Zuckerberg Facebook CEO Travels Like A Billionaire Facts

What Is The Actual Salary Of Mark Zuckerberg Facebook CEO?

How Much Money Mark Zuckerberg Spend On Transport?

Actually Mark Zuckerberg Was Not The Top Paid Person In The World Then Who?

Facebook Current Statistics At Present

Bring Facebook Like/Dislike From Social To Real World

Advertisment

Search Box

Popular Posts

About Me

Popular Posts

Advertisment