The Yellow Bulb│Blogger Tips n Tricks │ Tutorials and Widgets

Enable HTTPS for Blogspot domain blogs

noreply@blogger.com (Debbie Navarro PH) — Sun, 30 Apr 2017 16:04:00 +0000

Google rolls out a new feature that enables all blogspot domains to be on https encryption. It was first introduced for blogspot blogs last september 2015.

HTTPS is fundamental to internet security; it protects the integrity and confidentiality of data sent between websites and visitors' browsers.- Official Blogger Blog

This feature only applies for blogspot blogs under .blogspot.com domain. Https feature isn't supported for custom domain at the moment.

By default, blogger offers both options to use http or https for your blog as most of custom theme's doesn't work well or cause bugs with https encryption , so better run a test first before moving with https for your .blogspot.com domain.

You can enable this feature by going to Settings > Https > Select your Http Redirect option. Once published your blogspot domain will show green secure lock which means the connection is secure.

Watch this video to learn how to activate Https to your blog

FIXED: part of the process of setting a preferred domain is to verify that you own

noreply@blogger.com (Debbie Navarro PH) — Mon, 24 Apr 2017 02:26:00 +0000

The issue "part of the process of setting a preferred domain is to verify that you own..." appears when you tried to set your preferred domain for your site www and non www. To make the issue disappear and finally choose your preferred domain follow this quick fix to save time and finally resolved the issue on your google search console.

1. Login to Google Search Console
https://www.google.com/webmasters/tools/
Dashboard > Click the Gear icon drop down > and choose Site Settings

2. Test the domains
here is the screenshot of the issue if you try to link your www and non www domain

3. Fix the issue
Go to Search Console home
Add Property > add your non www site domain , it will automatically gets verified

4. Choose Preferred Domain
Choose your site > go to site settings , check if its your www or non www site is selected then select your preferred domain (in my demo its my non www site) . Click save and your all set.

Do the same process for your other domains that will face the same issue.

Is this post helpful? Let me know your thoughts by the comment box below.

How to add Google Analytics on Blogspot

noreply@blogger.com (Debbie Navarro PH) — Sun, 23 Apr 2017 12:16:00 +0000

Google analytics helps you track your audience real time page views, demographics, numbers of users, average sessions duration's and bounce rate. This step-by-step guide will help you on how to easily install google analytics code to your blogger blog theme. This will require you a bit knowledge on editing html section of blogger your "template" section. Follow the steps below to get started.

1. Login to Google Analytics
https://www.google.com/analytics/
Select your site and locate admin tab at the bottom left sidebar

2. Property tab > Tracking Info

3. Select Tracking Code

4. Copy Website Tracking code
Select the box and copy the code inside, paste it in a notepad as we will need it later.

5. Now go to your blogger dashboard
Select Theme tab > Click Edit HTML > Press CTRL+F to Find this code </body>
and paste the Google Analytic code you previously saved before </body> tag.

Save your changes and all done.

Having trouble? Watch this video tutorial.

Is this post helpful? Let me know your thoughts by the comment box below.

How to Get Google to Reindex Your Website Quickly

noreply@blogger.com (Debbie Navarro PH) — Tue, 18 Apr 2017 11:10:00 +0000

Every business wants visibility , but publishing a new post or updating your website content doesn't guarantee that it gets visible on google search results right away. This usually takes some time but there's a way to make google reindex your site content quickly- by using the tool "Fetch as google" on google console. This will force google to reindex your blog or your post right away upon submission and make the changes visible on search results.

Ever wonder when did google last take a peak on your site? Well, there's an easy way to do that. Search your own site by pasting in your URL to search input , once search results appear click the drop down beside your web address and clicked cache.

Let's get started with Google Search Console

1. Create Gmail Account (Skip this step if you already have a gmail account)

Its necessary to have a gmail email account or a white labeled email will do

2. Login to google console

go to: www.google.com/webmasters/tools/home

3. Add your site

click "add property" and verify your site

4. Select your blog/site

Once selected , go to dashboard > crawl > Fetch as google

5. Perform a fetch

You can add your link to the input box beside your site or reindex your homepage

Select Fetch and Render (leave it blank if you want the homepage to be fetch)

6. Request Indexing

Once submitted , the status will start loading and you will see option for "Request Indexing"

7. Choose your options

Pop up appears for more options , please choose depends on how do you want the link to be crawl

Click Submit to queue your request.

Recrawling is not immediate or guaranteed.

Google doesn't guarantee it index all your changes, as Google relies on a complex algorithm to update indexed materials.

The test i did was successful most of my new post was already indexed and appears on search results. To do the test , just copy your entire post URL and paste it on google search . If its successful you will see the post on search results.

How did it go? Do you encounter any issue with this tutorial? Do let me know by leaving a comment below.

How To Add Post Views Counter To Blogger

noreply@blogger.com (Debbie Navarro PH) — Mon, 17 Apr 2017 06:19:00 +0000

This plugin is a great addition to your blog by letting your readers see how frequent the post was viewed. This might not be as accurate as GA but this plugin works like a charm, thanks to Firebase for making this possible by hosting this for FREE.

The process will require some editing on the Template section so i suggest to back up the theme first , here's how to back up your blogger theme. If your done backing up your theme lets get started.

1. Create Firebase account

Go to: https://firebase.google.com/

Start by creating an account , once done you will be redirected to firebase dashboard

2. Create a Project

Go to: https://console.firebase.google.com/

Click "Add a project" to get started

3. Go to Database Tab and copy your Firebase database link

save it as we need it later

4. Now go to Blogger Dashboard > Theme > Edit HTML

Copy this code then paste it before <data:post.body/> so it appears above your every post and below post title.

<a expr:name='data:post.id'/> <i class='fa fa-eye'/> <span id='postviews'/> Views

5. Add this Javascript before </body>
to find </body> press (CTRL+F)

<script src='https://cdn.firebase.com/v0/firebase.js' type='text/javascript'/>
<script>
$.each($('a[name]'), function(i, e) {
var elem = $(e).parent().find('#postviews');
var blogStats = new Firebase("https://YOUR-APP-NAME.firebaseio.com/pages/id/" + $(e).attr('name'));
blogStats.once('value', function(snapshot) {
var data = snapshot.val();
var isnew = false;
if(data == null) {
data= {};
data.value = 0;
data.url = window.location.href;
data.id = $(e).attr('name');
isnew = true;
}
elem.text(data.value);
data.value++;
if(window.location.pathname!='/')
{
if(isnew)
blogStats.set(data);
else
blogStats.child('value').set(data.value);
}
});
});
</script>

6. Change the highlighted Red with your Firebase database link you previously saved.

Save Your theme now and the plugin works great!
To check the demo , check the views counter above my post.

How do you like this plugin? Any issue with the installation? Do let me know by leaving a comment below.

Learn How To Back Up, Restore and Upload a New Template on Blogger

noreply@blogger.com (Debbie Navarro PH) — Sun, 16 Apr 2017 15:27:00 +0000

I will give you an idea to learn the 3 basic essential of the new blogger interface, The Back Up/Restore or Uploading a new template. These are one of the most basic methods you must know to have a full control to your data safety. Once you’ve learn how to do this – you will be more confident and at peace. On uploading a new blogger template there are some factors you need to know, first always think what verification codes, scripts you inserted on your existing blogger template that is very important to be restored. Second, on the new blogger interface all your existing gadgets will be restored and remains the same as it is. They may look mixed up on the different positions but you can always arranged them anywhere you like.

Backing Up An Existing Blogger Template

If you are not much knowledgeable on the structure of the blogger xml template it is advisable for you to back up your template, so in case that you made some mistakes and you really screwed it – you can always restore your data.

Blogger Dashboard
Template
Look at the right side and you will see the BACKUP/RESTORE button,
Click that,

View Screenshot Below

A pop up window will open that appears to be like this
Click the “Download Full Template” which will prompt you to save your xml file to a specific folder on your computer.

NOTE: When backing up your Blogger template, the file is saved in the format of “template-1234567890.xml”. You can rename it later to avoid confusion.

How To Restore and Upload a New Blogger Template

Restoring your last saved xml data and uploading a new blogger template comes with a one process. You can simply do that by,

Following the step 1 (except the very last part)
Instead you should click the BROWSE or CHOOSE FILE option,
Locate your XML template and hit ok,

You will then see a success message when the process is all complete.

That’s it, you can now do this as often as needed. I hope that this tutorial helps you in some way.

Testimonial Slider Text Widget with JQuery Cycle Plugin

noreply@blogger.com (Debbie Navarro PH) — Sun, 16 Apr 2017 06:30:00 +0000

The jQuery Cycle Plugin is a slideshow plugin that supports many different types of transition effects. Options control how and when the slides are transitioned. In this Testimonial Widget the Jquery effect will be FADE .You can customize the look and feel of the widget if you desire.We can achieve that Just by following this few easy steps below.

CLICK HERE FOR LIVE DEMO

APPLYING THE JQUERY CYCLE PLUG-IN IN YOUR WEBSITE/BLOG

Go to your Blogger Dashboard
Template
Edit HTML
Proceed
Click "Expand Widget Template"
Press CTRL+F for search shortcut>
And find this code

</head>

And Just BEFORE/ABOVE That paste this Jquery Cycle Plugin

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js' type='text/javascript'/>


<script src='http://cloud.github.com/downloads/malsup/cycle/jquery.cycle.all.latest.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function() {
   $('#testimonials')

    .cycle({
        fx: 'fade',

     });
});
</script>

NOTE: DONT INCLUDE THE SHADED BLUE SCRIPT IF YOU ALREADY HAVE A JQUERY PLUGIN INSTALLED IN YOUR TEMPLATE

Next, Find this piece of code

]]></b:skin>

And just ABOVE/BEFORE that, Add this CSS code for your widget

}
#testimonials { width:330px; background:#E7E9E6 url(images/bg-testimonials.png) left top repeat-x; border:1px solid #D8D9D6; margin:10px 0; }
#testimonials p{ margin: 0 !important;padding: 5px!important; }
#testimonials p cite { font-style: normal; display: block; text-transform: uppercase; font-weight: bold; font-style:italic; color: #555; padding-left:5px; margin-top:10px;
}

NOTE: DONT FORGET TO CLICK PREVIEW TO CHECK FOR ANY ERROR

THE LAST PART.. ADDING THE TESTIMONIAL WIDGET ON YOUR BLOG

Go to your Blogger Layout
Add a Gadget
And insert this Widget Code

<div id="testimonials">

<p>"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. "                 <cite>–Debbie - NY</cite></p>

               <p>"Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."                 <cite>–Johnny - LA</cite></p>

                <p>"Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
                <cite>–Ray - MA</cite></p>

</div>

CUSTOMIZATION OF YOUR TESTIMONIAL WIDGET

Change The Names with your own
Change The Place with a website or anything you like
And change the Sample Paragraph with your testimonial content
Change #E7E9E6 for your widget Background
Change 330px for your widget width size
Change #D8D9D6 for your widget border

Credits

The original idea comes from parorrey.com , Thanks Ali for this wonderful script

YOU CAN SAVE YOUR TEMPLATE NOW

And see it working perfectly on your blog

ARE YOU CONFUSED REGARDING THIS TUTORIAL?

If you have any difficulties implementing and/or following this tutorial, Feel free to keep in touch with me and ill try my best to work it out.

UPDATE: The Plugin no longer works for blogger.

Blogger Released New Responsive Themes

noreply@blogger.com (Debbie Navarro PH) — Sat, 15 Apr 2017 18:18:00 +0000

Blogger has been around for quite a long time and a lot of new blogger or pro ones had been using blogger as their blogging platform. Its great to see some new updates from blogger , its quite a long time you know :) . It looks great and works great for any type of post. Its 100% responsive, fast loading themes , color scheme options , built in social sharing (improved) , subscription pop up , search bar , related post widget highly improved etc. Only one column footer is available for all new themes and the sidebar isn't visible until a certain viewpoint is reached.

Here's a quick look of the new designs:

1. Contempo

As good for a photo as it is for a story, Contempo puts a fresh, modern spin on life’s many adventures.

[image source: Official Blogger Blog]

2. Soho

Spare and simple, Soho is a gallery built to showcase your latest photos, designs or musings in their best light.

[image source: Official Blogger Blog]

3. Emporio

From projects to objects, Emporio can take any array of posts and display them in a neat and tidy way.

[image source: Official Blogger Blog]

4. Notable

Whether you’re feeling pithy or profuse, Notable is your notepad for scribbles, stories, and so much more.

[image source: Official Blogger Blog]

To see all of the different theme variations, and to try on a new one for your blog, visit your blog dashboard and select the Theme tab.

How do you like this new themes? Do let us know and leave some comment! :)

Top 10 Sites To Get FREE Blogger Templates 2017

noreply@blogger.com (Debbie Navarro PH) — Fri, 14 Apr 2017 17:36:00 +0000

Blogger is the oldest blogging platform still actively running. Millions of blogs are hosted under blogger since its FREE , Good SEO Built in Options, Owned by Google , Built in Adsense Options and a user friendly interface. Blogger released themes was all looking generic and basic, so most of us wanted more for our blogs, that matches our niche and business categories.

Changing the theme wont lost any post or content to the blog, except if the changes was done directly to your theme such as meta tags, google verification, ad code and so on. So make sure, to back up those files before installing new theme and add it back again if needed. here i listed below the top 10 sites to grab that new looking blogger theme for your blog.

1. Gooyaabitemplates

2. Btemplates

3. Sora templates

4. Theme Xpose

5. My Blogger Themes

6. Templateism

7. Deluxe Templates

8. Odd Themes

9. Template Lib

10. Lovely Blogger Templates

How to Set Up AddThis Smart layers on Blogger

noreply@blogger.com (Debbie Navarro PH) — Tue, 30 Jul 2013 08:57:00 +0000

AddThis introduce its new feature “Smart Layers” to make blog and websites increase traffic and be social friendly. “Smart layers” include Follow buttons, Recommended Contents, Sharing Buttons on The left and What’s next on right corner. This will be a good impact as it is mobile friendly so even you visitors visit your site through mobile gadget the plug-in adjust its size and look to screen resolution. This is a complete tool for everyone who what’s their site more interactive and can be easily shared content. No need to be a techy genius as you only need to insert ONE PIECE of a code. Keep reading to see its features and benefits for your websites.

Easy Installation - Add share buttons, follow buttons, and content recommendations to your pages with one piece of code.

Mobile & Tablet Ready - Designed with mobile in mind, Smart Layers adapts to mobile form function and is retina-ready with no extra work.

Any Site, No Disruption - Easy-to-install layers float effortlessly over your content without disrupting your layout. Now that's smart!

Works With other AddThis tools - Smart Layers works seamlessly with other AddThis tools like Share and Follow Buttons, and includes complete analytics reporting. See a demo.

Personalization Features - AddThis shows every visitor recommended content and the social tools that are most relevant and likely to drive engagement.

(Source: AddThis.com)

To Ger Started :

Go To AddThis.com
Turn On the Features you wanted to add on your blog
Once your done setting up click “generate code” the code similarly looks like this.

<script src='//s7.addthis.com/js/300/addthis_widget.js#pubid=xa-51e5127b200e4495' type='text/javascript'/>
<script type='text/javascript'>
addthis.layers({
    'theme' : 'transparent',
    'share' : {
      'position' : 'left',
      'numPreferredServices' : 5
    },
    'follow' : {
      'services' : [
        {'service': 'facebook', 'id': 'Debbie.Navarro17'},
        {'service': 'twitter', 'id': 'DebNavJohnny'},
        {'service': 'linkedin', 'id': 'debbienavarroph'},
        {'service': 'google_follow', 'id': '113621236330003247058'},
        {'service': 'pinterest', 'id': 'debz2012'},
        {'service': 'rss', 'id': 'http://feeds.feedburner.com/DebbiePortfolio'}
      ]
    },
    'whatsnext' : {},
    'recommended' : {
      'title': 'Recommended for you:'
    }
});
</script>

Log in To Your Blogger Dashboard
Template
Edit HTML
CTRL+F to Find this piece of code

</body>

And paste your generated code above/before closing body tag.
Save Your Template and see it works perfectly.

That's how simple to add this plugging and it works automatically indexing every page and post you have and start showing it to your readers.

Customize Bullet List on Post Area For Blogger

noreply@blogger.com (Debbie Navarro PH) — Mon, 24 Jun 2013 15:27:00 +0000

Adding an image as your new bullet list will surely add an impact to your readers. It is very catchy and professional looking. This post will guide you on how to easily modify your old and native bullet list look. This is an advanced tutorial but very easy to follow through. I am sharing 5 list icons so you could choose from but you can always changed on your own icon choice. The CSS style is set to work on your post area only.

Adding the Bullet List CSS

Go To Your Blogger Dashboard
Template
Edit HTML
Click Anywhere inside & Press CTRL+F the search box will pop up
Find </b:skin>
Click the Drop Down Arrow (See Screenshot Below)
Paste The CSS Code Above/Before it

</b:skin>

Here are the Bullet list

ul
{
list-style:none;
}
.post ul li
{
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrye1thBIrPrwuGmjNR_QDLHKo4t72yGV8ddu3ETahMFzetetfpJJkR3fm9C7ARbsK0C69bu1WzBJTbtN5NdBGDJL3UcZ6sgZ_J9gYBMhjrNImekhuvPp2fepB1HyijLkEv_vo2gltqfM/s1600/list.png)no-repeat top left;
min-height: 52px;
padding-left: 60px;
list-style-type: none;
line-height: 2.3em;
font-family: Arial;
font-weight: bolder;
}

ul
{
list-style:none;
}
.post ul li
{
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi5vTVJHJ_GzWBoUF7tpIHvvZshqL5rLfLIpqmcq1E8wWj2d5_FFq6eNUn-1n8aATIkPUp0yj1lxFITtJ844w-XmEkQ0ljQQL6NEY1n_TqkwZfLNNK_nB5Cm2xr_42FgarsjWcpJBtirbU/s1600/list5.png)no-repeat top left;
min-height: 52px;
padding-left: 60px;
list-style-type: none;
line-height: 2.3em;
font-family: Arial;
font-weight: bolder;
}

ul
{
list-style:none;
}
.post ul li
{
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgskEV231nKtTuXtGwT0IYfdtFP81q3Df_IC1QXFKQa3ip7DJ2bqbVDsj6oPvSE91obhO19BhVBJbowOwD9-IL2Z_D8y4NcZsicZHaCWpspdfnF6GovER-IjemGwSj5_aRAdiZNswTV2iQ/s1600/list2.png)no-repeat top left;
min-height: 52px;
padding-left: 60px;
list-style-type: none;
line-height: 2.3em;
font-family: Arial;
font-weight: bolder;
}

ul
{
list-style:none;
}
.post ul li
{
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiXGGWzgslssUScaJ58YNUChlCd7xlfemg3PwIIW3Izv6t1T_FDnlYiRsCKS7RZ35LHIwpHbI4xeUfeMc5uRvA8o1J-UG-AwubT-mVhQY4pfD6A58yvnDj7tGPnmYU0OhEZEk-ksgVCi6s/s1600/list3.png)no-repeat top left;
min-height: 52px;
padding-left: 60px;
list-style-type: none;
line-height: 2.3em;
font-family: Arial;
font-weight: bolder;
}

ul
{
list-style:none;
}
.post ul li
{
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgC-Y8puvOUvspmgrpewLXd0gEjfsOUyrcYVMzcRQ0FwxHOazIi8md0o9oF60WxbdGrYkIMPXHFO091u_RiINzPJgcXgoXAVmFJxAxkyMp1Pe9bf0yO2sLSyHnPzH-j7jddqFWkUVyBqu8/s1600/list4.png)no-repeat top left;
min-height: 52px;
padding-left: 60px;
list-style-type: none;
line-height: 2.3em;
font-family: Arial;
font-weight: bolder;
}

Optional

To Set The Font Size on your bullet List add

font-size: 12px;

Try it & Enjoy!

Introducing Google+ Followers Gadget On Blogger

noreply@blogger.com (Debbie Navarro PH) — Wed, 28 Nov 2012 13:19:00 +0000

Blogger Buzz recently released a news regarding the newly added Google+ Followers gadget. A much awaited feature for bloggers. This will enhance your followers visibility by displaying the summary number who followed your blog. Makes it easier for your audience to follow you and grow your readership across the web. You can either connect with them through google+ stream and to your blog. To get started you need to create and connect your google+ page to your blog. If your interested to know how to add this gadget in more detailed manner, just keep reading.

CREATING AND CONNECTING YOUR GOOGLE+ PAGE TO YOUR BLOG

Simply log in to your blogger dashboard
locate your Google+ tab underneath the comments tab
There you will see a button “Create A Page”
Then start filling the information about your blog.
After your done filling the information needed,
proceed to next step……

ADDING THE GOOGLE+ FOLLOWERS GADGET

No fancy work needed,
Just go to your Blogger Dashboard
Locate Layout Tab
Click “Add a Gadget”
Choose “Google+ Followers”

You can now save your template!

That’s all about it, you can also add a google+ plus one button so your audience can easily recommend your post to their google+ stream.

PULSE!

Which one do you prefer? the newly added Google+ follower or the Google Friend Connect? Let me know!

How To Add PayPal Donate Button On Blogger

noreply@blogger.com (Debbie Navarro PH) — Wed, 14 Nov 2012 06:46:00 +0000

In this tutorial I will guide you step-by-step on how you can add a PayPal Donate Button on your blogger website. If your running a charity or a non profit organization , And you provide helpful tips to your beloved readers , you may probably wanted to receive cash in kind donation’s for your achievements and hard work. And to make it possible we’ll use PayPal to receive & send money securely online. In order to withdraw the cash donations from your Paypal account add your debit or credit card to get verified and withdraw directly to your bank account. Since the code was HTML you can also add this on your pages or blog posts. Now, Lets move forward on adding this in your blog/website.

Creating A PayPal Donate Button

In order to create a PayPal button, Firstly you have to create a PayPal account here its FREE.
After successfully creating your account, and confirming it – You have to Log In.
After logging In, Locate on your navigation menu the “MERCHANT Services” Tab.

Click that menu and proceed by scrolling down.
Find the Key Features menu at the right sidebar

Click/Select DONATIONS on the list
There you will start creating/customizing your Donate Button.

On Step 1, Choose a button type to “DONATIONS”
Insert your Organization/Website/Blog Name
OPTIONAL: You can put a donation ID
Tick the “Customize Button” to set the look & feel of your donate button
Look at the right side for your BUTTON PREVIEW

On Step 2, After clicking the drop down you can now choose your button style
Tick display credit card logos
Set the country & language
OPTIONAL: You can upload your own donate button just click the bullet icon
You can set your local currency but just to make it international, set it to U$D (US DOLLAR).
You can set if you wanted the contributions to be fixed amount or not (PREFERRED).

You can proceed to the next steps but those are absolutely optional.
If your already done, click CREATE BUTTON.

This is the final step on creating your button, Simply copy the HTML code by clicking SELECT CODE.
For the mean time, you can temporarily save it to your notepad
And now we can proceed on installing this on your website.

INSTALLING THE PAYPAL DONATE BUTTON ON BLOGGER

Go to your Blogger dashboard
Layout
Add a Gadget
Choose “HTML & JAVASCRIPT”
And insert your DONATE BUTTON CODE
You can position it on your footer or Sidebar

INSTALLING YOUR DONATE BUTTON ON POST OR PAGES

On Creating a Post or Page, simply switch from COMPOSE TO HTML
And simply paste the code in it.

Feel free to view your site

And see it working perfectly. ENJOY!

Add This Animated Flash Clock's Widget

noreply@blogger.com (Debbie Navarro PH) — Sat, 03 Nov 2012 07:47:00 +0000

Animated Flash Clock's for your website. It automatically set's & shows the local time of your readers/viewers country. This can be easily installed on any website by just copying the html code below. We have Analog, Digital, Antique, Neon, Block, 3D and Glowing Clock's on the list. Browse the list below and grab one of your choice.

INSTALLING ANIMATED CLOCKS ON BLOGGER

Go to your Blogger Dashboard
Layout
Add a gadget (add anywhere you like)
Choose HTML/JAVASCRIPT
and paste your desired ANIMATED FLASH CLOCK CODES

NEON FLASH CLOCK

BLOCK FLASH CLOCK

DIGITAL FLASH CLOCK

ANALOG FLASH CLOCK'S

ANTIQUE CLOCK'S

GLOWING CLOCK'S

3D CLOCK

Photo source: http://commons.wikimedia.org/wiki/File:Antique_Clock_Face.jpg

Advanced Email Subscription Widget For Blogger

noreply@blogger.com (Debbie Navarro PH) — Sat, 03 Nov 2012 07:46:00 +0000

E-mail Subscription allows your valued readers get fresh updates directly from their inbox. This E-mail subscription is powered by FEEDBURNER so, if you wish to offer an email subscription for your site/blog get your feed burned here & create a RSS account to take advantage of this Subscription Widget. We call it widget cause what you would do on the installation of this is just a simple copy & paste, yes… no more tweaking, just your FEEDBURNER ID needed. I would like to mention the designer of this form but I really forgot the link (Too Bad…) – so if you came across on my site, let me know I would loved to add the credit for your awesome design. Moving forward, This widget is originally created & optimized by me and right now one color is the only available but I will add more different variant of colors on my next post. I hope you will appreciate the little hard work I put into on making this compatible & possible on blogger. Something Unique? is the safe & secured thing below the widget that added a little bit more advanced look. We have two ways of installing this First, adding it on your sidebar Second, adding it below your every post. I made two options since I thought maybe some of you wanted this below your every post. So, lets get started & add this widget in your site.

LIVE DEMO

ADDING THE SUBSCRIPTION WIDGET ON THE SIDEBAR

Blogger dashboard
Layout
Add a gadget
Choose HTML/JAVASCRIPT
And add this subscription code

/*THE YELLOW BULB EMAIL SUBSCRIPTION START*/
<style type='text/css'>
.tybform
{
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgE57tjq0vP3OCZRzuxPoFwSJ9ybMp1CjT8UZone_rzX82pVrRUNiyeZ_Wah544Jc2BhUVwWQ0c9GAhYkHXoa6KoEkBcgoJCTgB_6_UDNlRdQnnQhwWOWkOnpPYdR7SFz6ghLjJaeIvV6I/s1600/inputform.png) no-repeat;
width: 200px;
height: 30px;
margin: 130px 10px 0px 50px;
padding: 0px 0px 0px 10px;
font-size: 14px;
font-weight: bolder;
text-shadow:2px 2px 6px #999999;
border: 0;
}
.tybsubmit
{
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMkf1MHnxPKiQLZipILVN6ZKDcjcXFHTVugtVhKVSFuuXq_g0KB3gqWKO0I9I3M-oBVcNgrsJeh0yrKw_2JkAWXfgbSgG4VU1BxxSYhf2ANjmv9gQ0swQoyuouK_rTN7mXBbRpWLbM2kM/s1600/subscription+form+submit.png)no-repeat;
width: 107px;
height: 44px;
border: 0;
float: right;
margin: 20px 40px 0px 0px;
cursor: pointer;
}
#emailsubs
{
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhs6ADJOt6nf0fLueHMEzzmIZ7MUvB9nlvULNY8DnjJ0EtWHVI9QWrL01Ma2NAPD_Hv2RWLBAog7KcFR17Gm5gAyrN1PRycBwrH27gf1qj4pQYkjHYKrDeidozbHEj7wgYdqSTwzUyu5RE/s1600/subscription+form.png)no-repeat;
width: 320px;
height: 273px;
}
</style>
<div id='emailsubs'>
<form action='http://feedburner.google.com/fb/a/mailverify' class='feedburner' method='post' onsubmit='window.open('http://feedburner.google.com/fb/a/mailverify?uri=TheYellowBulb', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true' style='margin: 0pt;' target='popupwindow'>
<input name='uri' type='hidden' value='TheYellowBulb'/>
<input name='loc' type='hidden' value='en_US'/>
<input class='tybform' 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 alt='' class='tybsubmit' title='' type='submit' value=''/>
</form></div>
/*THE YELLOW BULB EMAIL SUBSCRIPTION END*/

ADDING THE E-MAIL SUBSCRIPTION BELOW YOUR EVERY POST

Blogger dashboard
Template
Edit HTML
Proceed
Click “Expand Widget Template”
Press CTRL+F for search shortcut
And Locate this piece of a code

]]></b:skin>

And exactly above/before that add our subscription style

/*THE YELLOW BULB EMAIL SUBSCRIPTION START*/
.tybform
{
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgE57tjq0vP3OCZRzuxPoFwSJ9ybMp1CjT8UZone_rzX82pVrRUNiyeZ_Wah544Jc2BhUVwWQ0c9GAhYkHXoa6KoEkBcgoJCTgB_6_UDNlRdQnnQhwWOWkOnpPYdR7SFz6ghLjJaeIvV6I/s1600/inputform.png) no-repeat;
width: 200px;
height: 30px;
margin: 130px 10px 0px 50px;
padding: 0px 0px 0px 10px;
font-size: 14px;
font-weight: bolder;
text-shadow:2px 2px 6px #999999;
border: 0;
}
.tybsubmit
{
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMkf1MHnxPKiQLZipILVN6ZKDcjcXFHTVugtVhKVSFuuXq_g0KB3gqWKO0I9I3M-oBVcNgrsJeh0yrKw_2JkAWXfgbSgG4VU1BxxSYhf2ANjmv9gQ0swQoyuouK_rTN7mXBbRpWLbM2kM/s1600/subscription+form+submit.png)no-repeat;
width: 107px;
height: 44px;
border: 0;
float: right;
margin: 20px 40px 0px 0px;
cursor: pointer;
}
#emailsubs
{
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhs6ADJOt6nf0fLueHMEzzmIZ7MUvB9nlvULNY8DnjJ0EtWHVI9QWrL01Ma2NAPD_Hv2RWLBAog7KcFR17Gm5gAyrN1PRycBwrH27gf1qj4pQYkjHYKrDeidozbHEj7wgYdqSTwzUyu5RE/s1600/subscription+form.png)no-repeat;
width: 320px;
height: 273px;
}
/*THE YELLOW BULB EMAIL SUBSCRIPTION END*/

Next, Locate this code on your search box

<data:post.body/>

NOTE: IF YOU FOUND TWO OR THREE OCCURENCES OF THIS CODE, PLACE IT ON THE SECOND ONE

If you successfully located the code, add this below/after it.

<div id='emailsubs'>
<form action='http://feedburner.google.com/fb/a/mailverify' class='feedburner' method='post' onsubmit='window.open('http://feedburner.google.com/fb/a/mailverify?uri=TheYellowBulb', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true' style='margin: 0pt;' target='popupwindow'>
<input name='uri' type='hidden' value='TheYellowBulb'/>
<input name='loc' type='hidden' value='en_US'/>
<input class='tybform' 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 alt='' class='tybsubmit' title='' type='submit' value=''/>
</form></div>

CUSTOMIZING YOUR SUBSCRIPTION FORM

Don’t forget to replace the Bolded Blue RSS ID above to your own ID.

YOU CAN NOW SAVE YOUR TEMPLATE

I hope this works perfectly on your site too.

ARE YOU CONFUSED REGARDING THIS TUTORIAL?

If you have any difficulties implementing and/or following this tutorial, Feel free to keep in touch with me and ill try my best to work it out.

Simple and Neat Css3 Gradient Buttons For Your Website

noreply@blogger.com (Debbie Navarro PH) — Sun, 21 Oct 2012 10:25:00 +0000

CSS stands for (Cascading Style Sheet) is designed primarily to enable the separation of document content, including elements such as the layout, colors, and fonts. I'm saying "CSS3", because these make use of gradients, shadows, and rounded corners. This CSS3 buttons can be for blogger/blogspot or any type of website as long as you have an access to your Css Style Sheet. This can be a “Live Demo” “Preview” or even a “Download” button. A little bit info about this buttons - it has a pretty clean and neat style no other transition effect just Hover and Active. Square and curve borders and very easy to be installed. You can use the six different gradient (BLUE, DARK BLUE, GREEN, PURPLE, GREY, BLACK) colors whenever matches the need of the situation. As I’ve said this is just a simple and neat CSS3 buttons. Unfortunately, In older Browsers does not support these properties, the fallback is solid-color background, no shadows, and square corners. Not really a big deal. Alright, if you want this on your website – just keep reading.

INSTALLING CSS3 BUTTON STYLES ON YOUR BLOGGER TEMPLATE

Go to your blogger dashboard
Template
Edit HTML
Proceed
Click “Expand Widget Template”
Press CTRL+F for search shortcut
And locate this piece of code

]]></b:skin>

Alright, and just above/before that – insert this CSS styles

/*-----THE YELLOW BULB CSS3 BUTTONS START-----*/

.button {
width: 170px; /*TWEAK THIS TO ADJUST WIDTH*/
height: 28px; /*TWEAK THIS TO ADJUST HEIGHT*/
padding: 15px 15px;
color: #ffffff;
font-size: 17px;
font-weight: bold;
font-family: 'Lucida Grande', Helvetica, Arial, Sans-Serif;
text-decoration: none;
text-shadow:1px 0px 3px #000000;
text-align: center;
vertical-align: middle;}

.blue {
   border-top: 3px solid #96d1f8;
   background: #65a9d7;
   background: -webkit-gradient(linear, left top, left bottom, from(#0d3b59), to(#65a9d7));
   background: -webkit-linear-gradient(top, #0d3b59, #65a9d7);
   background: -moz-linear-gradient(top, #0d3b59, #65a9d7);
   background: -ms-linear-gradient(top, #0d3b59, #65a9d7);
   background: -o-linear-gradient(top, #0d3b59, #65a9d7);
   -webkit-border-radius: 9px;
   -moz-border-radius: 9px;
   border-radius: 9px;
-webkit-box-shadow:0px 9px 86px -14px rgba(51, 51, 51, 100);
-moz-box-shadow:0px 9px 86px -14px rgba(51, 51, 51, 100);
-o-box-shadow:0px 9px 86px -14px rgba(51, 51, 51, 100);
-ms-box-shadow:0px 9px 86px -14px rgba(51, 51, 51, 100);
box-shadow:0px 9px 86px -14px rgba(51, 51, 51, 100);
   color: #ffffff;
   }
.blue:hover {
   border-top-color: #14596e;
   background: #14596e;
   color: #ccc;
   }
.blue:active {
   border-top-color: #5290ba;
   background: #5290ba;
   }

.darkblue{
   border-top: 3px solid #dae3e8;
   background: #27597a;
   background: -webkit-gradient(linear, left top, left bottom, from(#0a1a30), to(#27597a));
   background: -webkit-linear-gradient(top, #0a1a30, #27597a);
   background: -moz-linear-gradient(top, #0a1a30, #27597a);
   background: -ms-linear-gradient(top, #0a1a30, #27597a);
   background: -o-linear-gradient(top, #0a1a30, #27597a);
   -webkit-border-radius: 9px;
   -moz-border-radius: 9px;
   border-radius: 9px;
   -webkit-box-shadow:0px 9px 86px -14px rgba(51, 51, 51, 100);
-moz-box-shadow:0px 9px 86px -14px rgba(51, 51, 51, 100);
-o-box-shadow:0px 9px 86px -14px rgba(51, 51, 51, 100);
-ms-box-shadow:0px 9px 86px -14px rgba(51, 51, 51, 100);
box-shadow:0px 9px 86px -14px rgba(51, 51, 51, 100);
   }
.darkblue:hover {
   border-top-color: #14323b;
   background: #14323b;
   color: #ccc;
   }
.darkblue:active {
   border-top-color: #728591;
   background: #728591;
   }

.green {
   border-top: 3px solid #ffffff;
   background: #386915;
   background: -webkit-gradient(linear, left top, left bottom, from(#0b4d15), to(#386915));
   background: -webkit-linear-gradient(top, #0b4d15, #386915);
   background: -moz-linear-gradient(top, #0b4d15, #386915);
   background: -ms-linear-gradient(top, #0b4d15, #386915);
   background: -o-linear-gradient(top, #0b4d15, #386915);
   -webkit-border-radius: 9px;
   -moz-border-radius: 9px;
   border-radius: 9px;
-webkit-box-shadow:0px 9px 86px -14px rgba(51, 51, 51, 100);
-moz-box-shadow:0px 9px 86px -14px rgba(51, 51, 51, 100);
-o-box-shadow:0px 9px 86px -14px rgba(51, 51, 51, 100);
-ms-box-shadow:0px 9px 86px -14px rgba(51, 51, 51, 100);
box-shadow:0px 9px 86px -14px rgba(51, 51, 51, 100);
   }
.green:hover {
   border-top-color: #bf9822;
   background: #bf9822;
   color: #000000;
   }
.green:active {
   border-top-color: #2a8c0a;
   background: #2a8c0a;
   }

.purple {
   border-top: 3px solid #757575;
   background: #eb26c7;
   background: -webkit-gradient(linear, left top, left bottom, from(#a020c4), to(#eb26c7));
   background: -webkit-linear-gradient(top, #a020c4, #eb26c7);
   background: -moz-linear-gradient(top, #a020c4, #eb26c7);
   background: -ms-linear-gradient(top, #a020c4, #eb26c7);
   background: -o-linear-gradient(top, #a020c4, #eb26c7);
   -webkit-border-radius: 9px;
   -moz-border-radius: 9px;
   border-radius: 9px;
-webkit-box-shadow:0px 9px 86px -14px rgba(51, 51, 51, 100);
-moz-box-shadow:0px 9px 86px -14px rgba(51, 51, 51, 100);
-o-box-shadow:0px 9px 86px -14px rgba(51, 51, 51, 100);
-ms-box-shadow:0px 9px 86px -14px rgba(51, 51, 51, 100);
box-shadow:0px 9px 86px -14px rgba(51, 51, 51, 100);
   }
.purple:hover {
   border-top-color: #380b45;
   background: #380b45;
   color: #000000;
   }
.purple:active {
   border-top-color: #726778;
   background: #726778;
   }

.grey{
   border-top: 3px solid #757575;
   background: #e3d7e1;
   background: -webkit-gradient(linear, left top, left bottom, from(#736c75), to(#e3d7e1));
   background: -webkit-linear-gradient(top, #736c75, #e3d7e1);
   background: -moz-linear-gradient(top, #736c75, #e3d7e1);
   background: -ms-linear-gradient(top, #736c75, #e3d7e1);
   background: -o-linear-gradient(top, #736c75, #e3d7e1);
   -webkit-border-radius: 9px;
   -moz-border-radius: 9px;
   border-radius: 9px;
-webkit-box-shadow:0px 9px 86px -14px rgba(51, 51, 51, 100);
-moz-box-shadow:0px 9px 86px -14px rgba(51, 51, 51, 100);
-o-box-shadow:0px 9px 86px -14px rgba(51, 51, 51, 100);
-ms-box-shadow:0px 9px 86px -14px rgba(51, 51, 51, 100);
box-shadow:0px 9px 86px -14px rgba(51, 51, 51, 100);
   }
.grey:hover {
   border-top-color: #3d3d3d;
   background: #3d3d3d;
   color: #ffffff;
   }
.grey:active {
   border-top-color: #000000;
   background: #000000;
   }

.black {
   border-top: 3px solid #757575;
   background: #4f4b4e;
   background: -webkit-gradient(linear, left top, left bottom, from(#141414), to(#4f4b4e));
   background: -webkit-linear-gradient(top, #141414, #4f4b4e);
   background: -moz-linear-gradient(top, #141414, #4f4b4e);
   background: -ms-linear-gradient(top, #141414, #4f4b4e);
   background: -o-linear-gradient(top, #141414, #4f4b4e);
   -webkit-border-radius: 9px;
   -moz-border-radius: 9px;
   border-radius: 9px;
   -webkit-box-shadow:0px 9px 86px -14px rgba(51, 51, 51, 100);
-moz-box-shadow:0px 9px 86px -14px rgba(51, 51, 51, 100);
-o-box-shadow:0px 9px 86px -14px rgba(51, 51, 51, 100);
-ms-box-shadow:0px 9px 86px -14px rgba(51, 51, 51, 100);
box-shadow:0px 9px 86px -14px rgba(51, 51, 51, 100);
   }
.black:hover {
   border-top-color: #545254;
   background: #545254;
   color: #000000;
   }
.black:active {
   border-top-color: #ababab;
   background: #ababab;
   }

/*-----THE YELLOW BULB CSS3 BUTTONS END-----*/

<div class="button green">GREEN</div>

<div class="button purple">PURPLE</div>

<div class="button black">BLACK</div>

Save your template.

ADDING THE BUTTONS ON YOUR BLOG POST

Create a new post
Click HTML tab
and insert your desired CSS3 button code, for ex:

<div class=’button green’>YOUR TEXT GOES HERE</div>

CUSTOMIZING YOUR CSS3 BUTTONS

Change the default width and height of your choice
Change the font size 17px if needed
Replace color: ffffff to change text color

Tips For Blogger Conditional Tags

noreply@blogger.com (Debbie Navarro PH) — Mon, 08 Oct 2012 14:58:00 +0000

I discovered this great website “TECH HACKS” that teach how this “Blogger Conditional Tags” can be easily used by young webmaster and blogger enthusiast. This will allow you to have a full control to your widgets and directly to your template. Lets read What Amritpal Singh explained about conditional tags .

“Conditional tags allow you to specify parts of your template to appear only under certain conditions. It is very similar to conditional tags in any other language. This includes tags such as if, if else. These conditional statements could be used on widgets, or actual html codes you may want to display on certain pages. If Else type conditional programing in blogger can be done by using <b:if cond=' '>...</b:if> tag. In this post we have examples of the use of conditional tags on html or widgets.” Alright, lets see how this conditional tags works and how to used them the right way. Just keep Reading….

Home Page Only

To display a text message only on homepage

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<p> This text will be displayed only on home page</p>
</b:if>

And to display it everywhere except homepage

<b:if cond='data:blog.url != data:blog.homepageUrl'>
<p>This text will be displayed everywhere except on home page</p>
</b:if>

If you want to display a widget only on home page, you will use the conditional code as highlighted on the following code for a blogger html/Javascript widget

<b:widget id='HTML1' locked='false' title='Testing Widget' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>

<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
</b:if>
<b:include name='quickedit'/>
</b:includable>
</b:widget>

Archive Page Only

To display html code only on archive page

<b:if cond='data:blog.pageType == "archive"'>
<p>Text for Archive pages only</p>
</b:if>

To display html code everywhere except archive page

<b:if cond='data:blog.pageType != "archive"'>
<p>Text for everywhere except Archive pages</p>
</b:if>

Item / Post Page Only

To display html code only on item page

<b:if cond='data:blog.pageType == "item"'>
<p>Text for post pages only</p>
</b:if>

To display html code everywhere except item page

<b:if cond='data:blog.pageType != "item"'>
<p>Text for everywhere except item pages</p>
</b:if>

Static Page Only

To display html code only on static pages

<b:if cond='data:blog.pageType == "static_page"'>
<p>Text for static pages only</p>
</b:if>

To display html code everywhere except static page

<b:if cond='data:blog.pageType != "static_page"'>
<p>Text for everywhere except static pages</p>
</b:if>

Specific URL Only

To display only on specific URL

<b:if cond='data:blog.url != "http://www.tech-hacks.com/2011/06/all-about-blogger-conditional-tags.html"'>
<p>Text will display on above URL only</p>
</b:if>

Certain Labels Only

To display content on certain labels only

<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.name == "Testing Category"'>
Text will be displayed only on Posts which have label Testing Category.
</b:if>
</b:loop>

NOTE: You will need to be inside Blog Posts loop in order to use Certain Labels Only code

ARE YOU CONFUSED REGARDING THIS TUTORIAL?

If you have any difficulties implementing and/or following this tutorial, Feel free to keep in touch with me and ill try my best to work it out.

Customize Your Blogger Mouse Cursor

noreply@blogger.com (Debbie Navarro PH) — Tue, 02 Oct 2012 07:19:00 +0000

We all wanted to customize every single detail in our website. From the Color, Background, Fonts, Alignment and so on. Blogger or Blogspot has unlimited potential when it comes to customization. That is why some of you also wanted to add a little twist on your mouse cursor. So here it is, I’m sharing you a very easy way to customize your Blogger Mouse Cursor. Just carefully follow instructions below and I’m sure you will love the outcome.This idea is originally from All Blog Tools and its Author & Founder Max.

INSTALLATION OF YOUR MOUSE CURSOR

Go to your Dashboard
Click Template
Edit HTML
Proceed
Click Expand Widget Template
Press (CTRL+F) for a search shortcut
And find this code

]]></b:skin>

And exactly ABOVE/BEFORE it, Add this code

body, a, a:hover {cursor: url(Cursor-Url), progress;}

CUSTOMIZING YOUR MOUSE CURSOR

Replace the CURSOR URL with your own.

WEBSITE WITH FREE MOUSE CURSOR

YOU CAN NOW SAVE YOUR TEMPLATE

And see it working perfectly on your blog.

ARE YOU CONFUSED REGARDING THIS TUTORIAL?

If you have any difficulties implementing and/or following this tutorial, Feel free to keep in touch with me and ill try my best to work it out.

Secure Your Website And Blog Against Malware Trojan And Hackers

noreply@blogger.com (Debbie Navarro PH) — Sun, 30 Sep 2012 15:58:00 +0000

Being infected by a suspicious script's, Trojan or any kind disgusting web virus out there is really a pain in the neck. Knowing that your hard work and business is being jeopardized. Simply put, this malware – or malicious code — can destroy your data and affect your computer’s performance by either slowing it down or causing it to crash once or continually. Website malware contracted from unsafe sites can even enable spammers to send email through user accounts, which can lead to disastrous consequences to a business and its reputation.

Preventing this to happen make sure to take note this important facts:

Checking- carefully check the Iframes and Javascripts that you are installing on your template, Don’t just COPY & PASTE.
Beware- Don’t browse on untrusted websites.
URL Checking- Make a background check on the website that is your source of code.You can use Norton Safe Web,My Wot.
Security Tool- Check your website if it is infected by a malicious or Trojan virus, you can use this free Security Web Check tool that I’m using: Un Mask Parasite.
Be Up to date- Always delete old scripts that are no longer being used.
Update Password- Change your main website password once in a month, make a combination of letters ,numbers, uppercase, symbols, that can be hard for hackers to crack. ( ex: M12y_t657_s is harder to crack than Johnny123).
Security Plugins -such as firewalls and malware scanners can prevent an intrusion. Intuit Inc. recommends several security plugins for WordPress websites, including Bulletproof Security, Secure WordPress and Login Lock-down.- ehow.com
Use Webmaster Tool- Create your Google Webmaster Tool account for your website and there you can detect if your website has been affected by a malware or Trojan.
Diagnostic Test- You can do this for free using Google’s safe browsing tool. Just type http://www.google.com/safebrowsing/diagnostic?site= into your web browser’s address bar and include your website URL after the equal sign (for example, if you want to check the site www.google.com, you would type in http://www.google.com/safebrowsing/diagnostic?site=www.google.com).
Check your Website Source- By typing your website and then Click CTRL+U. You can see then if there is some suspicious sort of codes inserted on your website .(ex: ones named after prescription drugs or other “spammy” words) are also a good indicator that you’ve been hacked.

How to determine if your website has been hacked?

Your Visitors -Obviously, You’ve been told that your website has been infected by Trojan or hacked.
URL Redirect - your visitors been redirected to other “spammy” website. you can use this tool to check your website for hidden links: hidden link detection tool.
Sudden Website Slow Load -Your website loads significantly slower than usual.
Warning Messages - You’ve been seeing a warning messages If your website has been hacked to spread malware, this can trigger warning messages from search engines, web browsers, and anti-virus software when you try to access the site.
Changes to your website - Some hackers will change or delete parts of your website just because they can (plus it earns them cool points with their hacker buddies). It’s kind of like virtual graffiti. If you find changes to your site that you didn’t make (like unfamiliar content, rearranged layout, or missing sections), you may have been hacked.- blog.brainhost.com

I Hope that this little information that I gathered will be useful for you and to your website security. Always take a precaution to avoid major problems to your beloved website.

How To Add “Share The Knowledge” Bookmark V3 To Blogger

noreply@blogger.com (Debbie Navarro PH) — Thu, 27 Sep 2012 23:19:00 +0000

This “Share The Knowledge v3” widget is from Blogger Tricks and Tools one of the popular blogs around. Alright, this social bookmarks have 88 sharing options to choose from. Facebook, Twitter, Stumble Upon, Digg, Technorati, Reddit, via email, Google, Linkedin and more… This is the massive social buttons that put into one. The width default is 700px and can always be adjustable. Perhaps, you will love the hover effect of “Expanding”. Also, the installation of this is just a matter of COPY & PASTE, so don’t worry you wont get stuck on any sort of coding. Just carefully follow this instructions below.

LIVE DEMO “BELOW EVERY POST”

INSTALLING THE SHARE THE KNOWLEDGE BOOKMARK ON BLOGGER

Go to your Blogger Dashboard
Click Template
Edit HTML
Proceed
Click “Expand Widget Templates”
Press (CTRL+f ) Shortcut for search 7.
Locate this piece of a code

</head>

Add this code BEFORE/ABOVE closing </head>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js' type='text/javascript'/> <script type='text/javascript'> jQuery(document).ready(function() { jQuery('.sexy-bookmarks a.external').attr("target", "_blank"); var sexyBaseHeight = jQuery('.sexy-bookmarks').height(); var sexyFullHeight = jQuery('.sexy-bookmarks ul.socials').height(); if (sexyFullHeight > sexyBaseHeight) { jQuery('.sexy-bookmarks-expand').hover( function() { jQuery(this).animate({ height: sexyFullHeight + 15 + 'px' }, { duration: 800, queue: false }); }, function() { jQuery(this).animate({ height: sexyBaseHeight + 'px' }, { duration: 800, queue: false }); }); } if (jQuery('.sexy-bookmarks-center')) { var sexyFullWidth = jQuery('.sexy-bookmarks').width(); var sexyBookmarkWidth = jQuery('.sexy-bookmarks:first ul.socials li').width(); var sexyBookmarkCount = jQuery('.sexy-bookmarks:first ul.socials li').length; var numPerRow = Math.floor(sexyFullWidth / sexyBookmarkWidth); var sexyRowWidth = Math.min(numPerRow, sexyBookmarkCount) * sexyBookmarkWidth; var sexyLeftMargin = (sexyFullWidth - sexyRowWidth) / 2; jQuery('.sexy-bookmarks-center').css('margin-left', sexyLeftMargin + 'px'); } }); </script></span> <style type='text/css'>

/*********************************** How To Add Social Sexy Bookmarks v3 to Blogger By Bloggertricksandtoolz Url:http://www.bloggertricksandtoolz.com/ ************************************/ #post-width-w2b { position: relative; float: left; min-height: 95px; margin-bottom: 10px; background-color:transparent !important; } div.sexy-bookmarks{margin:20px 0 0 10px; border: 0; outline: none; clear:both !important} div.sexy-bookmarks-expand{height:32px; overflow:hidden;} div.sexy-bookmarks-bg-sexy{ padding:28px 0 0 10px !important; background:transparent url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVZIKTWX8GO9-DrFxahCQmbWRBGbzPP3BY_fIlhf_HKqgYGFRrOR3vTHSgDK3zy49IeGywVWaf3QthBE-JXHAaLJd8Fo8uYW0o7-u_0IecbaOXqYlU0IHydUnig2vkdc_BfCy_cPGvo0A/') no-repeat !important } div.sexy-bookmarks ul.socials{ width:100% !important; margin:0 !important; padding:0 !important; float:left !important; background:transparent none !important; border:0 none !important; outline:0 none !important } div.sexy-bookmarks ul.socials li{ background-image:url('http://bloggertrickandtoolz.googlecode.com/files/bloggertricksandtoolz.com-shr-sprite.png') !important; background-repeat:no-repeat !important; display:inline !important; float:left !important; list-style-type:none !important; padding:0 !important; height:29px !important; width:60px !important; cursor:pointer !important; margin:3px 0 0 !important; background-color:transparent !important; border:0 none !important; outline:0 none !important; clear:none !important } div.sexy-bookmarks ul.socials li:before, div.sexy-bookmarks ul.socials li:after, div.sexy-bookmarks ul.socials li a:before, div.sexy-bookmarks ul.socials li a:after{content:none !important} div.sexy-bookmarks ul.socials a,div.sexy-bookmarks ul.socials a:hover{ display:block !important; width:60px !important; height:29px !important; text-indent:-9999px !important; background-color:transparent !important; text-decoration:none !important; border:0 none !important; margin:0 !important; padding:0 !important } div.sexy-bookmarks ul.socials a:hover,div.sexy-bookmarks ul.socials li:hover{ background-color:transparent !important; border:0 none !important; outline:0 none !important } li.sexy-newsvine{background-position:left bottom !important} li.sexy-newsvine:hover{background-position:left top !important} li.sexy-linkedin{background-position:-70px bottom !important} li.sexy-linkedin:hover{background-position:-70px top !important} li.sexy-googlebookmarks{background-position:-140px bottom !important} li.sexy-googlebookmarks:hover{background-position:-140px top !important} li.sexy-googlereader{background-position:-210px bottom !important} li.sexy-googlereader:hover{background-position:-210px top !important} li.sexy-scriptstyle{background-position:-280px bottom !important} li.sexy-scriptstyle:hover{background-position:-280px top !important} li.sexy-mail{background-position:-350px bottom !important} li.sexy-mail:hover{background-position:-350px top !important} li.sexy-comfeed{background-position:-420px bottom !important} li.sexy-comfeed:hover{background-position:-420px top !important} li.sexy-twitter{background-position:-490px bottom !important} li.sexy-twitter:hover{background-position:-490px top !important} li.sexy-technorati{background-position:-560px bottom !important} li.sexy-technorati:hover{background-position:-560px top !important} li.sexy-stumbleupon{background-position:-630px bottom !important} li.sexy-stumbleupon:hover{background-position:-630px top !important} li.sexy-reddit{background-position:-700px bottom !important} li.sexy-reddit:hover{background-position:-700px top !important} li.sexy-myspace{background-position:-770px bottom !important} li.sexy-myspace:hover{background-position:-770px top !important} li.sexy-mixx{background-position:-840px bottom !important} li.sexy-mixx:hover{background-position:-840px top !important} li.sexy-diigo{background-position:-910px bottom !important} li.sexy-diigo:hover{background-position:-910px top !important} li.sexy-digg{background-position:-980px bottom !important} li.sexy-digg:hover{background-position:-980px top !important} li.sexy-designfloat{background-position:-1050px bottom !important} li.sexy-designfloat:hover{background-position:-1050px top !important} li.sexy-yahoobuzz{background-position:-1120px bottom !important} li.sexy-yahoobuzz:hover{background-position:-1120px top !important} li.sexy-delicious{background-position:-1190px bottom !important} li.sexy-delicious:hover{background-position:-1190px top !important} li.sexy-blinklist{background-position:-1260px bottom !important} li.sexy-blinklist:hover{background-position:-1260px top !important} li.sexy-facebook{background-position:-1330px bottom !important} li.sexy-facebook:hover{background-position:-1330px top !important} li.sexy-misterwong{background-position:-1400px bottom !important} li.sexy-misterwong:hover{background-position:-1400px top !important} li.sexy-izeby{background-position:-1470px bottom !important} li.sexy-izeby:hover{background-position:-1470px top !important} li.sexy-twittley{background-position:-1540px bottom !important} li.sexy-twittley:hover{background-position:-1540px top !important} li.sexy-tipd{background-position:-1610px bottom !important} li.sexy-tipd:hover{background-position:-1610px top !important} li.sexy-pfbuzz{background-position:-1680px bottom !important} li.sexy-pfbuzz:hover{background-position:-1680px top !important} li.sexy-friendfeed{background-position:-1750px bottom !important} li.sexy-friendfeed:hover{background-position:-1750px top !important} li.sexy-blogmarks{background-position:-1820px bottom !important} li.sexy-blogmarks:hover{background-position:-1820px top !important} li.sexy-fwisp{background-position:-1890px bottom !important} li.sexy-fwisp:hover{background-position:-1890px top !important} li.sexy-yahoomail{background-position:-1960px bottom !important} li.sexy-yahoomail:hover{background-position:-1960px top !important} li.sexy-bobrdobr{background-position:-2030px bottom !important} li.sexy-bobrdobr:hover{background-position:-2030px top !important} li.sexy-memoryru{background-position:-2100px bottom !important} li.sexy-memoryru:hover{background-position:-2100px top !important} li.sexy-100zakladok{background-position:-2170px bottom !important} li.sexy-100zakladok:hover{background-position:-2170px top !important} li.sexy-yandex{background-position:-2240px bottom !important} li.sexy-yandex:hover{background-position:-2240px top !important} li.sexy-moemesto{background-position:-2310px bottom !important} li.sexy-moemesto:hover{background-position:-2310px top !important} li.sexy-marrows{background-position:-2380px bottom !important} li.sexy-marrows:hover{background-position:-2380px top !important} li.sexy-identica{background-position:-2450px bottom !important} li.sexy-identica:hover{background-position:-2450px top !important} li.sexy-hackernews{background-position:-2520px bottom !important} li.sexy-hackernews:hover{background-position:-2520px top !important} li.sexy-ning{background-position:-2590px bottom !important} li.sexy-ning:hover{background-position:-2590px top !important} li.sexy-designbump{background-position:-2660px bottom !important} li.sexy-designbump:hover{background-position:-2660px top !important} li.sexy-printfriendly{background-position:-2730px bottom !important} li.sexy-printfriendly:hover{background-position:-2730px top !important} li.sexy-fleck{background-position:-2800px bottom !important} li.sexy-fleck:hover{background-position:-2800px top !important} li.sexy-netvibes{background-position:-2870px bottom !important} li.sexy-netvibes:hover{background-position:-2870px top !important} li.sexy-netvouz{background-position:-2940px bottom !important} li.sexy-netvouz:hover{background-position:-2940px top !important} li.sexy-nujij{background-position:-3010px bottom !important} li.sexy-nujij:hover{background-position:-3010px top !important} li.sexy-globalgrind{background-position:-3080px bottom !important} li.sexy-globalgrind:hover{background-position:-3080px top !important} li.sexy-wikio{background-position:-3150px bottom !important} li.sexy-wikio:hover{background-position:-3150px top !important} li.sexy-xerpi{background-position:-3220px bottom !important} li.sexy-xerpi:hover{background-position:-3220px top !important} li.sexy-sphinn{background-position:-3290px bottom !important} li.sexy-sphinn:hover{background-position:-3290px top !important} li.sexy-hotmail{background-position:-3360px bottom !important} li.sexy-hotmail:hover{background-position:-3360px top !important} li.sexy-posterous{background-position:-3430px bottom !important} li.sexy-posterous:hover{background-position:-3430px top !important} li.sexy-techmeme{background-position:-3500px bottom !important} li.sexy-techmeme:hover{background-position:-3500px top !important} li.sexy-ekudos{background-position:-3570px bottom !important} li.sexy-ekudos:hover{background-position:-3570px top !important} li.sexy-pingfm{background-position:-3640px bottom !important} li.sexy-pingfm:hover{background-position:-3640px top !important} li.sexy-tomuse{background-position:-3710px bottom !important} li.sexy-tomuse:hover{background-position:-3710px top !important} li.sexy-webblend{background-position:-3780px bottom !important} li.sexy-webblend:hover{background-position:-3780px top !important} li.sexy-wykop{background-position:-3850px bottom !important} li.sexy-wykop:hover{background-position:-3850px top !important} li.sexy-blogengage{background-position:-3920px bottom !important} li.sexy-blogengage:hover{background-position:-3920px top !important} li.sexy-hyves{background-position:-3990px bottom !important} li.sexy-hyves:hover{background-position:-3990px top !important} li.sexy-pusha{background-position:-4060px bottom !important} li.sexy-pusha:hover{background-position:-4060px top !important} li.sexy-hatena{background-position:-4130px bottom !important} li.sexy-hatena:hover{background-position:-4130px top !important} li.sexy-mylinkvault{background-position:-4200px bottom !important} li.sexy-mylinkvault:hover{background-position:-4200px top !important} li.sexy-slashdot{background-position:-4270px bottom !important} li.sexy-slashdot:hover{background-position:-4270px top !important} li.sexy-squidoo{background-position:-4340px bottom !important} li.sexy-squidoo:hover{background-position:-4340px top !important} li.sexy-propeller{background-position:-4410px bottom !important} li.sexy-propeller:hover{background-position:-4410px top !important} li.sexy-faqpal{background-position:-4480px bottom !important} li.sexy-faqpal:hover{background-position:-4480px top !important} li.sexy-evernote{background-position:-4550px bottom !important} li.sexy-evernote:hover{background-position:-4550px top !important} li.sexy-meneame{background-position:-4620px bottom !important} li.sexy-meneame:hover{background-position:-4620px top !important} li.sexy-bitacoras{background-position:-4690px bottom !important} li.sexy-bitacoras:hover{background-position:-4690px top !important} li.sexy-jumptags{background-position:-4760px bottom !important} li.sexy-jumptags:hover{background-position:-4760px top !important} li.sexy-bebo{background-position:-4830px bottom !important} li.sexy-bebo:hover{background-position:-4830px top !important} li.sexy-n4g{background-position:-4900px bottom !important} li.sexy-n4g:hover{background-position:-4900px top !important} li.sexy-strands{background-position:-4970px bottom !important} li.sexy-strands:hover{background-position:-4970px top !important} li.sexy-orkut{background-position:-5040px bottom !important} li.sexy-orkut:hover{background-position:-5040px top !important} li.sexy-tumblr{background-position:-5110px bottom !important} li.sexy-tumblr:hover{background-position:-5110px top !important} li.sexy-stumpedia{background-position:-5180px bottom !important} li.sexy-stumpedia:hover{background-position:-5180px top !important} li.sexy-current{background-position:-5250px bottom !important} li.sexy-current:hover{background-position:-5250px top !important} li.sexy-blogger{background-position:-5320px bottom !important} li.sexy-blogger:hover{background-position:-5320px top !important} li.sexy-plurk{background-position:-5390px bottom !important} li.sexy-plurk:hover{background-position:-5390px top !important} li.sexy-virb{background-position:-5460px bottom !important} li.sexy-virb:hover{background-position:-5460px top !important} li.sexy-dzone{background-position:-5530px bottom !important} li.sexy-dzone:hover{background-position:-5530px top !important} li.sexy-kaevur{background-position:-5600px bottom !important} li.sexy-kaevur:hover{background-position:-5600px top !important} li.sexy-boxnet{background-position:-5670px bottom !important} li.sexy-boxnet:hover{background-position:-5670px top !important} li.sexy-oknotizie{background-position:-5740px bottom !important} li.sexy-oknotizie:hover{background-position:-5740px top !important} li.sexy-bonzobox{background-position:-5810px bottom !important} li.sexy-bonzobox:hover{background-position:-5810px top !important} li.sexy-plaxo{background-position:-5880px bottom !important} li.sexy-plaxo:hover{background-position:-5880px top !important} li.sexy-springpad{background-position:-5950px bottom !important} li.sexy-springpad:hover{background-position:-5950px top !important} li.sexy-zabox{background-position:-6020px bottom !important} li.sexy-zabox:hover{background-position:-6020px top !important} li.sexy-viadeo{background-position:-6090px bottom !important} li.sexy-viadeo:hover{background-position:-6090px top !important} li.sexy-googlebuzz{background-position:-6160px bottom !important} li.sexy-googlebuzz:hover{background-position:-6160px top !important} li.sexy-gmail{background-position:-6230px bottom !important} li.sexy-gmail:hover{background-position:-6230px top !important} li.sexy-buzzster{background-position:-6300px bottom !important} li.sexy-buzzster:hover{background-position:-6300px top !important} li.sexy-way2blogging{background-position:0px -80px !important} .sexy-link{margin: 3px 0 0 20px; font-size: 9px; float:left; color: #555; text-decoration: none;} .sexy-link a{padding:10px 0; width:100%; color: #333; text-decoration: none; border:0; outline:none} </style>

NOTE: MAKE SURE TO COPY ALL PARTS OF THE CODE

Again locate this code <data:post.body/> (If you see this code twice, paste it to the second one)
And add this code AFTER/BELOW of it

<b:if cond='data:blog.pageType == "item"'>
<div id='post-width-w2b' style='width:700px;'>
<div class='sexy-bookmarks-bg-sexy sexy-bookmarks sexy-bookmarks-expand sexy-bookmarks-center '>
<ul class='socials'>
   <li class='sexy-yahoomail'>
   <a class='external' expr:href='"http://compose.mail.yahoo.com/?Subject= " + data:post.title + "&body=Link:"+ data:post.url' rel='nofollow' title='Email this via Yahoo! Mail'/>
   </li>
   <li class='sexy-gmail'>
   <a class='external' expr:href='"https://mail.google.com/mail/?ui=2&view=cm&fs=1&tf=1&su=" + data:post.title + "&body=Link:" + data:post.url' rel='nofollow' title='Email this via Gmail'/>
   </li>
   <li class='sexy-twitter'>
   <a class='external' expr:href='"http://twitter.com/home?status=" + data:post.title + " -- " + data:post.url ' rel='nofollow' title='Tweet This!'/>
   </li>
   <li class='sexy-facebook'>
   <a class='external' expr:href='"http://www.facebook.com/share.php?v=4&src=bm&u=" + data:post.url + "&t=" + data:post.title ' onclick='window.open(this.href,'sharer','toolbar=0,status=0,width=626,height=436'); return false;' rel='nofollow' title='Share this on Facebook'/>
   </li>
   <li class='sexy-linkedin'>
   <a class='external' expr:href='"http://www.linkedin.com/shareArticle?mini=true&url=" + data:post.url + "&title=" + data:post.title + "&summary=&source="' rel='nofollow' title='Share this on LinkedIn'/>
   </li>
   <li class='sexy-googlebuzz'>
   <a class='external' expr:href='"http://www.google.com/buzz/post?url=" + data:post.url + "&imageurl="' rel='nofollow' title='Post on Google Buzz'/>
   </li>
   <li class='sexy-yahoobuzz'>
   <a class='external' expr:href='"http://buzz.yahoo.com/submit/?submitUrl=" + data:post.url + "&submitHeadline=" + data:post.title + "&submitSummary=&submitCategory=science&submitAssetType=text"' rel='nofollow' title='Buzz up!'/>
   </li>
   <li class='sexy-blogger'>
   <a class='external' expr:href='"http://www.blogger.com/blog_this.pyra?t&u=" + data:post.url + "&n=" + data:post.title + "&pli=1"' rel='nofollow' title='Blog this on Blogger'/>
   </li>
   <li class='sexy-googlebookmarks'>
   <a class='external' expr:href='"http://www.google.com/bookmarks/mark?op=add&bkmk=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' title='Add this to Google Bookmarks'/>
   </li>
   <li class='sexy-googlereader'>
   <a class='external' expr:href='"http://www.google.com/reader/link?url=" + data:post.url + "&title=" + data:post.title + "&srcUrl=" + data:post.url + "&srcTitle=" + data:post.title + "&snippet="' rel='nofollow' title='Add this to Google Reader'/>
   </li>
   <li class='sexy-stumbleupon'>
   <a class='external' expr:href='"http://www.stumbleupon.com/submit?url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' title='Stumble upon something good? Share it on StumbleUpon'/>
   </li>
   <li class='sexy-delicious'>
   <a class='external' expr:href='"http://delicious.com/post?url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' title='Share this on del.icio.us'/>
   </li>
   <li class='sexy-digg'>
   <a class='external' expr:href='"http://digg.com/submit?phase=2&url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' title='Digg this!'/>
   </li>
   <li class='sexy-comfeed'>
   <a class='external' expr:href='data:blog.homepageUrl + "feeds/" + data:post.id + "/comments/default?alt=rss"' rel='nofollow' title='Subscribe to the comments for this post?'/>
   </li>
   <li class='sexy-orkut'>
   <a class='external' expr:href='"http://promote.orkut.com/preview?nt=orkut.com&tt=" + data:post.title + "&du=" + data:post.url + "&cn="' rel='nofollow' title='Promote this on Orkut'/>
   </li>
   <li class='sexy-designbump'>
   <a class='external' expr:href='"http://designbump.com/submit?url=" + data:post.url + "&title=" + data:post.title + "&body="' rel='nofollow' title='Bump this on DesignBump'/>
   </li>
   <li class='sexy-reddit'>
   <a class='external' expr:href='"http://reddit.com/submit?url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' title='Share this on Reddit'/>
   </li>
   <li class='sexy-designfloat'>
   <a class='external' expr:href='"http://www.designfloat.com/submit.php?url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' title='Submit this to DesignFloat'/>
   </li>
   <li class='sexy-friendfeed'>
   <a class='external' expr:href='"http://www.friendfeed.com/share?title=" + data:post.title + "&link=" + data:post.url ' rel='nofollow' title='Share this on FriendFeed'/>
   </li>
   <li class='sexy-zabox'>
   <a class='external' expr:href='"http://www.zabox.net/submit.php?url=" + data:post.url ' rel='nofollow' title='Box this on Zabox'/>
   </li>
   <li class='sexy-dzone'>
   <a class='external' expr:href='"http://www.dzone.com/links/add.html?url=" + data:post.url + "&title=" + data:post.title + "&description="' rel='nofollow' title='Add this to DZone'/>
   </li>
   <li class='sexy-webblend'>
   <a class='external' expr:href='"http://thewebblend.com/submit?url=" + data:post.url + "&title=" + data:post.title + "&body="' rel='nofollow' title='Blend this!'/>
   </li>
   <li class='sexy-propeller'>
   <a class='external' expr:href='"http://www.propeller.com/submit/?url=" + data:post.url ' rel='nofollow' title='Submit this story to Propeller'/>
   </li>
   <li class='sexy-tumblr'>
   <a class='external' expr:href='"http://www.tumblr.com/share?v=3&u=" + data:post.url + "&t=" + data:post.title ' rel='nofollow' title='Share this on Tumblr'/>
   </li>
   <li class='sexy-squidoo'>
   <a class='external' expr:href='"http://www.squidoo.com/lensmaster/bookmark?" + data:post.url ' rel='nofollow' title='Add to a lense on Squidoo'/>
   </li>
   <li class='sexy-posterous'>
   <a class='external' expr:href='"http://posterous.com/share?linkto=" + data:post.url + "&title=" + data:post.title + "&selection="' rel='nofollow' title='Post this to Posterous'/>
   </li>
   <li class='sexy-technorati'>
   <a class='external' expr:href='"http://technorati.com/faves?add=" + data:post.url ' rel='nofollow' title='Share this on Technorati'/>
   </li>
   <li class='sexy-hotmail'>
   <a class='external' expr:href='"http://mail.live.com/?rru=compose?subject=" + data:post.title + "&body=Link: " + data:post.url ' rel='nofollow' title='Email this via Hotmail'/>
   </li>
   <li class='sexy-bebo'>
   <a class='external' expr:href='"http://www.bebo.com/c/share?Url=" + data:post.url + "&Title=" + data:post.title ' rel='nofollow' title='Share this on Bebo'/>
   </li>
   <li class='sexy-bitacoras'>
   <a class='external' expr:href='"http://bitacoras.com/anotaciones/" + data:post.url ' rel='nofollow' title='Submit this to Bitacoras'/>
   </li>
   <li class='sexy-blinklist'>
   <a class='external' expr:href='"http://www.blinklist.com/index.php?Action=Blink/addblink.php&Url=" + data:post.url + "&Title=" + data:post.title ' rel='nofollow' title='Share this on Blinklist'/>
   </li>
   <li class='sexy-100zakladok'>
   <a class='external' expr:href='"http://www.100zakladok.ru/save/?bmurl=" + data:post.url + "&bmtitle=" + data:post.title ' rel='nofollow' title='Add this to 100 bookmarks'/>
   </li>
   <li class='sexy-blogengage'>
   <a class='external' expr:href='"http://www.blogengage.com/submit.php?url=" + data:post.url ' rel='nofollow' title='Engage with this article!'/>
   </li>
   <li class='sexy-blogmarks'>
   <a class='external' expr:href='"http://blogmarks.net/my/new.php?mini=1&simple=1&url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' title='Mark this on BlogMarks'/>
   </li>
   <li class='sexy-bobrdobr'>
   <a class='external' expr:href='"http://bobrdobr.ru/addext.html?url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' title='Share this on BobrDobr'/>
   </li>
   <li class='sexy-bonzobox'>
   <a class='external' expr:href='"http://bonzobox.com/toolbar/add?pop=1&u=" + data:post.url + "&t=" + data:post.title + "&d="' rel='nofollow' title='Add this to BonzoBox'/>
   </li>
   <li class='sexy-boxnet'>
   <a class='external' expr:href='"https://www.box.net/api/1.0/import?url=" + data:post.url + "&name=" + data:post.title + "&description=&import_as=link"' rel='nofollow' title='Add this link to Box.net'/>
   </li>
   <li class='sexy-current'>
   <a class='external' expr:href='"http://current.com/clipper.htm?url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' title='Post this to Current'/>
   </li>
   <li class='sexy-diigo'>
   <a class='external' expr:href='"http://www.diigo.com/post?url=" + data:post.url + "&title=" + data:post.title + "&desc="' rel='nofollow' title='Post this on Diigo'/>
   </li>
   <li class='sexy-ekudos'>
   <a class='external' expr:href='"http://www.ekudos.nl/artikel/nieuw?url=" + data:post.url + "&title=" + data:post.title + "&desc="' rel='nofollow' title='Submit this to eKudos'/>
   </li>
   <li class='sexy-evernote'>
   <a class='external' expr:href='"http://www.evernote.com/clip.action?url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' title='Clip this to Evernote'/>
   </li>
   <li class='sexy-faqpal'>
   <a class='external' expr:href='"http://www.faqpal.com/submit?url=" + data:post.url ' rel='nofollow' title='Submit this to FAQpal'/>
   </li>
   <li class='sexy-fwisp'>
   <a class='external' expr:href='"http://fwisp.com/submit?url=" + data:post.url ' rel='nofollow' title='Share this on Fwisp'/>
   </li>
   <li class='sexy-globalgrind'>
   <a class='external' expr:href='"http://globalgrind.com/submission/submit.aspx?url=" + data:post.url + "&type=Article&title=" + data:post.title ' rel='nofollow' title='Grind this! on Global Grind'/>
   </li>
   <li class='sexy-hackernews'>
   <a class='external' expr:href='"http://news.ycombinator.com/submitlink?u=" + data:post.url + "&t=" + data:post.title ' rel='nofollow' title='Submit this to Hacker News'/>
   </li>
   <li class='sexy-hatena'>
   <a class='external' expr:href='"http://b.hatena.ne.jp/add?mode=confirm&url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' title='Bookmarks this on Hatena Bookmarks'/>
   </li>
   <li class='sexy-hyves'>
   <a class='external' expr:href='"http://www.hyves.nl/profilemanage/add/tips/?name=" + data:post.title + "&text=Text about this site+-+" + data:post.url + "&rating=5"' rel='nofollow' title='Share this on Hyves'/>
   </li>
   <li class='sexy-identica'>
   <a class='external' expr:href='"http://identi.ca//index.php?action=newnotice&status_textarea=Reading:" + data:post.title + "+-+from+" + data:post.url ' rel='nofollow' title='Post this to Identica'/>
   </li>
   <li class='sexy-izeby'>
   <a class='external' expr:href='"http://izeby.com/submit.php?url=" + data:post.url ' rel='nofollow' title='Add this to Izeby'/>
   </li>
   <li class='sexy-jumptags'>
   <a class='external' expr:href='"http://www.jumptags.com/add/?url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' title='Submit this link to JumpTags'/>
   </li>
   <li class='sexy-kaevur'>
   <a class='external' expr:href='"http://kaevur.com/submit.php?url=" + data:post.url ' rel='nofollow' title='Share this on Kaevur'/>
   </li>
   <li class='sexy-mail'>
   <a class='external' expr:href='"mailto:?subject=%22" + data:post.title + "%22&body=Link: " + data:post.url + " (sent via Way2blogging) "' rel='nofollow' title='Email this to a friend?'/>
   </li>
   <li class='sexy-memoryru'>
   <a class='external' expr:href='"http://memori.ru/link/?sm=1&u_data[url]=" + data:post.url + "&u_data[name]=" + data:post.title ' rel='nofollow' title='Add this to Memory.ru'/>
   </li>
   <li class='sexy-meneame'>
   <a class='external' expr:href='"http://meneame.net/submit.php?url=" + data:post.url ' rel='nofollow' title='Submit this to Meneame'/>
   </li>
   <li class='sexy-misterwong'>
   <a class='external' expr:href='"http://www.mister-wong.com/addurl/?bm_url=" + data:post.url + "&bm_description=" + data:post.title + "&plugin=sexybookmarks"' rel='nofollow' title='Add this to Mister Wong'/>
   </li>
   <li class='sexy-moemesto'>
   <a class='external' expr:href='"http://moemesto.ru/post.php?url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' title='Add this to MyPlace'/>
   </li>
   <li class='sexy-mylinkvault'>
   <a class='external' expr:href='"http://www.mylinkvault.com/link-page.php?u=" + data:post.url + "&n=" + data:post.title ' rel='nofollow' title='Store this link on MyLinkVault'/>
   </li>
   <li class='sexy-myspace'>
   <a class='external' expr:href='"http://www.myspace.com/Modules/PostTo/Pages/?u=" + data:post.url + "&t=" + data:post.title ' rel='nofollow' title='Post this to MySpace'/>
   </li>
   <li class='sexy-n4g'>
   <a class='external' expr:href='"http://www.n4g.com/tips.aspx?url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' title='Submit tip to N4G'/>
   </li>
   <li class='sexy-netvibes'>
   <a class='external' expr:href='"http://www.netvibes.com/share?title=" + data:post.title + "&url=" + data:post.url ' rel='nofollow' title='Submit this to Netvibes'/>
   </li>
   <li class='sexy-netvouz'>
   <a class='external' expr:href='"http://www.netvouz.com/action/submitBookmark?url=" + data:post.url + "&title=" + data:post.title + "&popup=no"' rel='nofollow' title='Submit this to Netvouz'/>
   </li>
   <li class='sexy-newsvine'>
   <a class='external' expr:href='"http://www.newsvine.com/_tools/seed&save?u=" + data:post.url + "&h=" + data:post.title ' rel='nofollow' title='Seed this on Newsvine'/>
   </li>
   <li class='sexy-ning'>
   <a class='external' expr:href='"http://bookmarks.ning.com/addItem.php?url=" + data:post.url + "&T=" + data:post.title ' rel='nofollow' title='Add this to Ning'/>
   </li>
   <li class='sexy-nujij'>
   <a class='external' expr:href='"http://nujij.nl/jij.lynkx?t=" + data:post.title + "&u=" + data:post.url + "&b="' rel='nofollow' title='Submit this to NUjij'/>
   </li>
   <li class='sexy-oknotizie'>
   <a class='external' expr:href='"http://oknotizie.virgilio.it/post?url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' title='Share this on OkNotizie'/>
   </li>
   <li class='sexy-pfbuzz'>
   <a class='external' expr:href='"http://pfbuzz.com/submit?url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' title='Share this on PFBuzz'/>
   </li>
   <li class='sexy-pingfm'>
   <a class='external' expr:href='"http://ping.fm/ref/?link=" + data:post.url + "&title=" + data:post.title + "&body="' rel='nofollow' title='Ping this on Ping.fm'/>
   </li>
   <li class='sexy-plaxo'>
   <a class='external' expr:href='"http://www.plaxo.com/?share_link=" + data:post.url ' rel='nofollow' title='Share this on Plaxo'/>
   </li>
   <li class='sexy-plurk'>
   <a class='external' expr:href='"http://www.plurk.com/m?content=9+beautiful+web+forms+for+free+download+-+" + data:post.url + "&qualifier=shares"' rel='nofollow' title='Share this on Plurk'/>
   </li>
   <li class='sexy-printfriendly'>
   <a class='external' expr:href='"http://www.printfriendly.com/print?url=" + data:post.url ' rel='nofollow' title='Send this page to Print Friendly'/>
   </li>
   <li class='sexy-pusha'>
   <a class='external' expr:href='"http://www.pusha.se/posta?url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' title='Push this on Pusha'/>
   </li>
   <li class='sexy-scriptstyle'>
   <a class='external' expr:href='"http://scriptandstyle.com/submit?url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' title='Submit this to Script & Style'/>
   </li>
   <li class='sexy-slashdot'>
   <a class='external' expr:href='"http://slashdot.org/bookmark.pl?url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' title='Submit this to SlashDot'/>
   </li>
   <li class='sexy-sphinn'>
   <a class='external' expr:href='"http://sphinn.com/index.php?c=post&m=submit&link=" + data:post.url ' rel='nofollow' title='Sphinn this on Sphinn'/>
   </li>
   <li class='sexy-springpad'>
   <a class='external' expr:href='"http://springpadit.com/clip.action?body=&url=" + data:post.url + "&format=microclip&title=" + data:post.title + "&isselected=true"' rel='nofollow' title='Spring this on SpringPad'/>
   </li>
   <li class='sexy-strands'>
   <a class='external' expr:href='"http://www.strands.com/tools/share/webpage?title=" + data:post.title + "&url=" + data:post.url ' rel='nofollow' title='Submit this to Strands'/>
   </li>
   <li class='sexy-stumpedia'>
   <a class='external' expr:href='"http://www.stumpedia.com/submit?url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' title='Add this to Stumpedia'/>
   </li>
   <li class='sexy-techmeme'>
   <a class='external' expr:href='"http://twitter.com/home/?status=Tip+@Techmeme+" + data:post.url + "--" + data:post.title + "&source=Way2blogging"' rel='nofollow' title='Tip this to TechMeme'/>
   </li>
   <li class='sexy-tipd'>
   <a class='external' expr:href='"http://tipd.com/submit.php?url=" + data:post.url ' rel='nofollow' title='Share this on Tipd'/>
   </li>
   <li class='sexy-tomuse'>
   <a class='external' expr:href='"mailto:tips@tomuse.com?subject=" + data:post.title + "&body=Link: " + data:post.url ' rel='nofollow' title='Suggest this article to ToMuse'/>
   </li>
   <li class='sexy-twittley'>
   <a class='external' expr:href='"http://twittley.com/submit/?title=" + data:post.title + "&url=" + data:post.url + "&desc=&pcat=Technology&tags="' rel='nofollow' title='Submit this to Twittley'/>
   </li>
   <li class='sexy-viadeo'>
   <a class='external' expr:href='"http://www.viadeo.com/shareit/share/?url=" + data:post.url + "&title=" + data:post.title + "&urlaffiliate=31138"' rel='nofollow' title='Share this on Viadeo'/>
   </li>
   <li class='sexy-virb'>
   <a class='external' expr:href='"http://virb.com/share?external&v=2&url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' title='Share this on Virb'/>
   </li>
   <li class='sexy-wikio'>
   <a class='external' expr:href='"http://www.wikio.com/sharethis?url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' title='Share this on Wikio'/>
   </li>
   <li class='sexy-wykop'>
   <a class='external' expr:href='"http://www.wykop.pl/dodaj?url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' title='Add this to Wykop!'/>
   </li>
   <li class='sexy-xerpi'>
   <a class='external' expr:href='"http://www.xerpi.com/block/add_link_from_extension?url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' title='Save this to Xerpi'/>
   </li>
   <li class='sexy-yandex'>
   <a class='external' expr:href='"http://zakladki.yandex.ru/userarea/links/addfromfav.asp?bAddLink_x=1&lurl=" + data:post.url + "&lname=" + data:post.title ' rel='nofollow' title='Add this to Yandex.Bookmarks'/>
   </li>
   <li class='sexy-bloggertricksandtoolz'>
   </li>
</ul>
<div class='sexy-link'>
</div>
</div>
</div>
</b:if>

NOTE: AGAIN MAKE SURE TO COPY ALL THE CODE

CUSTOMIZING YOUR SHARING BOOKMARK

Adjust the default width:700px to fit on the size of your website.
If you also want to make your “Sharing Bookmark” Visible on Homepage,
Simply delete the bolded blue part on the above code.

YOU CAN NOW SAVE YOUR TEMPLATE

And see it working perfectly on your blog.

ARE YOU CONFUSED REGARDING THIS TUTORIAL?

If you have any difficulties implementing and/or following this tutorial, Feel free to keep in touch with me and ill try my best to work it out.

Enhanced Css Ad Banner 125x125px V2 for Blogger

noreply@blogger.com (Debbie Navarro PH) — Fri, 21 Sep 2012 14:54:00 +0000

This is the enhanced version of the CSS Ad Banner that I posted few months ago, you can have a look on it here “Stylish CSS ad Banner V1”. This enhanced Ad banner size is 125px x 125px ,and has a default image and a color background that can always be replaceable. And, what I added in here is the hover effect on it. On hover, the leaf shape background will resize bigger and on mouse out, it will slowly go back to leaf shape. If you want this gadget installed on your blogger…Just Keep reading.

FOR LIVE DEMO CLICK HERE

INSTALLATION OF THE CSS AD BANNER

Go to your Blogger Dashboard
Layout
Add a Gadget
Choose HTML/JAVASCRIPT
and insert this code

<style type="text/css">
.adssidebar td
{
margin:10px 5px 10px;
padding:10px;
-moz-transition: all 0.8s ease-in-out;
-webkit-transition: all 0.8s ease-in-out;
-o-transition: all 0.8s ease-in-out;
-ms-transition: all 0.8s ease-in-out;
transition: all 0.8s ease-in-out;
border:0px solid #a1a1a1;
background:#20B2AA;
width:125px;
height:125px;
border-radius:100px 2px 100px 2px;
-moz-border-radius:25px; /* Firefox 3.6 and earlier */
}
.adssidebar td:hover
{
border-radius:50px 5px 50px 5px;
-moz-border-radius:25px; /* Firefox 3.6 and earlier */
}
</style>
<div class="adssidebar">
<table border="0" cellspacing="0" cellpadding="0" width="300"><tbody>
    <tr height="125">
      <td valign="top" width="89”>YOUR ADVERTISER BANNER HERE<td>

<td valign="top" width="551”>YOUR ADVERTISER BANNER HERE</td>
    </tr>

    <tr>
      <td valign="top" width="89”>YOUR ADVERTISER BANNER HERE</td>

   <td valign="top" width="551”>YOUR ADVERTISER BANNER HERE</td>
    </tr>
</tbody></table>
</div>
<center>
<span style='color#000000' font-size='14px'><b><a href="http://theyellowbulb.blogspot.com/">GRAB THIS.....</a></b></span></center>

NOTE: MAKE SURE TO COPY ALL THE CODE

CUSTOMIZATION OF YOUR CSS AD BANNER

Change the Bolded Blue to your own (Background:#20B2AA, Size:300px to fit on your sidebar, Image URL, Advertiser Page).

YOU CAN SAVE YOUR TEMPLATE NOW

And see it working on your blog.

ARE YOU CONFUSED REGARDING THIS TUTORIAL?

If you have any difficulties implementing and/or following this tutorial, Feel free to keep in touch with me and ill try my best to work it out.

Where To Get FREE Website Hits And FREE Twitter Followers

noreply@blogger.com (Debbie Navarro PH) — Tue, 18 Sep 2012 15:11:00 +0000

Take a look of this websites below that allows you to get FREE Website hits and at the same time free REAL & LEGITIMATE twitter followers. In getting a free hit and Twitter Followers on your website, you will need to surf other website to earn points or credits. Those points and credits will be used for you to get someone to view your website. Its like “Love Be Gets Love” I will view yours and you will view mine, a give and take situation. Browse and have a check of this list of websites below.

FREE TWITTER FOLLOWERS

letgetmorefollowers - 100 FREE TWITTER FOLLOWERS IN JUST MINUTES
newfollow - 100 FREE TWITTER FOLLOWERS IN JUST MINUTES

FREE WEBSITE HIT’S

Traffup - FREE WEBSITE HITS, TWITTER FOLLOWERS, RETWEETS.
TrafficSwarm - FREE WEBSITE HITS.
Linkreferral - FREE WEBSITE REVIEWS AND VISITORS.
EasyHits4U - TRAFFIC EXCHANGE.
TrafficAdBar - TRAFFIC EXCHANGE.
YouLikeHits - FREE WEBSITE HITS, TWITTER,GOOGLE+,PINTEREST,YOUTUBE FOLLOWERS.

For more list of useful resources CLICK HERE

LET ME HEAR YOUR THOUGHTS ABOUT THIS LIST

Thanks.

How I Got My Google Authorship Verification

noreply@blogger.com (Debbie Navarro PH) — Tue, 11 Sep 2012 14:33:00 +0000

My first attempt to Google Authorship Verification was almost three months ago, since those days I'm not quite hooked on blogging so I didn’t pay attention on it at all. But now that I had been publishing multiple blog post, I want to make my own brand. My first attempt was a failure, still I worked on it for three days and successfully I’m now seeing my Google+ profile photo right beside my blog on Google search. Some of the benefits of Google authorship verification are, of course:

Eye Catching - Your image thumbnail right beside your website with your byline makes you stand out among other on search results.

Building Your Credibility – When you see an image of the author right beside of the search results, I’m pretty sure you’ll think that this website has a quality content and for sure you’ll click on it first among others.

and the last thing “ Its awesome and Rewarding!”.

I will show you how I got my Google Authorship verification on my Blogger Blog successfully.

WHAT WE NEED

Your Google+ Profile
Your Profile Photo Must ne 250x250px
Your image must have a recognizable headshot
An “About Me” or “About Us” Page, Just put anything you want
Set your Byline To “By : Debbie Navarro” or “Author: Debbie Navarro”

Where all set, Follow this instructions very carefully

Go to your Google+ Profile (if you don’t have create here)
Click EDIT PROFILE
Scroll Down and Find CONTRIBUTOR
Click that and add your Website Title and URL (see screenshot below)
Also add your “About Me” page Title and URL (see screenshot below)
Set your visibility to public
Save it and go now to your blog.

Associate your blog to your Google+ Page

Now, we need to connect your BLOGGER Blog To your Google+ profile
To do that you must insert this code to your sidebar or footer or in your social profiles.

<a href='https://plus.google.com/YOUR ID HERE' rel='author' target='_blank' title='Follow Us On Google+'></a>

The rel=’author’ parameter should be inserted, if it’s missing Google won’t be able to associate your content with your Google+ profile.

Next lets associate your “About Me” page to your Google+ page

In your “About Me” Page , we need to insert the rel='me' parameter inside of your Name (The name should be same in your Google+ Profile)
For example:

So our code must looks like this:

<a href='https://plus.google.com/YOUR ID HERE' rel='me' title='Debbie Navarro'>Debbie Navarro</a>

Change my name to your Google+ Name
And also change the title=’debbie navarro’ to your name
And add your Google Plus ID

To check if the process works , Try the Rich Snippet Tool You will see something like this: If you see a “Verified: Authorship Markup” message it means you successfully associate your blog & Google+ accounts.

Wait for maximum 2days to your image will be shown beside your blog.

Let me hear you thoughts about this post

This is how I successfully associate my Google+ account and my Blog, I just hope this will work also with you.

ARE YOU CONFUSED REGARDING THIS TUTORIAL?

If you have any difficulties implementing and/or following this tutorial, Feel free to keep in touch with me and ill try my best to work it out.

The Yellow Bulb│Blogger Tips n Tricks │ Tutorials and Widgets

Enable HTTPS for Blogspot domain blogs

Watch this video to learn how to activate Https to your blog

FIXED: part of the process of setting a preferred domain is to verify that you own

How to add Google Analytics on Blogspot

Having trouble? Watch this video tutorial.

How to Get Google to Reindex Your Website Quickly

How To Add Post Views Counter To Blogger

Learn How To Back Up, Restore and Upload a New Template on Blogger

Backing Up An Existing Blogger Template

Testimonial Slider Text Widget with JQuery Cycle Plugin

Blogger Released New Responsive Themes

Top 10 Sites To Get FREE Blogger Templates 2017

How to Set Up AddThis Smart layers on Blogger

Customize Bullet List on Post Area For Blogger

Related Post with Thumbnail Plugin For Blogger

UPDATE: Nrelate closes it doors this year . Therefore this tutorial doesn't work anymore.

Introducing Google+ Followers Gadget On Blogger

How To Add PayPal Donate Button On Blogger

Add This Animated Flash Clock's Widget

Advanced Email Subscription Widget For Blogger

Simple and Neat Css3 Gradient Buttons For Your Website

Tips For Blogger Conditional Tags

Recent Post Widget with Image Hover effect

Customize Your Blogger Mouse Cursor

Secure Your Website And Blog Against Malware Trojan And Hackers

How To Add “Share The Knowledge” Bookmark V3 To Blogger

Enhanced Css Ad Banner 125x125px V2 for Blogger

Where To Get FREE Website Hits And FREE Twitter Followers

How I Got My Google Authorship Verification