Tutorial Mobile Device Customization Procedures

Tutorial Mobile Device Customization Procedures

The images below show how the Home page looks on all our devices - desktop, tablet and mobile - after we have made Basic customization changes to the template.

In reviewing the Home page images, below, we see additional changes that should be made to the Home page for Tablet and Mobile Devices to make them appear more professional.

See Mobile Device Customization Options for additional information

 

Desktop Display of Home Page

Mobile Device Customization Procedures

 

Tablet display of Home Page with Basic template changes for Tablet devices applied.

Mobile Display of Home Page, with Basic Templae Changes for Mobile devices applied

Customization Procedure

mobile_device_menu.fw

  • Select the web page you want to customize.
  • Select the Tablet Version from drop down menu.

menu_9.fw

  • In the Tablet & Mobile basic verison of our example, the Welcome to Pet Buddy appears three times. 
  • We only want to display it once on mobile devices.

custom_4.fw

  • Place cursor on text field.
  • If field is outlined in green it can be changed here.  If outlined in orange, it is part of the template and change must be made to template.
  • In Palette, uncheck Tablet and Mobile Devices.

custom_1.fw

custom_2.fw

Alternate Method:

  • When field is selected, the Edit command appears. Selecting the X will Hide the Element.  The Up and Down arrows move the field up or down.

custom_3.fw

  • Save and Publish your changes.
  • Display will now only show one Welcome to Pet Buddy in Tablet and Mobile display, but remain the same in Desktop display. 
  • Always check both Tablet and Mobile displays to be sure they are displaying correctly.