September 29, 2011

Create Automatic Tabs Menu From Labels Widget

24 Comments so far

automatic tabs menuYes you heard it right! Thankfully now you can create a tabs menu using blogger's official labels widget. Tab links will be automatically updated and added to your menu whenever you create a new tag/category. This widget is really helpful for those of our readers who wanted an automatic method rather the traditional techy way of drop down menus. I have tried my best to make it worth looking and worth trying. This is again a first time shared post by MBT on automatic Tabs Menu for blogger blogs. Lets see a demo first,

September 28, 2011

Should you Enable Blogger Dynamic Views?

39 Comments so far

Dynamic views

Blogger has now officially introduced Dynamic views for all blogs by default. Now you can change the layout of your custom template into different shapes. A dynamic view is an automated code that rearranges your div areas and automatically changes the default style sheet settings into different flavours and colours. In short it provides your readers with better readability. This new feature helps you to arrange your posts, comment body and sidebar in different orientation. It arranges them into either a stream of thumbnail images or table containing columns of your latest posts. However this new feature has some advantages as well as some drawbacks which I have shared below.

September 27, 2011

Enable Facebook Timeline For your Profile Now!

23 Comments so far

facebook timeline

Facebook new and amazing development just to arrive and this amazing Profile layout change method is called "Timeline" This new feature displays a hierarchy of all your experiences  date-wise like post updates, comments, photo and video uploads.  Timeline is your collection of photos, posts and apps that tell your story. You can see what you did in last year or last month. All Facebook status updates that you made or the fun you had so far can be reviewed by rolling back to the old days using this brilliant new feature. At present this feature can be enabled only through the developers page and will be visible to only those people who have enabled Facebook developers App. However very soon Facebook will publically enable the Profile Timeline for all. So why wait when you can try it now!

September 26, 2011

Create a Simple "Tree Menu" in Blogger

13 Comments so far

Tree MenuEver wondered to create an expandable Tree menu in a simple one step method? There we have it today! A Tree Menu is different from other navigation menus that we have released so far. It has has branches and sub-branches. You can add links to it or even simple text and hang it on your blog sidebar. It helps to organize data in a hierarchal method. Most often we use tree menus for displaying blog archives. It contains a Expand and Contract Link that collapses and shrinks the tree branches. So lets add this beautiful menu to blogger blogs in easiest possible way.

 

Live Demo

 

September 25, 2011

Open Multiple Webpages Using a single Link

19 Comments so far

linking multiple sitesI have been using a simple JavaScript call function to open multiple sites on a single click. This function declares several URL’s in its body and once the function is called either through a hyperlink or an image, the click triggers the function and all URLs declared open up in new browser tab window. I have been using this simple trick on my EntreCard traffic service and you can surely check out that page as a demo. Lets learn how to create such a link.

September 23, 2011

jQuery Gooey Tab Menu For Blogger

31 Comments so far

Gooey menus are simple jquery menus that uses lava lamp effect to create CSS menus. Whenever you move your mouse cursor on a menu item, the gooey moves dynamically as you move right and left. Unlike our previously published drop down menus and tabs menus, this menu has some eye-catching effects which makes them stand out. You can easily customize them and add them with a click of a mouse to your blogspot blogs. I have kept the installation again limited to the use of a single widget so lets get to work then!

image

September 22, 2011

Disable Lightbox View The Correct way

10 Comments so far

Update: Lightbox Effect is Offcially Disabled by Blogger. No Worries now.
Yesterday I shared a short code that somehow helped to deactivate and remove the lightbox view for images appearing on blogger blogs. However some of the technical problems linked with it was that you were asked to paste the code just below the closing body tag and technically speaking that is against W3C standards. This was one reason why some widgets and Adsense ads got effected and did not display correctly. I have found a much better way of dealing with this problem brought by blogger team and it is really easy to implement. So kindly delete the previous code that I earlier shared and follow this new one.

September 21, 2011

How To Disable Lightbox View For Blogger Images?

19 Comments so far

Update: Lightbox Effect is Offcially Disabled by Blogger. No Worries now. Try a more correct way

lightbox view in bloggerBlogger just announced today that they have now automatically added Lightbox view effect to all blogs by default. Now when you click on your images or photos, a wide black I frame window opens that fades the page in the background and shows you the image in foreground without leaving the page. Lightbox is also called as Greybox or thickbox. It is a cool image effect that you have seen widely used everywhere especially on Facebook and Google+. But for some people like me this effect has turned into a headache. Even the read more buttons on my blog when clicked popped in a new window instead of taking the user to the full post page. So of course there must be a way to disable it completely in your blogs and if you wish to apply it with complete control then you may add this effect manually by reading any tutorial found online on Lightbox view.

September 20, 2011

What Exactly are Blog Labels or Categories?

14 Comments so far

what are blog labelsDiscussing this topic has now become really important since I have observed people confusing labels with keywords spam. Blogger blogs or Wordpress blogs, no matter which platform you may be using, provides you with an option of tagging your posts that you publish. Tag, Label or Category they all mean the same and their purpose is to provide easy navigation to a blog reader. You may be writing several posts per week and if you don't organize them by putting them in relevant categories then you are turning your blog into an unorganized site and this makes  the job for your readers more difficult to navigate from one page to another and this badly effects your PageViews. Lets first discuss a general layman definition for this Label term.

September 19, 2011

1000+ Background Patterns For Blogger Comment Box!

27 Comments so far

backgrounds and patternsWhether you like flowers, Christmas, EID, Greenery or Dark and light backgrounds then thankfully now you give any color and look to your blogger comment forms. The code that we previously released can be used to give any background pattern to your comment box you like. Some patterns were created by us and the rest have been taken from other sources. To add a different background pattern of your choice you can then search for it at BackgroundLabs which is an excellent resource for free backgrounds and patterns. You can choose from thousands of different flavours of background categories. The steps of adding them is extremely easy. Lets get to work then!

September 18, 2011

How To add Social Media Links To Blog Feed?

7 Comments so far

feedflareAdding social media links to Feedburner feeds is really important in order to increase the chances of getting more and more social votes. Whether it may be a stumble, Facebook like, a Digg , Save to Delicious or +1, each link has its own importance. Feedburner Feedflare option even lets you add a "Email The author" Link to your Feed posts. Your readers can easily email you after reading your post either on their Feed Reader or Inbox. This interacts a reader more with the author and helps readership grow. Most of my readers often contact me via the same Author link that appears below blog post that I share.  The steps are extremely simple. Kindly do this,

September 17, 2011

Stick Hand Written Signature Below every Blogger Post

8 Comments so far

hand written signatureTechnology has developed enough that you can now convert your hand written signature into a digital one with simple online tools. Mylivesignature is a great tool that lets you create a digital signature for your self. You can change its font size and font color along with font type and signature slope. You can try using the wizard or their free hand tool to sketch your signature in natural way. However I would prefer the wizard tool which helps you by providing several editing options like font color and background color. Click here to create one now!

Blogger Comment Box Black Background Theme

24 Comments so far

blogger comment boxI will be publishing several pattern themes for Blogger Comment form this month. Everything looks good when you present it in a way that may seem appealing. I would accept that BlogSpot blog does not have a good commenting system but you can use the same Comment box and turn it into something creative and far beautiful than the comment forms of WordPress blogs. Customized Blogger Comment boxes was amongst MBT's many innovative shares and today we will take a step further by releasing different color themes by using different patterns of images. Modern CSS3 properties like box shadow and rounded corners will also be applied to the comment body to make it stand out. So lets try our first theme of the month which is named "Black Theme"

September 16, 2011

How To Shift Sidebar Column To Left or right?

13 Comments so far

SHIFT SIDEBARSThis is just a short but extremely useful trick for all those who wish to change the position of their Post body and Sidebar wrapper. Normally most professional layouts have sidebar arranged to the left but E-commerce blogs or other business blogs look good with left sidebar column. In order to keep your blog layout according to standard rules then you may like changing the position of vertical dv segments in your template. If you want to shift your sidebar to left or right or swap sidebar and post body position then you can easily do this using the simple setup guide below.

September 15, 2011

How To Find Sponsors For Your Blog?

24 Comments so far

find advertisersTo answer this question first and foremost ask yourselves why should an advertiser choose your blog? why Should he spend money by advertising his product on your site? What benefits or to be more precise what value does your blog provides to the sponsor? How can you guarantee that his product wont get neglected if he chooses to buy an Ad Spot on your blog? Too many questions but a simple logical answer to all of them and that is provide him with Quality. Read on to understand this logic.

September 14, 2011

7+ Ways To Make a Subscription Box For a Blog

19 Comments so far


subscription boxesA subscription box usually contains a link to your RSS feeds and a Email Form where visitors can submit their Email ID to receive updates from your blog. Blog without a subscription form makes no sense. Subscribers are the backbone of any successful blog. The more readership you have the stronger you get. People subscribe to your Feeds only when you publish quality content. Therefore it is very important that you may try every possible means of increasing the number of subscribers to your blog whether you are a Wordpress user or Blogger user. One basic and most important thing to do is to add a subscription box widget to your blog and position it near the top area of your blog just below header. Always keep subscription box to the top right or left position of your sidebars to attract as many people as possible. A good subscription form with nice icons and Email Text box does always attract people to subscribe. Therefore to help you with your readership we will mention all MBT tutorials publish so far on this topic so that new readers may find it easy to choose the best RSS forms for themselves.

Remove Blogger Sitemap Errors In Google Webmaster

10 Comments so far

Remove sitemap errors

Most tutorial do tell how to submit a blogger sitemap to Google but unfortunately they often fail to mention the correct way. You are still seeing feed proxy errors on your webmaster tool account because Google spiders are getting confused by the sitemap that you submitted. BlogSpot blogs come with Atom Feeds and RSS feeds by default. But since these feed technologies are of low quality therefore we often switch to Feedburner. In blogger Feed settings page we often redirect our default atom feeds to this latest well developed feedburner feeds.

September 13, 2011

What Role Do Google Plus Games Play?

1 Comment so far

google plus gamesZynga, Poker and Sudoku? Heard of them right? Previously on Facebook, and now on Google+ too , that’s right. Have you ever wondered what made Facebook so strong in all these years? What was the key factor? The Games. Gaming applications were the points that led Facebook to popularity. Zynga, social network game developers, were the ones who benefited most from Facebook gaming. According to the statistics, Zynga got 44 million active users daily from Facebook. Here are the statistics from facebook

Google+ API Launch Far From Near

4 Comments so far

develope google plus appWith Google+ emerging as a better social connecting network; application developers (and just the curious student programmers) are eagerly waiting to start with some cool google + app. Of course everyone of us wish to develop and setup a Google+ app but how?

Fortunately or unfortunately, google+ API is not yet available to public. API (Application Programming Interface) can be understood as protocols or rules for building specified software applications. Google+ engineers and programmers are taking their time to develop a stable API before involving thousands if not millions of 3rd party developers with them.

September 12, 2011

My Hotmail Account Was Compromised!

7 Comments so far

hotmail compromisedJust tonight I tried logging into my Hotmail account and to my amazement after having typed my password several times correctly, I was not able to access the account. I tried different browsers, cleared cache and turned off Caps lock too but there was all sweat on my face. At last I gave up hope and agreed to accept the fact that my account was now in wrong hands. But of course I could not sit and watch. I started resetting my password by visiting the Password reset page. The trouble maker did remember to change my secret question but he forgot to change the alternate email address I submitted. Thankfully just the next hour I requested a password reset on my alternate Email address and luck did play so well for me that I could easily reset the password before he could scan my Emails and confidential letters.

Official Blogger app for iOS 3.2+ Released

5 Comments so far

iphone bogging appBlogger team has just released a blogging app for Apple IPhone. Just a month ago they released the Android App for Blogger and now they have developed a new blogging app for iOS which is compatible with versions 3.2 and above. This app can be download for free from App Store. This apps lets you write new posts using your mobile phone. You can write, edit, publish and even save a post as draft. The user interface is in English but all languages are supported. Just like your Blogger editor you can use this app to upload photos from your folder or you can even add instant photos to your posts taken from your iPhone set. You can can add labels and tag locations. However the  HTML mode is not supported. You can only edit the posts using the compose mode.

September 11, 2011

Change Color of "Follow By email" Gadget in Blogger

10 Comments so far

follow by emailYes you can surely change background colour of the Submit button, Text input box, font size and colour of the Submit button of Follow by Email gadget. Blogger recently announced a Follow by email subscription box that helps your readers to subscribe to your daily blog updates. Luckily after offering my fajr prayers an idea clicked my mind as why not personalize this RSS email widget and hence I came up with this post. Today's tutorial makes use of completely overriding Blogger's official stylesheet for the widget and will force-apply styles of our choice. The steps for this widget are extremely easy. Kindly first see a demo,

Notification Bar For BlogSpot With Facebook Like Button

12 Comments so far

notification barMost of you liked the new sticky notification bar which is an important way of seizing visitor attention towards an important headline, news or any update or announcement you may wish to share. Today we will take a step further by adding Facebook like button to the sticky bar. This is a great way of increasing your fans on FB. All visitors will be able to see the bar at the top of your blogger header and it will stay fixed their and would scroll as the user scrolls down. It will always be attracting your visitors to like your blog. Lets first see a demo.

September 10, 2011

Make HTML Table with Background Colors in BlogSpot

5 Comments so far

html table background colorsSo far we learnt how to create HTML tables then we learnt on how to style border colour and border size of tables in blogger, and now we will do the last thing and that is adding background colors to HTML Tables to make it stand out. The steps are extremely simply if you have already read the previous two tutorials. Lets start playing with some more CSS.

September 9, 2011

Change border Color and Size of HTML Tables

5 Comments so far

change border size and color in html tablesAfter having learnt the basics of creating HTML tables in blogspot blogs, its now time to learn how to customize the table cells border colors with more appealing look. We discussed in detail how to create columns and rows in HTML tables, but the problem with those defaults is that their original look comes with dull grey borders and it looks really odd. So we would use CSS to style the borders and cell edges of the table giving it a clean and neat look. If you want to see a demo again then click the link below,

Make Sticky Bar For BlogSpot

34 Comments so far



sticky barYou can add sticky notification bar in blogger blogs by showing the bar either at the top of header or just below the footer. A sticky bar can is now used widely by all blogs and sites(mashable for instance) for notifying visitors of important updates, offers, coupons and latest news. You can even add your RSS link there and ask you visitors to subscribe to your blog. In this tutorial I will try to keep things simply and will share how to create such a sticky bar widget with simple text and image. I have added drop shadow effects to it using CSS3. The widget is compatible with all browsers. View the demo below and on the demo page scroll to the top to see the bar.

September 7, 2011

Make Colorful Tables in BlogSpot

20 Comments so far

blogspot tablesBlogSpot blogs are rich with options that gives you freedom to design and create whatever you want using CSS and HTML. Blogger post editor doesn't has the option of creating HTML tables but no worries we can make tables with rows and columns ourselves and not just dull grey tables, fully customized tables with background colors and smooth and neat edges and borders. This  tutorial will be divided in two parts for simplicity. The first part will give you basics of understanding the structure of tables and the second part will let you customize the tables. After reading both parts you will be able to create MS Excel type style sheets and much more.

UPDATE: Part 2 has been publish: Change Border colour and Border size of HTML Tables

Make a Button Badge For BlogSpot and Wordpress

33 Comments so far

blogspot button makerYou have seen many blogs and directories using a small button for their promotion. You can see one for mbt too. This micro button comes in 80X15 pixels in size. I would create such buttons using Photoshop but amazingly thanks to dynamic drive you can now create a button online easily. The button maker tool provides you with multiple options of making a good looking button or badge for your blogger blogs or wordpress blogs. You can choose border style, background colors, font type and text. This tool is extremely easy to use and no expert tech skills are required to design a button. However I will be sharing some tips which could be helpful for most of you.

September 6, 2011

TechCrunch's End: See How angry Could Bloggers Go!

6 Comments so far

TECHcrunch teamI just arrived home from my hectic university and was shocked to read the biggest blogosphere news ever popping in my Alexa toolbar. It said "TechCrunch as we know may be over" It is the last post published at TechCrunch just 4 hours ago. TechCrunch as we all know  is a network of technology based blogs and other web properties. It was founded in the year 2005 by Michael Arrington and now has around million readers with 15-20 posts published each day by well established bloggers and journalists from across the globe. Its shared news often become Magazine Headlines and we can share a lot more about this blogging giant which is ranked second in Technorati's list of world Top100 blogs

Tell Google What Links To Display In Sitelinks

17 Comments so far

manage sitelinks display

Sitelinks can now easily be controlled and managed via the webmaster dashboard. Sitelinks are links to other pages on your blog or site which appears under the search result for your site. It help users easily navigate deeper into your site. They are generated and ranked algorithmically based on the link structure of your site, and unfortunately not all sites have sitelinks. The number of links appearing below your main homepage link were increased from 8 to 12 but just today I observed that this number has been brought down to six now. I have not heard of any new update though from webmasters blog.

How To Link Like button To Facebook Like Page

30 Comments so far

linking like button to facebook like pageThis tutorial may sound nothing new for those who know the correct way of linking a Facebook like page to your like button but for those who are still thinking how this is done then kindly carry on reading. You may have seen almost every well established blog with a Facebook like button on the homepage but this button doesn't just shares the blog URL on user profile but it automatically likes the Facebook page of the author thereby increasing the number of his Facebook followers. This helps greatly in increasing your social media following and of course traffic to your site. Lets do it,

September 5, 2011

Google Plus Posts are now crawled by Google Robots!

11 Comments so far

I had heard that Google will soon crawl data shared on their newly born Google+ social network in order to bring a new change in their search pattern. Amazingly just today I searched for one of my posts and I was shocked to see that even my Google+ status post appeared in the search results page. This shows how significant role will G+ plus play in days to come. I will highly suggest that you +1'd all your posts and add a Google Plus badge to increase the number of your followers because this new sharing +1 button has a lot to disclose for Search engine Optimization experts and before its too late you must start making good use of it. I had expected this to come after the introduction of +snippets. Please see the screenshots of the SERPs that I observed:

Add Tic-Tac-Toe To a Webpage

12 Comments so far

tic tac toeLet your visitors play Tic-Tac-Toe game on your Blogspot/blogger blogs! We created and played with tons of widgets and plugins now its time to add some spice to your normal work. Engaging readers in an interactive activity like a game will help decreasing down your page bounce rate and will also provide fun to your regular readers or blog visitors. I cam across a simple javascript that uses array to program a simple tictactoe game where a visitor can play with computer bot. The consists of a total four levels with increasing difficulty level. The game uses artificial intelligence to guess important moves to knock a player down. The scores are saved for each level and the total number of wins and draws are recorded for both the computer player and your visitor. I guess this would surely be welcomed by all your visitors. :p

September 4, 2011

Smooth Scrolling "Back To Top" Button for Blogger

72 Comments so far

scrolling back to top buttonFinally yet another exciting trick to create a smooth scroll to top button for BlogSpot blogs. We designed and released many buttons and tutorials on back to top/bottom buttons but they were all static and had no fade out effects and smooth scroll effects. Luckily we just discovered a cool jquery script that does all the work. A back to top button is crucial for a blog or site because visitors enjoy easy site navigation so this button will provide them with this ease. We have kept the installation process a one step process. Please see this button in action towards the bottom right corner of this blog.

Identify Font Type and Font Color on a Website

1 Comment so far

find font typeWhatfont a great chrome extension that lets you easily identify the font family, font size and font color of the text being used on any webpage. It gives you complete details about the type of being used and what other alternative font types are in use of the website. Most often when you visit different sites or blogs, the first thing that attracts you the most if the clarity and neatness of text display. Since people visiting your web blog will be of different age so you must make sure to choose a standard font color, font family that must be compatible with all browsers and of course a good font size. We get inspirations from sites which have brand the internet and therefore to identify what font styles and colors they are using you must try out this great Chrome extension.

September 3, 2011

How To Find width and height of Images on a Webpage?

5 Comments so far

find image dimensionsThere is an excellent browser add-on that I am using since years while designing templates. Its called measureit. It lets you measure the dimensions of images and other webpage elements by telling you the exact width and height attributes in pixels. I often use it to to find width and height ratio of elements on a web page. I just need to draw a ruler across an image, picture or any div section of a webpage to find out its size dimensions. You no more need to take screenshots and then use photoshop to calculate the dimensions. Simply install this cool app on your browsers and start measuring exact dimensions of webpage elements.

Add Rotating Slides Of Popular Posts Widget To Blogger

59 Comments so far

popular posts sliderMy brother Abu-farhan has created an amazing script that transforms the popular posts widget provided by blogger into a a vertical content slider  that updates automatically. His script really impressed me and I thought of sharing this great slideshow widget with all of you. It is extremely easy to install this widget on blogger. You only need to paste the code inside a HTML/Javascript widget. This new script works on all major browsers and can easily be customized. I have further edited the code to give it a little better color theme. No thumbnail images will appear if you have not added any image in your posts. Posts which are viewed most will be picked by blogger stats widget and displayed through this new gadget.

September 2, 2011

How To Give Admin rights In Blogger?

17 Comments so far

blogger-admin-rightsBlogger gives you the option to choose up to 100 blog Authors or contributors and 100 blog readers. Most often while designing blogger templates I need to access my client's Edit HTML section and the only way to have such privileges is to request Admin rights from my client. After receiving Admin rights I get complete control over his posts, widgets, template and entire blog control panel. Administrator rights should be granted only when you full trust over the contributor or your partner else it is equivalent to your blog's post mortem. 

September 1, 2011

Divide Blogger Header In Two Parts or Sections

36 Comments so far

divide-headerA blogger header consists of every single section that appears at the top of your blog. It is a container which contains two important sections which are Logo portion where you add title, logo and description of blog and the second portion includes Navigation Menu where you add site links. Now this tutorial needs a little bit of your careful attention as we will need to edit your template's coding. Since most templates are designed by different sources so the coding will differ a little bit but the format would be same. See the Picture below to know what exactly is header splitting: