Format Pages

Table of contents:

  1. Overview
  2. Formatting copy
  3. Adding contact links
  4. Adding links to external content
  5. Adding internal page links
  6. Adding inline images
  7. Adding map links
  8. Advanced text functionality

 

Formatting Pages Overview

Formatting content pages can be used to create hierarchy amongst headings, organise copy and draw attention to important information.

The Copy field (below) uses a toolbar to simplify the editing process. We’ll step through each icon in the toolbar to examine its function.

 

Formatting Copy

The Copy field (below) uses a toolbar to simplify the editing process. We’ll step through each icon in the toolbar to examine its function.

Tip! Formatting is per line and can only be applied exclusively. For example the text may be bold but not bold italic

To create bold text, place the cursor at the start of the line you would like to make bold and click the above icon. This will insert the characters =b= which tells the app that the following text on that line is to be displayed as bold text.


To itallicize text, place the cursor at the start of the line you would like to make itallic and click the above icon. This will insert the characters =i= which tells the app that the following text on that line is to be displayed as itallic text.


To add a heading to your copy, place the cursor at the start of the line you would like to display as a heading and click one of the above icons. This will insert the characters =1= to =5=. H1 & H5 are the largest, H2 , 3 & 4 are the same size, however 3 & 4 are a light grey, H4 is centered and H5 is in a coloured box.


Clicking the above icon will insert the characters =q= which will display the following text inside a centered and highlighted box. This is intended to give some prominence to a quote or tag line that you wish to add to your page.

Clicking the above icons will either insert the character * which will display the following text in dot point form or insert the characters *#* which will display the text in numerical points. This is intended to list key points of information or to list an order.

To add a break between texts, photos and links, place the cursor at the start of the line you would like to add a line separator and click the above icon. This will insert the characters ---- which tells the app that to make a line within the text to distinguish itself from another piece of text.

  

 

Adding contact links

The Contact link allows you to directly link an email or contact number within the body copy. Clicking on the link opens up either a new email with their email attached or start calling the supplied number.

To add a Contact link, click the phone icon.

Clicking the icon will display the following pop-up window, which will allow you to name the link and also give you the option to make the "Contact Detail Type" either Email or Phone.

Once you have completed all fields in the Contact Link pop-up, click Insert to add the appropriate code to your content page, or click Close to discard all information.

 

Adding links to external content

To create a link to external content hosted outside of your app go to the Content section in the Core. Select the page you wish to add a hyperlink. Once the edit screen is open click the below icon


The following pop-up window will appear, which will allow you to link to a website url, pdf document or video.

The Title field is where you enter the text you would like the link to display. For example enter 'Go to our website'.
Clicking the Icon will display a set of icons (below) from which you can choose the one most appropriate for your link.

The When clicked, the link will field has options for what and how your external link will display.

The URL field needs the full internet address of your file, video or webpage. You can easily obtain this by visiting the appropriate link in your browser and then copy and paste from the browser URL bar to the URL field. For example: http://www.ourcompanysite.com

If you are adding a link to a YouTube video this will normally load from your app into the YouTube app, if installed on the mobile device, otherwise it will load in the user’s browser. The URL needs to include the full information pointing to the video (the v= and following code) but does not need any other code that may follow an & symbol. For example https://www.youtube.com/watch?v=ahEsDHKkD3M.

When linking to a self hosted video you must include the URL path down to the file level. Videos will play within the app’s embedded player. Supported file formats include .mp4 and .mov. Playback will depend on what the user’s device supports. An example URL is http://www.entegy.com.au/appcontent/videos/samplevideo.mp4

 

 

Adding internal page links

Internal page links allow you to directly link to other pages within the app from within the body copy.

Internal page links can be styled - this determines how the link will look - Please note not all page types support each of the Display Styles available.   Eg: Heading/Subheading display style is only for linking to a page housed within a container page.

To add an internal link this click the paperclip icon.


Clicking the icon will display the following pop-up window, which will allow you to link to one of your other app pages from the page content on this page.

When you click on the first field (as shown below) a list of options will appear in a drop down selector. These options will determine how the link displays on your App page. The selections include options for displaying the title and some text of the linked page with or without images and/or icons. Test out the various settings to see which best suits your link.

The Title field is where you enter the text you would like the link to display. For example enter View the program.

Clicking the Icon will display a set of icons (below) from which you can choose the one most appropriate for your link.

Clicking the Linked Template Id will display a pop up from which you can choose the alternate App page you wish to link to. Initially you will see a choice of Content or Features. Click Expand to view more options. Content allows you to select another content page, Features gives access to the special features pages within the app. Which Features you are able to link to will depend upon the set up of your App and what has been enabled.

Once you have completed all fields in the Internal Link pop-up, click Insert to add the appropriate code to your content page, or click Close to discard all information.

 

Adding inline images


Clicking the above icon will display the following pop-up window, which will allow you to insert an image in the page content.

The image popup presents you with new options relating to the display of the image in your page;
Align Type – The choices are Left, Centre, Right, Padding Left, Padding Right or Padding Both. This will determine where the image sits across the page and whether white-space padding is to be added.
Width Percentage – The choices are 25%, 50%, 75% or 100%. Setting this option determines how much of the width of the app page the image will take up.
To choose an image from your computer, click the browse button and use the standard file browser to select the appropriate image. Once selected, click the upload button to copy the image file to the server so that it is available to all users of the App. Once uploaded a line of code will be inserted into your copy similar to ‘~img~1.407514~0.25~2~db34406b-d71d-40c3-8bc9-0c70f292z477.jpg’.

Before uploading images, it’s a good idea to reduce them to an appropriate size to optimize loading time (maximum width required is 720 pixels).

 

 

Adding map links

The Map link allows you to directly link to a set location within the body copy.

To add a Map link, click the pin drop icon.

Clicking the icon will display the following pop-up window, which will allow you to name the map and also give you the option to show users directions to the point or just show where the point is.

 

To find a location, simply type in the address and then click "Locate Address". The panel will then drop a pin point on the location. Once you have completed all fields in the Map Link pop-up, click Insert to add the appropriate code to your content page, or click Close to discard all information.

 

Advanced text functionality

Several advanced text options exist within the Core which allow you to format text beyond the controls in the toolbar. These can be entered by using the following shortcodes at the start of each line.

Advanced bullet point

*X* - The x character becomes the symbol of the bullet point. For example

                *1*Text here becomes 1 Text here

More than 10 bullet points

*#*  - For more than 10 bullet points