GRIDS. THE MOST POPULAR WIDGETS ON MOBLE

MOBLE CMS has a range of configurable widgets out of the box that you can use to create feeds of content.

There are certain widgets that are used prominently right across the web, so it's important that you know how these work to realise the power of your new website.

WIDGET TYPES

As you have seen in the video above, widgets provide a powerful mechanism to categorise content, bring it to life with visual effects, and manage large volumes of content quickly. It really is worth spending a bit more time getting to know your widgets, and MOBLE comes loaded with a series of widgets right out of the box. 

MOBLE also gives you the ability to modify each widget to specifically suit your content. There is no limit to the number of times you can use a widget, and you can even modify each widget so that it renders differently per instance, even with multiple widgets on one page.

Below, we take a closer look at the different Types of Widget that are included on MOBLE CMS, out of the box.

GRID WIDGET

_{USED FOR: NEWS | BLOGS | SERVICES | PRODUCTS | CATEGORIES | EVENTS | TOPICS}

Grid Widgets are used to display a grid of either Pages or Files (files are images, Documents, Audio & Video).

Therefore, Grid Widgets are an incredibly useful way to organise your content into groups that can be presented to your users.

The intention of a Grid Widget is to link your users from the widget to a group of associated pages. Here we look at how the Grid Widgets behave when linked to different types of content:

• Grid of Pages:
  Displays the 'Page Icon', also known as a thumbnail. 
  When you click on the thumbnail you are linked to a new page.
  
  
• Grid of Images:
  Displays the image 'File Icon', also known as a thumbnail. 
  When you click on the File Icon it pops up the image in a Lightbox gallery.
  
  The Destination URL of the image can be updated in the Files area. If you add a Destination URL to your image instead of the image opening up as a Lightbox Gallery, it will instead link to that page. This makes a Grid of Images an extremely useful Widget, for example, if you would like to link away to other websites, such as a logo bank of your clients or partners that links to their website.
  
  
  • PRO TIP: When adding your destination URL for the image (in the Files area), if you add the full URL with 'http://www' at the start, it will automatically open as a new window.
    
    
• Grid of Documents, Audio or Video:
  Displays the document 'File Icon', also known as a thumbnail.
  When you click the File Icon it opens the file in a new window.
  
  The File Icon can be edited in the Files area. When you upload the file, if you do not add a File Icon, an Icon indicating the file type will automatically display for you.
  
  Example File Icons:

A NOTE ON WIDGET SUMMARY TEXT

As you can see in the example Widgets above, the Grid View will display the widget 'Summary' text on top of the Image Icon.

The size of the Image Icon will change depending on the screen width of the device. The Summary text will automatically crop off depending on the dimensions of the Image Icon on that device. It will automatically place an ellipsis (...) at the close of the text.

If you find that your Summary is too long to fit inside your image, you may consider either shortening the summary or perhaps using a Card View. Card View will always display 140 Characters, irrespective of the number of columns or the size of the device.

WIDGET CONFIGURATIONS

You can configure each Widget with exactly what you wish to display in your feed, simply by using the "Configure Your Widget" settings as shown in the image below.

As you are no doubt already aware, the Page Settings and File Settings area is where you manage the content for each item. E.g. the Summary, Price, Date, etc. is managed in the Page Settings area for each page.