Showing posts with label blogging tutorial. Show all posts
Showing posts with label blogging tutorial. Show all posts

Follow By Email Gadget for Blogger

Many blog readers prefer to receive updates of new posts by email (rather than subscribing in an RSS feed reader). To make it even easier for our readers to stay in touch with our sites, the Blogger Team have developed a new, official gadget: Follow by Email.Recently Blogger has added a new Gadget/Widget to its ever improving list of blogger gadgets. They call it Follow By Email

To add this Gadget, Follow these simple steps

1. Login to your Blogger Dashboard, Navigate to Design Page Elements tab and click on the “Add a Gadget” Link
2.On the next window click on the plus sign, and you will be taken to the gadget options page.
3. Click the save Button and you are done.

You are done now!! :) Wasn’t that simple?

Blogger introduce Different views to present your content


Blogger now offers you the ability to present your content in several new and exciting ways.

These dynamic views will work on your blog if all of the following are true:


  • Your blog is public. Your readers don’t need to sign in to view your blog.


  • Your blog has feeds fully enabled. In the Settings | Site feed tab, you have enabled either Full or Jump Break for your Post Feed.


  • You have not disabled dynamic views. In the Setting | Formatting tab, the option for Enable Dynamic Views is set to Yes.




  • If any of the above conditions are not true, users who attempt to access dynamic views for your blog will instead be taken to a landing page and redirected to your original blog in a few seconds.
    If all of the above conditions are true, your readers can access the dynamic views for your blog by simply appending /view to the URL. 
    for ex check out the different views of technowit

    1. sidebar
    2. flipcard
    3. mosaic
    4. snapshot
    5. timeslide
    check out this video tutorial

    What’s New With Blogger


    blogger
    Earlier in 2010 Blogger has added to many new features like new Template designer ( enables to create templates without any knowledge of HTML/CSS ), different fonts where added, stats option,comments filtering etc.

    And now in 2011 blogger has previewed some of the features on http://buzz.blogger.com/that will be launched. Some of  these features which blogger has allowed its users to sneak peak are:-
    1. New look of dashboard – See the screenshot of new blogger dashboard
    [Open in new window to see a large view]
    2. New post editor -
     
    [Open in new window to see a large view]
    See this video to have a better idea

    Search box with hiding text



    While surfing through many blogging resource websites I found many tutorials that explained how to create a search box with default text inside the input but that text didn’t hid itself whenever the input was clicked for typing.
    But recently I came across the website of one of our reader’s jdsans which had this tutorial to create a search option with text hiding capability on clicking. The widget works perfect in HTML/JavaScript widget option but it doesn’t work in the template code area. But I removed that bug so this widget is perfect to work on both the places.
    Unfortunately there are two different codes for both the above purposes.
    1. If you want to install the search box in HTML/JavaScript widget use this code
    <form id="searchThis" action="/search" style="display:inline;" method="get"> 
    <input id="searchBox" name="q" size="20" type="text" value="Search This Blog...." onfocus="if(this.value==this.defaultValue)this.value='';" onblur="if(this.value=='')this.value=this.defaultValue;"/> <input id="searchButton" value="Search" type="submit"/> 
    </form>
    2. If you want to use the search box in the template code use this one:-
    <form id="searchThis" action="/search" style="display:inline;" method="get"> 
    &lt;input id=&quot;searchBox&quot; name=&quot;q&quot; size=&quot;20&quot; type=&quot;text&quot; value=&quot;Search This Blog....&quot; onfocus=&quot;if(this.value==this.defaultValue)this.value=&#039;&#039;;&quot; onblur=&quot;if(this.value==&#039;&#039;)this.value=this.defaultValue;&quot;/&gt;
    <input id="searchButton" value="Search" type="submit"/> 
    </form>
    In both the codes above 20 represents the box size and “Search this Blog…” represents the default text that will be seen in the input area. You can change both these values as you like.


    Link Exchange Service




    While browsing sites for getting free traffic to my blog, I found a very interesting but doubtful site called binary traffic dot com, So i decided to write about and check wheter it is possible to get real traffic from this site and I signed up to just test it.

    Lets see what the webmaster of the binary traffic site want to say about it:

    Webmaster of Binary Traffic Dot Com says: Do you want lots of web traffic? Then you better read this!

    We can make web sites with tons of traffic and hits, we have sites with #1 positions on Google (TM), we have many domains names and generate several million dollars a year from web based businesses. We even know what your thinking! You think we are arrogant. Well we don't care, we know how to make sites big on the interent and if you want to be a sucess too then we can help. In business it is all about money and the first rule for web business is:  "Web traffic = Money"

    I think that it really works and is a good tool for all the bloggers for creating backlinks...

    Lets Start adding our blog and website links below to check it:

    ALSO SEE:SET REMINDER FOR YOUR VISITORS

    Social widget for posts with all social buttons with count


    widget
    In this post I going to tell you how to install a simple social widget inside the posts having generally used social buttons with counters.
    You can see the screenshot of the the widget above. Follow the below steps to install it.
    Step 1. Go to your template code dashboard>>design>>edit HTML. Now click the box named Expand widget template. Search for  ]]></b:skin> and paste this code above it.
    .social-bar { border: dashed #ddd; border-width:1px 0 1px 0; margin: 10px auto 10px; display:block; padding: 3px 0 1px 0px; overflow: hidden; }
    .social-bar .social_button {float: left; display: inline; overflow: hidden; height:22px; }
    .social-bar .social_button.dg { margin: 0px 0 0 20px ; padding-top: 2px;}
    .social-bar .social_button.tm { margin: 0px 0 0 20px; padding-top: 4px;}
    .social-bar .social_button.fb { margin: 0 0 0 20px; padding-top:3px;}
    .social-bar .social_button.su { margin: 0px 0 0 20px; padding-top: 2px;}
    .social-bar .social_button.buzz { margin-left:20px ; padding-top: 3px;}
    Step 2. Now find this code <div class='post-header'> and paste this code below it.
    <b:if cond='data:blog.pageType == &quot;item&quot;'><div class='social-bar'>
    <div class='social_button dg'> 
    <a class='DiggThisButton DiggCompact'/><script src='http://widgets.digg.com/buttons.js' type='text/javascript'/> 
    </div> 
    <div class='social_button tm'> 
    <div style='float:right;width:90px;height:25px'> 
    <a class='twitter-share-button' data-count='horizontal' data-via='technowit' href='http://twitter.com/share'>Tweet</a><script src='http://platform.twitter.com/widgets.js' type='text/javascript'/></div> 
    </div> 
    <div class='social_button fb'> 
    <iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=button_count&amp;show_faces=false&amp;width=100&amp;action=like&amp;font=verdana&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:80px; height:27px;'/> 
    </div> 
    <div class='social_button su'> 
    <script src='http://www.stumbleupon.com/hostedbadge.php?s=1'/> 
    </div> 
    <div class='social_button buzz'> 
    <a class='google-buzz-button' data-button-style='small-count' href='http://www.google.com/buzz/post' title='Post to Google Buzz'/> 
    <script src='http://www.google.com/buzz/api/button.js' type='text/javascript'/> 
    </div></div></b:if>
    Save the template and its done.
    The above hack is for the widget to appear in the head. But if you want it to appear in the footer then search for <div class='post-footer-line post-footer-line-1'> or <div class='post-footer-line post-footer-line-2'> or <div class='post-footer-line post-footer-line-3> and paste the code in step 2 below any of those three.

    Set reminder for your visitors

    Do u think that your visitors may forget to comeback to your blog.So remind your visitors when they visit your blog.A new of reminder introduced by a Remind this.It is very easy to use and simple installation process.check out the demo below
    DEMO-:



    style1
    Close

     now when any visitor move cursor over this button the reminder set for the visitor.
                   This is a great way to encourage repeat visits and increase traffic to your website






    BUTTON CUSTOMIZATION and SETUP






    Signing up for your button is free and simple. Once you sign up, the control panel gives you access to account settings, button setup, button management and statistics. When creating your button, you get to choose the position and style of the button. It would be nice to be able to change the wording on the button. Of course, if you’re pretty handy with Photoshop you could create your own button image to use in place of the RemindThis default ones.






    ADD BUTTON TO YOUR WEBSITE


    Once done you’ll get a code to paste into your blog or website. Keep in mind that the button does contain JavaScript, so it may not work on some sites (depending on what type of site you’re trying to use it on). With the button now on your site, just a mouse scroll over it will bring up the RemindThis window. This is where users can setup an email notification that will remind them to visit your site the next day, in a week, in a month or on a certain date.

    VIEW YOUR STATISTICS
    It’s great that RemindThis does offer statistics because this way you can see if visitors are actually using your button. You’ll be able to see the total number of email notifications sent for each button that you setup. You can also filter your results for a specific range of dates.
    While RemindThis is a great blog tool, it does seem to be a little lacking in some areas. Let’s hope to see some improvements that will not only benefit blog and website owners, but also the visitors who opt to use the RemindThis button on your site.

    Show Upgrade browser message to older browser versions





    upgrade_browser
    A major traffic to any site is generally from Firefox or Internet Explorer if we consider the browsers. If we see the type of operating system then the people which visit the site generally use Windows XP or MAC. Windows XP provides IE6 as its default browser. And there are a majority of people which don’t have any information about new browsers so they use IE6 to surf on the web.
    This makes IE6 as the commonly used browser from the Internet Explorer family that is used by a majority of users. IE6 is a downgraded explorer. If your site is designed using the modern techniques of web-development then IE6 will definitely show some errors until you sought them out.
    Another option is to make the users visiting the site upgrade their browser. We can’t do it ourselves but can provide information to the users that “there are newer browsers available and you should upgrade to these”.
    There is this script by DevSlide which enables you to embed a message which will appear to the users whenever they visit a downgraded browser like IE6. You can see the example @ my template http://basic-demo.blogspot.com/. This message will only appear in downgraded browsers Internet Explorer with version 6 or lower.
    If you don't see the message then clear the cookies in you browser and the refresh the page. You will see the message again.
    There are two ways of getting this script:-
    1. On our server (Default version) – Below is the script hosted on our server using the default message. Add this code in your template code above</head> tag.
    <link href='http://bloggerz.googlecode.com/files/browser_detection.css' media='screen' rel='stylesheet' type='text/css'/>
    <script src='http://bloggerz.googlecode.com/files/browser-detection.js' type='text/javascript'/>
    2. Get the code from DevSlide (Configure it your way) – Get the code from DevSlide after configuring as place it in you template code above</head> tag.