App Pages

Page with CMS

Following this tutorial, you'll be able to create new pages and access them from the side menu of your apps.

To do this go to your builder and select the app you want to add the pages.

1. Write down the title you want for your page.

2. This field is for the direction of your page. Spaces, commas, or special symbols are not allowed.

3. Here you select the type of page. Currently, there is only one type of page; we are going to improve this option in further months.

4. Clicking on this you will add a page to your app.

5. Clicking on this clear the previous fields.

6. Clicking on this to edit the content of your page.

7. Clicking on this to remove the page from your app.

templates/app/views/side-menu.html

SEARCH

</ul>
 </ion-content>
 </ion-side-menu>

REPLACE

<a class="item" onclick="window.open('your_page.html', '_blank', 'status=yes, menubar=yes, toolbar=yes,scrollbars=yes,resizable=yes')" ng-class="{arabic_rtl: arabic_rtl}">
 <div class="icon-text">
 <span class="icon ion-heart icon-primary"></span>
 <span>New Page</span>
 </div>
 </a>
 </ul>
 </ion-content>
 <div class="version-app">

And for the Arabic version.

templates/app/views/side-menu.html 

SEARCH

</ul>
 </ion-content>
 </ion-side-menu>

REPLACE

<a class="item" onclick="window.open('your_page.html', '_blank', 'status=yes, menubar=yes, toolbar=yes,scrollbars=yes,resizable=yes')" ng-class="{arabic_rtl: arabic_rtl}">
 <div class="icon-text">
 <span class="icon ion-heart icon-primary"></span>
 <span>New Page</span>
 </div>
 </a>
 </ul>
 </ion-content>
 </ion-side-menu>

To modify the icon you must edit this (ion-heart) with the icon of your preference from https://ionicons.com/v2/

If instead of this you wish to open a browser with an external website in the app, that is also possible, this is useful to load for example forms use this in the search and replace:

templates/app/views/side-menu.html

SEARCH

</ul>
 </ion-content>
 </ion-side-menu>

REPLACE

<a class="item" onclick="window.open('https://www.ordering.co/', '_blank', 'status=yes, menubar=yes, toolbar=yes,scrollbars=yes,resizable=yes')" ng-class="{arabic_rtl: arabic_rtl}">
 <div class="icon-text">
 <span class="icon ion-heart icon-primary"></span>
 <span>New Page</span>
 </div>
 </a>
 </ul>
 </ion-content>
 </ion-side-menu>

This will open something like this

Also, if you do not want to do this annoying task we can do it for you, contact us at sales@ordering.co to get a quote and we will help you with it.