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>
<div class="version-app">
REPLACE
<a class="item" onclick="window.open('URL', '_blank', 'status=yes, menubar=yes, toolbar=yes,scrollbars=yes,resizable=yes')" ng-class="{arabic_rtl: arabic_rtl}">
<divclass="icon-text">
<span class="icon ion-heart icon-primary"></span>
<span>New Page</span>
</div>
</a>
</ul>
</ion-content>
<div class="version-app">
To add more than one page, e.g. two pages, check this code.
<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}">
<divclass="icon-text">
<span class="icon ion-heart icon-primary"></span>
<span>New Page</span>
</div>
</a>
<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}">
<divclass="icon-text">
<span class="icon ion-heart icon-primary"></span>
<span>Second New Page</span>
</div>
</a>
</ul>
</ion-content>
</ion-side-menu>
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}">
<divclass="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/
New Page Ordering app
Show another page from the web
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>
<div class="version-app">
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>
<div class="version-app">
This will open something like this
New Page Delivery app
Show another page from the web
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/menu.html |
SEARCH
REPLACE
<div class="item menu-list-item">
<div class="icon-text icon-order">
<i class="icon ion-locked"></i>
<a style="color:grey;" onclick="window.open('https://www.ordering.co', '_blank', 'status=yes, menubar=yes, toolbar=yes,scrollbars=yes,resizable=yes')"><span>New Page</span></a>
</div>
</div>
<div class="item menu-list-item" ng-click="signout()">
This will open something like this
New page Business app
Show another page from the web
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/menu.html
SEARCH
<md-list-item class="menu-list-item" ng-click="navigateTo('login')">
REPLACE
<md-list-item class="menu-list-item">
<div class="md-list-item-inner">
<i class="icon ion-locked"></i>
<a onclick="window.open('https://www.ordering.co', '_blank', 'status=yes, menubar=yes, toolbar=yes,scrollbars=yes,resizable=yes')"><span>New Page</span></a>
</div>
</md-list-item>
<md-list-item class="menu-list-item" ng-click="navigateTo('login')">
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.
Have a Happy Ordering
Comments
0 comments
Please sign in to leave a comment.