Saturday, 2 February 2013

Remove Attribution Widget From Blogger


Today I'll show you how to remove attribution (Powered by Blogger) widget from your blog. It's always hard for newbies to remove this widget but don't worry about that.

In this tutorial, you'll learn about removing locked widget from your blog, just like Attribution widget. Not much to explain, let's get started:

  • Go To Blogger > Template > Edit HTML > Proceed:
  • Find following code in your  template:

<b:widget id='Attribution1' locked='true' title='' type='Attribution'/>

  •  Now, just replace locked='true' in above code with locked='false'. Save your template.

Now your attribution widget in unlocked. If you want remove, then you can remove it from your layout section. In next post, i'll show you how to removing attribution widget from your mobile template.

Thursday, 31 January 2013

Display Your Feed On A HTML Page


About every blogger now is using feedburner to publish their feed. By using feedburner, you can get realtime stats and subscriber count. You can even use a custom domain with feedburner. You can display your feedburner feed on Blogger with a simple feed widget but you can't use that widget on your html site. Don't worry, you can still display your feed on a static html or your website by using BuzzBoost. Here we go:

Go To FeedBurner > Click on your feed:


Click on the "Publicize" tab, and then click on "BuzzBoost" in the list at the left side of the screen (see image below). At this point BuzzBoost will give you a number of different options. Choose your preference and click on "Active" button. If you’ve already activated BuzzBoost you’ll see the option to save instead of activate.


Once you choose your settings and activate BuzzBoost you will be provided with the piece of code. Copy the code provided by FeedBurner and paste it into your page wherever you want it to be displayed. You're completely free to use my feeds on your blog:

<script src="http://feeds.feedburner.com/WidgetCraft?format=sigpro" type="text/javascript" ></script><noscript><p>Subscribe to RSS headline updates from: <a href="http://feeds.feedburner.com/WidgetCraft"></a><br/>Powered by FeedBurner</p> </noscript>

It's done, you can also style this code by using some css:

.feedTitle {
background: none repeat scroll 0% 0% whitesmoke;
padding: 10px;
text-align: center;
font-size: 20px;
font-weight: bold;
border: 1px solid rgb(81, 104, 59);
}
.feedburnerFeedBlock ul {
margin-left:0;
padding-left:0;
list-style-type: none;
}

.feedburnerFeedBlock ul li {
padding: 5px;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #E0E0E0;
}

.feedburnerFeedBlock ul li span.headline a {
color: #990000;
text-decoration: none;
display: block;
}

.feedburnerFeedBlock ul li span.headline a:hover {
color: #535353;
}

#creditfooter {
display: none;
}

Tuesday, 29 January 2013

Create A Free Android App For Your Blog


Android is a Linux-based operating system designed primarily for touchscreen mobile devices such as smartphones and tablet computers. Initially developed by Android, Inc., which Google backed financially and later purchased in 2005.

It's really great idea to create a native Android app for your blog. In this tutorial I'll show you how to create an Android app without any App Development knowledge. Download an example at this link.

AppsGeyser is a free service that converts your content into an App and makes you money. Your app will have all you need including messaging, social sharing, tabs and full support for HTML5 enhancements.

Visit AppsGeyser and Sign Up. After signing up, click on 'Create App' button. You'll see a big list of app tabs. Now we have to choose a suitable tab for our app. I'll tell you about two different methods:

Using Mobile Site

If you're using Blogger Mobile template or you have a mobile version of your site then you can choose 'Website' option:


In next page fill up your site details and preference (I'll use my second blog WWE Fans Nation to explain this tutorial):


In Website URL section fill your mobile sites url (http://www.yourblog.com?m=1 for blogger users.) Fill all fields and then click on 'Create App' button. It's Done!!! In next page you'll receive downloading link and more options about your app. You can download this app by clicking here.

Using Feed

You can also create an Android app using your blog's feed. Click on 'Create App' button and in next page choose 'NEWS Feed' option:


Hope you're using feeds on your blog. In next page fill up your feed's url and some details:


Now fill your feed url (Ex: http://feeds.feedburner.com/WWEFansNation) and fill your app's details. After completing this form click on 'Create App' button. In next page you'll receive downloading link and more options about your app. You can download this app by clicking here.

You can add more than one tabs to your app. Also, you can monetize your Android app using AppsGeyser's publishers program.

You can also publish your app on Google Play by paying one time 25$ fee. Don't forget to leave a comment.

Wednesday, 23 January 2013

Stylish CSS Sprites Menu For Blogger

It's always hard to find a suitable menu for your blog. We're making that decision more hard for you by sharing another awesome menu... :p Remember, you can't change menu option, because it's an image based menu. Here we go:

  • Go To Blogger > Template > Edit HTML > Find ]]></b:skin>.
  • Just above ]]></b:skin> post following css:

/*Menu Stars BWidgets.com */
.bwidgets-nav {
    display:block;
    height:72px;
    margin:30px auto;
    position:relative;
    width:525px; }
.bwidgets-nav ul {
    float:none;
    list-style-image:none;
    list-style-type:none;
    margin:3px 0; }
.bwidgets-nav ul li {
    background-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdoeMzNPpTXbvyIK9XVcaPLMaIhPyECOa_ZkXtlYYXdu1DqXelgqfZhxHE9Ps3pQcNvJU6MsF1FRkgyF9aPSF5-FTLhZUMgTU32xvQK_9YRann8kyme9ND8jXlg-9vDc28lmAL2s0yW9I/s1600/SpritesMenu.png');
    background-repeat:no-repeat;
    float:left;
    height:72px;
    margin:0px;
    padding-top:5px;
    position:absolute; }
.bwidgets-nav ul li a {
    display:block;
    height:100%;
    width:100%; }
.bwidgets-nav ul li.sm1 {
    background-position:0 0;
    left:0px;
    width:125px; }
.bwidgets-nav ul li.sm2 {
    background-position:-125px 0;
    left:100px;
    width:124px; }
.bwidgets-nav ul li.sm3 {
    background-position:-249px 0;
    left:200px;
    width:124px; }
.bwidgets-nav ul li.sm4 {
    background-position:-373px 0;
    left:300px;
    width:125px; }
.bwidgets-nav ul li.sm5 {
    background-position:-498px 0;
    left:400px;
    width:126px; }
.bwidgets-nav ul li:hover {
    z-index:1000; }
.bwidgets-nav ul li.sm1:hover {
    background-position:0 -75px; }
.bwidgets-nav ul li.sm2:hover {
    background-position:-125px -75px; }
.bwidgets-nav ul li.sm3:hover {
    background-position:-249px -75px; }
.bwidgets-nav ul li.sm4:hover {
    background-position:-373px -75px; }
.bwidgets-nav ul li.sm5:hover {
    background-position:-498px -75px; }
/*Menu Ends BWidgets.com */

  • Now save your template...
All done with this past, now it's time to add html mark-up of this menu on your layout.

  • Go To Blogger > Layout > Add A Gadget > HTML/JavaScript > Paste following code:

<div class="bwidgets-nav">
<ul>
<li class="sm1"><a href="#"></a></li>
<li class="sm2"><a href="#"></a></li>
<li class="sm3"><a href="#"></a></li>
<li class="sm4"><a href="#"></a></li>
<li class="sm5"><a href="#"></a></li>
</ul>
</div>

Replace all # in above code with your links.....Save It.......

Don't forget to leave a comment.... :)

Sunday, 20 January 2013

We Are Now Accepting Guest Posts


It's time for me to take some rest, while you can get featured on TricksPanda.com & BWidgets by writing a guest post for our blog. It's a great way to promote your blog or profiles. You'll be free to write any legal thing on your guest post.

How To Submit?

It's easy, just email me your guest post on contact[at]bwidgets.com. (.html or .zip)

You'll Get...

You'll get full credit of your guest post, also a backlink to your blog. Don't forget to email me your name and website. I'll also post "About Author" column below your guest post. It's great way to get more fans.

More Info:

Niche:

  • Blogging
  • Web Designing
  • Internet
  • Android
  • Google
  • Social Media
  • Money Blogging
  • WordPress

Supported formats:

  • .zip
  • .html
  • .txt

By submitting a guest post you accept:

  • It's an original and fresh post. (No Copycats Allowed)
  • We can modify your post. (Only to make some changes, not much)
  • Your post is totally legal. (Only legal posts accepted. Not for hackers.)
  • I'am Awesome. (Most important point)

Saturday, 19 January 2013

Blogger File Hosting Solution


Unlike WordPress, Blogger doesn't provides file hosting. You can only upload images on your blog via Picasa. Every blog owner needs some kind of file hosting to host their scripts, projects, documents and all. In this post, I'll discuss upload several sites, which provides free file hosting. All sites are powered by Google.

Picasa: Picasa is Google's official image hosting website, where you can host all your images. It's totally free and it works via Blogger's image uploader. Your blog's all images are hosted in Picasa.

YouTube: YouTube is Google's video hosting website also world's #1 video hosting website. You upload and embed your videos on your blog via YouTube. It's a great way to promote your blog with your videos. It's totally free, and you can also earn some money via YouTube.

Google Code: Google Code is best place for all developers. You can host your js, css, html, swf, zip, images, txt and bunch of more files formats on Google Code. Google Code is also totally free and it provides 4GB space. You can learn about hosting your files on Google Code on our site.

Google Sites: Google Sites is a free and easy way to create and share webpages. You can also hosts your files on Google Sites. It supports css, js, zip, swf, images and bunch more files formats. It provides 100MBs of free storage per site. You can create unlimited sites on Google Sites. Best part of Google Sites is that you can use your custom domain.

Google Drive: Google Drive is a file storage and synchronization service by Google. Google Drive gives all users 5 GB of cloud storage to start with. A user can get additional storage, which is shared between Picasa and Google Drive, from 25 GB up to 16 TB through a paid monthly subscription plan. It supports images, videos, html, js, css and more. You can learn more about Google Drive's supported file formats at this link.

Wednesday, 16 January 2013

How To Screen Capture Your Android


So recently i bought a new Android phone, and i was trying to capture above screenshot. It's going to be a very useful tutorial for you. We just need a free software from Google Play. You don't need a rooted for this tutorial. First go and download Screen Capture Shortcut from Google Play. After downloading and installing open the software:

As you can see in above picture, In first option (Capture From Notification) select Yes. Now your software is totally activated and you can capture image any time. So still wondering who to capture?

Now when you want to capture any screenshot just slide your notification bar down:

As you can see in above picture, after clicking on 'Screen Capture Shortcut,' your phone will capture your screen in 0.5 seconds.

You can also change notification type, capture time and all other options in your app. Hope this will work you...Don't forget to leave a comment...

Wednesday, 9 January 2013

Monetize Your Blog With InfoLinks


Lots of peoples are blogging just for money, and they are not getting much success in it because Google Adsense is still not accepting their application or they banned them. If you want to earn some money with your blog with some high-quality ads (Way much better than ClickSor) then you should join InfoLinks.

InfoLinks is world's leader in Text-Links advertising. It's very easy to use, and you earn some good amount with it. It gives you four different types of advertising options (including inText, inTag, inSearch and inFrame), and you choose any of it (maybe all four).

For those of you who are wondering about payment options, you can get your payment via eCheck, Paypal, Wire Transfer and Payoneer pre-paid debit card.

Even if you're using Adsense on your blog, then InfoLinks is also a good way to get more from your blog. In my opinion Adsense + InfoLinks is best way to earn for small and medium publishers. Don't worry....It's 100% safe to use InfoLinks with your Adsense account.

Get Started By Clicking Here.

Optimize Blog Title For Search Results


Your traffic from search depends on your content and post titles. I guess now it's time to give a bit attention to your blog/post title for a better SEO. Sorry for bad editing, i recently formatted my pc, and right now i don't have Photoshop. Let's focus on topic....

It would be better if Title Starts with your Post Title and ends with your Blog Title.I do believe that it will definitely improve your Click Through Rate.

  • Go To Blogger > Template > Edit HTML
  • Find following code in your template:

<title><data:blog.pageTitle/></title>

  • and replace it with:

<!-- Start www.BWidgets.com: Changing the Blogger Title Tag -->
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<title><data:blog.pageTitle/></title>
<b:else/>
<title><data:blog.pageName/><b:if cond='data:blog.pageName'> ~ </b:if><data:blog.title/></title>
</b:if>
<!-- End www.BWidgets.com: Changing the Blogger Title Tag –>

  • Save Your Template......That' IT!!

After saving the template take a look at your blog post pages and your will notice the change in titles in your browser's title bar.

Soon Google bot will re-index your pages with new improved page titles.

Saturday, 5 January 2013

Manually Adding Disqus Comment Box On Blogger


Previously we discussed about adding Disqus comment system to Blogger. Now i'll tell you how to add Disqus comment system manually on your blog.

If the Disqus gadget installer isn't working, you have the option of manually installing the gadget on your Blogger site. This will require editing your Blogger template HTML, so it won't work with Dynamic Views templates.

  • Go To Blogger > Layout > Add A Gadget > HTML/JavaScript
  • Enter Disqus as the title and the following code for the content:

<!-- Disqus comments gadget -->

  • Click save and the window will close....

Now all done in Layout section of your blog, now it's time to move to the Template section.

  • Go to your blog's Template section and then click the "Edit HTML" button > Proceed
  • Click 'Expand Widget Templates' box
  • Search for the widget you just created in your HTML template by pressing Ctrl-F (Command-F on OSX) then typing Disqus. You should find the following line: 

<b:widget id='HTML1' locked='false' title='Disqus' type='HTML'>

  • Below that locate and DELETE the following code right before the closing tag. The section you're deleting should look like this:

<b:includable id='main'>
  <!-- only display title if it's non-empty -->
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='widget-content'>
    <data:content/>
  </div>
  <b:include name='quickedit'/>
</b:includable>

  • Now before the closing </b:widget> tag, add the following Disqus code

<b:includable id='main'>
            <script type='text/javascript'>
                var disqus_shortname = &#39;EXAMPLE&#39;;
                var disqus_blogger_current_url = &quot;<data:blog.canonicalUrl/>&quot;;

                if (!disqus_blogger_current_url.length) {
                    disqus_blogger_current_url = &quot;<data:blog.url/>&quot;;
                }

                var disqus_blogger_homepage_url = &quot;<data:blog.homepageUrl/>&quot;;
                var disqus_blogger_canonical_homepage_url = &quot;<data:blog.canonicalHomepageUrl/>&quot;;
            </script>

            <b:if cond='data:blog.pageType == &quot;item&quot;'>
                <style type='text/css'>
                    #comments {display:none;}
                </style>

                <script type='text/javascript'>
                    (function() {
                        var bloggerjs = document.createElement(&#39;script&#39;);
                        bloggerjs.type = &#39;text/javascript&#39;;
                        bloggerjs.async = true;
                        bloggerjs.src = &#39;http://&#39;+disqus_shortname+&#39;.disqus.com/blogger_item.js&#39;;
                        (document.getElementsByTagName(&#39;head&#39;)[0] || document.getElementsByTagName(&#39;body&#39;)[0]).appendChild(bloggerjs);
                    })();

                </script>
            </b:if>
                <style type='text/css'>
                    .post-comment-link { visibility: hidden; }
                </style>

                <script type='text/javascript'>
                (function() {
                    var bloggerjs = document.createElement(&#39;script&#39;);
                    bloggerjs.type = &#39;text/javascript&#39;;
                    bloggerjs.async = true;
                    bloggerjs.src = &#39;http://&#39;+disqus_shortname+&#39;.disqus.com/blogger_index.js&#39;;
                    (document.getElementsByTagName(&#39;head&#39;)[0] || document.getElementsByTagName(&#39;body&#39;)[0]).appendChild(bloggerjs);
                })();

            </script>
</b:includable>

  • Now change EXAMPLE to your site's shortname.
  • Click Save template. Assuming there are no errors, Disqus should properly show up on your site now.

Popular Posts

 
Powered by Blogger.