HOW TO CREATE A POP UP WINDOW IN MY WEBSITE (BLOGGER, WORDPRESS ETC)

HOW TO CREATE A POP UP WINDOW IN MY WEBSITE (BLOGGER, WORDPRESS ETC)

You might notice in some websites that a popup window opens suddenly without the knowledge of you which leads to other websites and they do it for some promotional purpose. It’s easy to add popup window for blogger and adding popup window helps in increasing page views of your blog and you can help visitors to know useful links within your site and other external sites.

How to create a popup window for Blogger

1. Login to your blogger  account
2. Go to Dashboard >> layout and click “add a gadget” from sidebar or footer
3. Open HTML/JavaScript gadget
4. Add the following script in HTML/JavaScript content area and click save.

<script type="text/javascript">

document.body.onclick= function(){

window.open('http://adf.ly/VFSZV', 'poppage', 'toolbars=0, scrollbars=1, location=0, statusbars=0, menubars=0, resizable=1, width=950, height=650, left = 300, top = 50');

}</script>

Note:

1. Make sure to change the http://adf.ly/VFSZV URL
2. Customize the width and height of the popup window like you wish

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

For more details please watch the video below:

Thank You:tutorialsway

Read More

How to Your Website Virus Scan!

How to Your Website Virus Scan! 

Follow the Steps

1. Go To The This Website: www.virustotal.com
2. Select To the URL Type

        3.Enter The Ur Website:

        4.Select the Scan It Button

        5.Give the ur website Result

Read More

How to Add Numbered Page Navigation to Blogger

How to Add Numbered Page Navigation to Blogger

How to Add Numbered Page Navigation to Blogger

Step 1. Log in to your Blogger Account
Step 2. Select your Blog and go to Template >> Edit HTML and Search (Ctrl + F) for the following tag

]]></b:skin>

Step 3. Now choose one of the following numbered page navigation styles, copy its code and paste it just above/before ]]></b:skin> tag

Style #1

#blog-pager{clear:both;margin:30px auto;text-align:center; padding: 7px;}
.blog-pager {background: none;}
.displaypageNum a,.showpage a,.pagecurrent{padding: 5px 10px;margin-right:5px; color: #F4F4F4; background-color:#404042;border:2px solid #ccc;}
.displaypageNum a:hover,.showpage a:hover, .pagecurrent{background:#666666;text-decoration:none;color: #fff;}
#blog-pager .showpage, #blog-pager, .pagecurrent{font-weight:bold;color: #000;}
 .showpageOf{display:none!important}
#blog-pager .pages{border:none;-webkit-box-shadow: 0px 5px 3px -1px rgba(50, 50, 50, 0.53);-moz-box-shadow:0px 5px 3px -1px rgba(50, 50, 50, 0.53);box-shadow: 0px 5px 3px -1px rgba(50, 50, 50, 0.53);}

Style #2

#blog-pager{clear:both;margin:30px auto;text-align:center; padding: 7px;}
.blog-pager {background: none;}
.displaypageNum a,.showpage a,.pagecurrent{padding: 5px 10px;margin-right:5px; color: #000; background-color:#fff;border:2px solid #ccc;}
.displaypageNum a:hover,.showpage a:hover, .pagecurrent{background:#222;text-decoration:none;color: #fff;}
#blog-pager .showpage, #blog-pager, .pagecurrent{font-weight:bold;color: #ccc;}
 .showpageOf{display:none!important}
#blog-pager .pages{border:none;-webkit-box-shadow: 0px 5px 3px -1px rgba(50, 50, 50, 0.53);-moz-box-shadow:0px 5px 3px -1px rgba(50, 50, 50, 0.53);box-shadow: 0px 5px 3px -1px rgba(50, 50, 50, 0.53);}

Style #3

#blog-pager{clear:both;margin:30px auto;text-align:center; padding: 7px;}
.blog-pager {background: none;}
.displaypageNum a,.showpage a,.pagecurrent{padding: 5px 10px;margin-right:5px; color: #F4F4F4; background-color:#2aa4cf;}
.displaypageNum a:hover,.showpage a:hover, .pagecurrent{background:#1D7290;text-decoration:none;color: #fff;}
#blog-pager .showpage, #blog-pager, .pagecurrent{font-weight:bold;color: #000;}
 .showpageOf{display:none!important}
#blog-pager .pages{border:none;-webkit-box-shadow: 0px 5px 3px -1px rgba(50, 50, 50, 0.53);-moz-box-shadow:0px 5px 3px -1px rgba(50, 50, 50, 0.53);box-shadow: 0px 5px 3px -1px rgba(50, 50, 50, 0.53);}

Style #4

#blog-pager{clear:both;margin:30px auto;text-align:center; padding: 7px;}
.blog-pager {background: none;}
.displaypageNum a,.showpage a,.pagecurrent{padding: 5px 10px;margin-right:5px; color: #F4F4F4; background-color:#00CC00;border:2px solid #008E00;border-radius:2px;}
.displaypageNum a:hover,.showpage a:hover, .pagecurrent{background:#008E00;text-decoration:none;color: #fff;}
#blog-pager .showpage, #blog-pager, .pagecurrent{font-weight:bold;color: #000;}
 .showpageOf{display:none!important}
#blog-pager .pages{border:none;-webkit-box-shadow: 0px 5px 3px -1px rgba(50, 50, 50, 0.53);-moz-box-shadow:0px 5px 3px -1px rgba(50, 50, 50, 0.53);box-shadow: 0px 5px 3px -1px rgba(50, 50, 50, 0.53);}

Style #5

#blog-pager{clear:both;margin:30px auto;text-align:center; padding: 7px;}
.blog-pager {background: none;}
.displaypageNum a,.showpage a,.pagecurrent{padding: 5px 10px;margin-right:5px; color: #F4F4F4; background-color:#FF8000;border:2px solid #B25900;border-top-right-radius:7px;border-bottom-left-radius:7px;}
.displaypageNum a:hover,.showpage a:hover, .pagecurrent{background:#B25900;text-decoration:none;color: #fff;}
#blog-pager .showpage, #blog-pager, .pagecurrent{font-weight:bold;color: #000;}
 .showpageOf{display:none!important}
#blog-pager .pages{border:none;-webkit-box-shadow: 0px 5px 3px -1px rgba(50, 50, 50, 0.53);-moz-box-shadow:0px 5px 3px -1px rgba(50, 50, 50, 0.53);box-shadow: 0px 5px 3px -1px rgba(50, 50, 50, 0.53);}

Style #6

#blog-pager{clear:both;margin:30px auto;text-align:center; padding: 7px;}
.blog-pager {background: none;}
.displaypageNum a,.showpage a,.pagecurrent{padding: 5px 10px;margin-right:5px; color: #F4F4F4; background-color:#009999;border:2px solid #006B6B;border-radius:999px 999px 999px 0px;}
.displaypageNum a:hover,.showpage a:hover, .pagecurrent{background:#006B6B;text-decoration:none;color: #fff;}
#blog-pager .showpage, #blog-pager, .pagecurrent{font-weight:bold;color: #000;}
 .showpageOf{display:none!important}
#blog-pager .pages{border:none;-webkit-box-shadow: 0px 5px 3px -1px rgba(50, 50, 50, 0.53);-moz-box-shadow:0px 5px 3px -1px rgba(50, 50, 50, 0.53);box-shadow: 0px 5px 3px -1px rgba(50, 50, 50, 0.53);}

Style #7

#blog-pager{clear:both;margin:30px auto;text-align:center; padding: 7px;}
.blog-pager {background: none;}
.displaypageNum a,.showpage a,.pagecurrent{padding: 5px 10px;margin-right:5px; color: #F4F4F4; background-color:#FFCC00;border:2px solid #B28F00;border-radius:999px 999px 999px 999px;}
.displaypageNum a:hover,.showpage a:hover, .pagecurrent{background:#B28F00;text-decoration:none;color: #fff;}
#blog-pager .showpage, #blog-pager, .pagecurrent{font-weight:bold;color: #000;}
 .showpageOf{display:none!important}
#blog-pager .pages{border:none;-webkit-box-shadow: 0px 5px 3px -1px rgba(50, 50, 50, 0.53);-moz-box-shadow:0px 5px 3px -1px rgba(50, 50, 50, 0.53);box-shadow: 0px 5px 3px -1px rgba(50, 50, 50, 0.53);}

Step 4. Again find (Ctrl + F) this tag

</body>

Step 5. And add the following script just above/before it

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<script type='text/javascript'>
  /*<![CDATA[*/
    var perPage=6;
    var numPages=6;
    var prevText ='◄';
    var nextText ='►';
    var urlactivepage=location.href;
    var home_page="/";
  /*]]>*/
</script>
   <script type="text/javascript" src="http://yourjavascript.com/1285534128/pagenavigationupdated.js"></script>
</b:if>
</b:if>

Customization:

• var perPage=6; No. of posts to show perPage
• var numPages=6; No. of pages to show in Navigation
• var prevText ='◄'; Text to show for Previous Page button
• var nextText ='►'; Text to show for Next Page button

Step 6. Press the Save Template button

And you're done

From Editors Desk

We hope this article may have helped you in learning How to Add Numbered Page Navigation to Blogger. Share this article with your friends and don't forget to subscribe us via email.

Tks For:http://www.blogolect.com

Read More

How to remove powered by blogger from blogger.

How to remove powered by blogger from blogger.

Blogger by Google provides many of useful widgets with blogger and some are protected with remove option one of this 'Powered by blogger ' attribution in this widget blog host can add his own name and Text which he wants to able to see on blog at last. Users who does't like this widget adds another widgets after replacing this or keeps it blank. 

HERE we start with 'How to remove powered by blogger'  

Step:1 login to Blogger.com and choose blog from which you want to remove attribution. Now go to TEMPLATE and click on EDIT HTML after that  move cursor on button 'Jump to widget '  and choose ' attribution1 ' after that u will see some thing like this ...
<b:widget id='Attribution1' locked='false' title='    

Step:2  Just replace locked='false' with locked='true' and then save template. now go to LAYOUT and click on TOOLS button of attribution1 and you will see popup window like above then click on remove button after that On SAVE you done.

Note :  After removing attribution some time it not removed for permanent period in this condition perform step 1 with other browser and step 2 with another browser. and after that clean the cache of both browser.

Read More

Add stylish author box below every posts in blogger

Add stylish author box below every posts in blogger

Step 1: In your blog’s template code find <div class='post-footer-line post-footer-line-1'>
Step 2: Paste following code just below it and save the template.

Note: In the following code change Green color code with your social network addresses, Red color code with your profile picture address and Purple color code with your introduction.

Read More

How To Add A Facebook Like Button to Blogger Posts

1. Go to your Blogger dashboard
2. Click on Template in the sidebar, then Edit HTML
3. Click inside of the text area and press CTRL + F (or CMD + F on a Mac) to open up the “Find” text box.
4. Inside the “find” box in the top right corner of the text area, enter this code and press enter TWICE. You want to work with thesecond instance of it:

Read More

How to customize "About Me" widget in Blogger using CSS?

Screen Short

About Me widget is a widget that display the author details in sidebar or desired location in the blog ; of single person or a team.For personal bloggers their is a strong reason to throw up this widget, that is to describe the author and to connect Google Plus profile with it.A few reason why to customize the About Me widget?

• Fits with your template.
• Look better than before one.
• Helps to highlight the author and its description.

Read More

Adding official Twitter follow button to Blogger

Adding official Twitter follow button to Blogger

Make it easier for your blog visitors to follow you on Twitter by adding Twitter Follow button to your blog.

The Twitter Follow Button lets them follow you straight from your blog, without having to visit Twitter.  All it takes is just one click (if they are logged in).

The button comes with (optional) followers count. Visitors can also see your profile and latest tweets by clicking the button.

Read More

Alert-message-and-dialog-Box

You can display an alert message box to give a special announcement, provide information, or warn the readers before they view the full contents of your site. The pop up box will contain your message and have an “OK” button for viewers to proceed, or a prompt or cancel button to redirect readers to another site. We can further customize our Blog by asking for the reader's name and inserting this input automatically into a welcome message. This tutorial will show you how the JavaScript for these alert and dialog boxes can be inserted into your Blog.

Read More

Add Vertical Floating Social Sharing Bar For Blogger

hi my friends today, I'll give you a nice topic and help spread your blog,Social Bookmarking helps you to get quick traffic to your blog. This floating bar is having Facebook, Google plus, twitter, linked-in, Email and Pinterest social share buttons. If you want to add more buttons in it then you can make your own widget by going to sharethis.com and create a floating widget for your blog.

HOW TO ADD VERTICAL FLOATING SOCIAL SHARING BAR FOR BLOGGER

Live Demo

Written explanation 

1) Go to Blogger Dashboard → Template → Edit HTML.

2) Now Find the code shown below using [ctrl+F] (Use In HTML Box)

</head>

3) Now Paste the Code Shown Below just Before it.

<script type="text/javascript">var switchTo5x=true;</script>
<script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script>
<script type="text/javascript" src="http://s.sharethis.com/loader.js"></script>
<script>
var options={ "publisher": "074821ed-063e-4ae5-bad9-3e26ecf249f3", "position": "left", "ad": { "visible": true, "openDelay": 5, "closeDelay": 0}, "chicklets": { "items": ["facebook", "googleplus", "twitter", "linkedin", "email", "pinterest"]}};
var st_hover_widget = new sharethis.widgets.hoverbuttons(options);
</script>

4) Now Save Your Template. 

Read More

Add Round Shape Popular Posts Widget for Blogger

Today's topic is important for each user blog. added months where "Posts common," which is one of the latest additions and beautiful; But today is a form new and wonderful as you see in the picture

Posts common is that you view the most important topics in the blog where  visits to these pages, This is extremely useful for bringing visitors where his best displays threads in blog.

How To Add Round Shape Popular Posts Widget for Blogger

Read More

Add Cool All In One Subscription Box For Blogger

Monday, November 18, 2013

Today, my friends, I'll give you an excellent addition and beautiful, Characterized by the characteristics of the positive, which help in Earn Fans And keep track Add Stylish All In 1 Social/Email Subscription Box For Blogger and Add New Social/Email Subscription Box Widget For Blogger

Read More

Add Featured Posts Slider Widget For Blogger

Hello, my friends, is a slideshow of the most important additions are looking for many people because they add a distinctive

Read More