Tuesday, March 19, 2024

A Review of the Web-Service: Mofuse

2/25/13

Mofuse allows you to build mobile versions of your website. They offer several options:

  • To build the site yourself
  • To allow them to do it
  • Become a reseller of their services.

Note that in the screen shot above, you receive a free trial and, depending on your audience, there are several different price points. Note also, that the price varies by the elements(building blocks – RSS feeds, weather widgets, content pages, etc.) on your pages and the number of visitors. As an example, the JumpStart package is based on 1,500 page views/month, 10 elements and is $7.95/month. In contrast, at the high-end, the Ultimate package gives you 1,500,000 page views/month, unlimited elements and costs $199.00/month.

To get started, you’ll need to create an account. This is where I fully expected to be asked for a credit card, only to discover that none was necessary. You have a 14 day period to test drive the service. If you cancel before that time period is up, you won’t be billed for the service.

After registering you’ll receive email confirmation and then you’ll arrive at the page above.

After you log in, you’re taken to the page above, where you’re given more info about your free trial (14 days left), a note about adding a credit card, product news, information about a video tutorial and a button at the bottom to launch a new mobile site. Billing information, QR code info, coupons and account settings are on the left side of this page.

I took a time out to watch the introductory video, then clicked on the green Launch a New Site button at the bottom of the page.

This took me to the page above, where you can enter a description, set the URL of your site, upload a logo, duplicate a site and finally, launch the site. When uploading a logo, it’s recommended that the logo be no more than 325 pixels wide, or it could be cropped by the software. After you fill in the settings, click on the Launch Mobile Site button at the bottom of the page.

This takes you to the Mobile Site Menu, where it’s time to add elements, which act as the bulding blocks of our site. To begin, click on the Add Elements icon.  

This takes you to the Add New Elements page. Of these, the most commonly used elements are the Page Title, the Content element and the Content Block element. For the purposes of this article, I’ll add all these elements to the site. We’ll look at each of these in turn.

• Page Title: Allows you to add a clickable page title to the mobile site

• Create a Static Content Page: This allows you to create a new content page. The title of the page will appear as a clickable title bar which you’ll open to view the content. If you want just content without having to click on a title bar, you’ll need to use the content block element. If your text contains a lot of formatting, it’s recommended you remove that then copy it into the content section and edit it there. Alternatively, if your code is formatted with HTML, you can copy that over when you activate the source tab. If you have images that update regularly from your site, you can do that, as well. Click on the Add button at the bottom of this section to add the content to your site.

• Create a Content Block: This is where you add content to the mobile site. In this case you add a label, then the rest of the options above apply. One other option is to allow you to display this content on only one page or at the top of every page on the site. Click on the Add button at the bottom of this section to add the content to your site.

Next, scroll to the top of this section. You’ll notice several icons on the top right, which control various aspects of your layout. Of these, we’ll look at the Your Site Layout tool.

This section is where you add elements to your mobile site layout. To do so, click on the green arrow on each element on the Unused Elements section. Note that you can easily remove elements from the layout using the red arrows.

Once all the elements have been moved over, click on an element to drag it to a new position in the stack. To nest one element under another, simply move it to the right under the element above it. Note the pencil icon. This allows you to edit the CSS.

After that, you can access the other buttons to change the look and feel of the mobile site, the colors, add forms, monetize the site and more. To see what the layout looks like at any time click on the mobile preview icon. This will bring up a preview of the mobile site.

As you build the mobile site you’ll see a checklist on the left which will guide you in the creation process and keep you on track. Note that with Mofuse, you can create a redirect code which you’ll use on the main website within the <head> tags. This code will recognize when a user comes to the desktop site from a mobile device and will redirect them to the mobile website.

Conclusion

There are a number of other instructional videos that you can watch to get you up to speed. Overall, I like the look and feel of this program/service, which is a bit reminiscent of GoMobi. I recommend that you check out Mofuse and give it a test drive. I think you’ll enjoy the experience.

Get the Free Newsletter!

Subscribe to Developer Insider for top news, trends & analysis

Popular Articles

Featured