Create A Professional Blog Website Design With These Tips

A website’s design is the very first thing people see in a blog. However, the design is one of the things that is overlooked by bloggers. Although content is the core of any blog, the model also matters as it’ll give a lasting impression to first-time visitors of your site.

More

Mohammad 1/27/2020

How to Know if You’re Hiring a Reputable Web Design Agency?

After the launch of our web development and mobile app development agency, many of you asked us how to know if a web design company can be trusted and what are some of the things that must be kept in mind while hiring a reputable web design agency that may provide high quality service at a competitive price. Did you know there are over one billion websites on the world wide web? While each of these websites has its own design, it goes without saying that some are better than others. A good web design requires a good team of web designers. Today we will discuss in detail five basic advices that  would help you to kick start your online business without worrying about the challenges that come during the web design process.

Just recently several of my friends kick started their online business firms, some of them are located in USA, Australia and UK. I asked one of my friends who recently started Sydney web design agency in Australia and took his advice on how to identify trustworthy web design agencies from those which are unprofessional or untrustworthy. I also asked some of my colleagues in USA who work with different software houses for their precious views and advices. Based on this research I am sharing below five points of experienced and credible advice that will point you towards the right provider.

More

Mohammad 11/28/2016

How to Use LocalStorage in Blogger to Set Cookies?

In our last post we learned the difference between a web cookie and HTML5 Local storage. Now when you are cleared what are the benefits of using HTML5 Local and Session storage methods to store data on a client's browser, lets now learn how to implement these functions to any HTML DOM in Blogspot blogs. This method is not limited to Blogger but can also be used in exact same procedure in Wordpress blogs. Lets learn this interesting new technology with this extremely easy first time guide.

More

Mohammad 12/20/2013

How to Set Cookies In Blogger Using HTML5?

Saving data inside cookies in blogger blogs is probably the most untouched topic because we often avoided talking about internet cookies due to its privacy concerns. There are many cookie plugins available such as this jQuery Plugin by Hartl which monitors and stores user activity. But neither will we use any such plugin nor will we run bulky JavaScript on front end. We will rather use HTML5 LocalStorage, the most efficient new technology that is rapidly embraced by developers across all platforms. Unlike web cookies, LocalStorage doesn't save data as text files on your hard disk, instead it saves them on your browser and only the website which stored data in the browser can access it, that's the most interesting part of it that has vanished possibility of all security threats forever. You can now easily control the display of widgets on your BlogSpot blogs using this method.

More

Mohammad 12/18/2013

Create a Responsive Drop down Menu in Blogger

The task of Designing a responsive blogger template starts with the Header and the most important part of Header is the top navigation menu that provides useful links to your inner pages. Responsive drop down menus are viral now and can be seen widely implemented on all wordpress blogs and even mashable.com. Today we are releasing the first ever tutorial on designing a flexible Drop down navigation menu for BlogSpot blogs without using a single script or image! The best part is that it is not just a flat menu but with a drop down list. This makes our tutorial distinguished from those several codes and plugins proposed by some Geeky friends at Github. Using simply HTML5 <nav> tags and CSS3 :checked selectors, we managed to design a menu that we hope would be useful to the blogger community because it is really an efficient menu that is compatible with all major browsers and uses no Jquery at all!

More

Mohammad 6/15/2013

Launching Service: Vector Face Art

 

Can you recognize this man up here? Yup that's me! ;p Colored in almost just black and white. We are glad to introduce today yet another additional service being offered by STC Network. Apart from the huge list of services we offer like designing icons, logos and web templates, we have stepped into Vector Face Designing. An art that is a mixture of limited flavors of colors that combine to produce a compelling digital image. Whether it be you, your pet or your company's CEO, just submit his photo to us and get him an artistic digital Personality!

More

Mohammad 1/14/2013

Releasing Blogger Notification Bar!

Looks like the new year is near! Out of the premium sets of design resources in our repository, we often share one of them as a freebie when the occasion is precious. There are many creative premium widgets, tools and plugins that we managed to develop this month for our regular clients and out of these I will be sharing just two such resources as a new year gift. They are: (1) Blogger Notification bar widget that you can see live on our blog at the top and (2) a Blogger Template entitled "Salahuddin Ayubi" which is far better than any of the templates we designed so far and makes us really jealous when we compare it to our current design of MBT blog itself!

UPDATE: Blogger Notification Bar with cookies is available now!

More

Mohammad 12/29/2012

Animation using CSS3 KeyFrames and jQuery's scrollTop() function

Jquery is indeed the most compressed and efficient library of JavaScript introduced so far that has made a web developer's job more easy. Its built in functions of show(), hide(), AJAX() and my beloved scrollTop() are indeed the most used functions that gives a new life to user interface (UI). CSS3 animations using @Keyframes rule is one of the most innovative things I came across so far. Pseudo elements such as :before and :after are increasingly being used now because they eliminated the use of unnecessary div tags.

More

Mohammad 12/27/2012

Reposition Navigation Buttons in Blogger!

The navigation buttons or links that are displayed at the bottom of each comment section in BlogSpot blogs enable visitors to switch between new and old posts or move from one post page to another ordered by date and time. These buttons become less of use when number of comments increase too much. Normally readers do not even observe the navigation deep down and this results in loss of precious pageviews. I have always emphasized that value pageviews more than unique visitors because it is indeed pageviews that turns into revenue generating page impressions both for AdSense or any other Ad Network.  You might have seen the More, Next and Previous button showing inside the top black sticky bar on MBT homepage and post pages. It is really not possible to shift a Post data item to any other widget section in blogger. Doing such results in "Data variable not found in dictionary" error or similar.

More

Mohammad 11/27/2012

Create Static HTML Design Of your Blogger Template

This is part 2 of our series "XHTML to HTML" . We have already learned how to turn blogspot's layout into blank HTML page but we have no yet shared how to remove the dynamic XML tags alone leaving behind the stylesheet, scripts and html design. In today's tutorial I will try to share the basic way of understanding a websites core structure by identifying the important div sections that make up the structure. I hope you have followed part one of the series and have downloaded your blogspot template. I also assume you have Dreamweaver or Codelobster installed on your desktop computers or laptops.

More

Mohammad 10/16/2012

Convert Blogger Template into a blank HTML Page

BlogSpot templates are codded using the XHTML 1.0 Strict Document Type. It was developed by world wide web consortium on 26 January 2000. Unlike PHP or ASP.net the rules of XML are strict and unforgiving. A slight mistake in code results in terrifying error messages that you often see while editing your blog template. In order to understand how these templates are designed and programmed. You need to start from scratch. I was planning to release some grid and List view templates but the tough work schedule made it difficult to do so. However I am releasing today a simple code that will turn your test Blog's XML structure into a plain, empty template with no widgets. The entire blogger template consists of widgets that are operated and managed using classes and IDs. The blog posts section itself is a giant widget that can be styled in different ways. To make things simple I will share today how to create a blank HTML Page out of a Blogger Template and then start adding widgets to it to experiment exciting new ways of customizing the blog view.

More

Mohammad 9/08/2012

Colorful Tabs: A JQuery Menu For Blogger

After having published and designed over 100+ Navigation Menus for Blogger, both with horizontal and vertical list view, today we would like to share a beautiful menu that has remained the favorite choice of all MBT clients so far. This menu changes color for each tab on mouse hover. It uses simple JavaScript functions to produce neat and clean transition effects. Instead of displaying the sub menu items in traditional vertical drop down list, we aligned them with one another to fit into a single line. Unlike other menus, this widget would easily fit any BlogSpot template without design conflicts. It is positioned at the top most section of your blog to attract readers the most. The installation steps are fun to try and extremely easy. The Menu works fine on all major browsers i.e: IE7+, Safari, Chrome, Mozilla and Opera.  Lets add it to your blogs and get rid of any existing bulky menu that proved no less than a trouble.

More

Mohammad 9/03/2012

jCarousel Plugin- Scroll Images with jQuery in blogger

jCarousel is a jQuery plugin used widely for controlling list of items (both images, videos or text) in horizontal or vertical order. The items can be scrolled back and forth with animation. The carousel can be used either as image scroller or textscroller. It can be controlled externally with both JavaScript and AJAX and of course php. So it's a smart coded plugin that can be altered with all possible jquery functions. Its created by Jan Sorgalla and you can see several versions of here by visiting Sorgalla' website. To keep things simple we have filtered the code, compressed  it and made it as small as possible. You can easily customize it and install it on your BlogSpot blogs with just a single copy and paste of the code we would share today. You can use the same code to install it on any blogging platform may it be Joomla, wordpress or even a Static HTML website. Lets get to work now:

More

Mohammad 6/25/2012

CodeLobster: The Perfect PHP Development Tool

CodeLobster is a perfect PHP tool for developers who love to code and test. A complete framework with excellent 24/7 Customer service and support. Building PHP Applications was never that easy!

Mohammad Mustafa Ahmedzai on

PHP is one of the most widely used programming scripts. It is the same language that gave birth to Facebook and your beloved Wordpress. Content Management systems and ecommerce websites are built largely with PHP. I really enjoy writing and testing algorithms. PHP is enjoyable as long as you are using the right tool else its all of a headache and tasteless consuming language. While developing my recent university project which was based on "Online Mobile Marketplace " I badly felt the necessity of built-in PHP and JavaScript functions. It is really difficult to code every single function out of scratch unless you use a handy tool to code fast and efficiently. I used various online free PHP editors but their Syntax Highlighting, intellisense and debugger sucked so bad that  I had almost made up my mind to switch to a different project. But then a fellow friend who is a freelance developer suggested that I should try Codelobster PHP Edition.

More

Mohammad 6/22/2012

Expand/Collapse Blogger comment Box with jQuery

Blogger comment form is the only section in blogspot blogs that still irritates users a lot.  After a successful customization of this form last year we now took a step even further to integrate jQuery slideToggle and accordion effect into it. Luckily major browsers now do support JavaScript library so this widget is compatible with all browsers. The tutorial today will help you to create a beautiful expandable and collapsible huge button that will display comment form by sliding down smoothly when triggered and hide it when clicked again. We will be using simple jquery functions to enable a button to  show/hide all div sections that hold the comments box.

More

Mohammad 6/21/2012

Releasing Cheery Sharing Icons - Free!

I had a habit of releasing freebies on special occasions two years ago but due to laziness I neglected its importance. In order to revive that lost habit we are releasing a free icon bundle entitled "Cheery" which is the nickname of  our funny university Chairperson =p. The bundle includes all major social networking icons like the latest Google Plus, Pinterest, Delicious, StumbleUpon, Technorati, Facebook, Twitter, RSS, DIGG  and most importantly an icon for MBT. This set thus includes a total of 10 Free well crafted icons in PNG Format. You can download the icons in original 300 X 300 pixels size. I have not resized them to standards like 16, 32, 48 and 128.

More

Mohammad 6/10/2012

Add jQuery .slideToggle() effect in a Drop Down Menu

Jquery is a beautiful library of JavaScript that has inflated a new life in web technology.  Websites today largely use jQuery to create gadgets and designs that were impossible in past. Unlike CSS3 and HTML5, jquery is supported by all major browsers including IE8+.  The functionality that we will learn today is called Jquery Slide Toggle effect. It enables you to control the speed elements which respond on mouse hover. If you move your mouse towards the drop down menu (at top) on this blog, you will observe that the column drops smoothly and slowly. It first slides down and then expands to its full width. We will use one simple function to introduce this animation in its simplest form. It is .slideToggle(). This animates the drop down list and produces a beautiful effect.

More

Mohammad 6/06/2012

z-index: Send an HTML element to Back or bring to Front

One of the major problems people facing while designing HTML layouts using CSS is the overlapping issue. CSS positioning lets you position an HTML object anywhere you like. You can locate an object anywhere you like but it involves great care. By using the CSS positioning attributes like absolute, fixed or relative you often come across a problem where on object overlaps another or blocks the view of another section. In order to bring one div section on front or back of another you will need to use z-index property of CSS. Just like in Adobe Photoshop CS5, z-index lets you to send an element to back or bring it to front. In todays' tutorial we will aim at explaining this property briefly and with clarity.

More

Mohammad 6/05/2012

Add CSS3 Transition effect To a Drop Down Menu

Ever since The World Wide Web Consortium (W3C) introduced CSS3 and HTML5, websites, content management systems and online web tools  took a whole new shape. Classic and traditional layouts created using tables no more exists and today we play with well developed style properties to better control the positioning of objects. In our previous post we learnt how to add a drop down menu list to a horizontal menu and in earlier posts you learnt in detail how to create menus but today we will play with the structure we created and will add cool ease-in-out effects. Ease-in-out effect is an interesting property that lets you control the display using a timer. This along with some other attributes made animation in CSS3 possible. With ease-in-out we can add soft mouse hover effect to the navigation menus. Whether you may be a Blogger user or Wordpress, todays' post will give a new look and easing touch to your menu.

More

Mohammad 6/02/2012

Create a Drop Down List For any Horizontal Menu

A website's Header section which includes mainly the logo and navigation menu, is the region that attracts a visitor the most. It's the first section of your entire layout that catches reader attention. Therefore with time designers introduced non-traditional versions of drop down menus using Jquery and CSS3. Most of you probably know how to customize a menu but you often find it difficult to add Jquery effects to an existing menu, add CSS3 transitions for rollover effects and especially to turn a simple horizontal menu into a multi-level drop down menu. In order to understand the core basics of a Menu's HTML and CSS structure we will be publishing series of tutorials on this topic to make it extremely easy for most of you to create and design Menus by your own.

More

Mohammad 5/29/2012