Welcome to THE BOOK
Build FREE Apps Android, iPhone & Web Apps with CreaTusApps The #1 World´s Most Powerfull Easy-to-use Mobile App Builder
DESIGN-BUILD-PUBLISH iPhone, iPad, Android, KindleFire. Monetize Your OWN APPS!
Thanks to CreaTusApps you can create Apps completely for FREE Paying Nothing Every time people click on your ads, you will make money 100 App Templates & 100 Features Create an App in Minutes! BUILDING BLOCKS FOR MOBILE APPS No programming Required. Lowest Price Money Back Guarantee In-App Purchases Push Notifications. https://CreaTusApps.net
Getting Started...
1.1 How to sign up for a subscription plan? 1.2 How to edit an Application 1.3 How style.css works. Apps Template improvements 1.4 How to publish your app on the App Store 1.5 How to publish your app on Google Play Store 1.6 How to update your app? 1.7 Automatic Build – How to request it? 1.8 How to use Apple Application Loader?
Features Tutorials
2.1 How to position a page type on the tab navigation? 2.2 How to duplicate an existing app? 2.3 How to convert an iPhone app to iPad app? 2.4 How to choose the app target? 2.5 How to see the app Statistics? 2.6 How to use Dynamic HTML? 2.7 CreaTusApps Custom URL Schemes 2.8 How to use Embed Application Code? 2.9 Enabling Your App for Newsstand 2.10 Prompt users to rate your app 2.11 How to enable and use resource synchronization? 2.12 Creating, Editing and Publishing a WebApp 2.13 What are Google Play Store expansion files?
Functions
3.2 AppShare 3.4 Barcode Scanner 3.6 Button Menu 3.8 Calendar 3.10 Maps 3.12 Menu 3.14 EPUB Reader
3.1 Announcements 3.3 Audio Stream 3.5 BMI Calculator 3.7 Calculator 3.9 Camera Cover 3.11 Login 3.13 EPUB 3.13 Coupon
App Templates Tutorials 4.1 Book Store 4.2 Mobile Shop 4.3 Coffee-shops
Technical Tutorials
5.1 How to create a Distribution Certificate? 5.2 How to create a Distribution Provisioning Profile (.mobileprovision)? 5.3 Generate APN Certificate to Enable Push Notifications
1.2 How to edit an Application creatusapps.net/blog/how-to-edit-an-application/
By Javier After you chose a template to create an app, a new project will be displayed in the list of your Applications on CreaTusApps.net. Editing an app comprises uploading content, implementing required functionalities by including respective type pages, adjusting appearance of app.
To start editing your app click on your App's Dashboard.
From Ap Dashboard you can access the following sections:
1/10
Edit Application's Pages section In this section you can view (in the web simulator) and manage (add/remove/duplicate/rename) the pages of your app. Also, the Resource Manager can be accessed from here.
2/10
To add a new page click on the "+" button. In CreaTusApps's Marketplace you may find a page type for your application by categories (Page Type categories, Platforms, Authors)
3/10
You may use the search engine to find the page you are looking by entering its name.
4/10
To edit a new added page click on Edit. Each page type has its specific controls and fields to customize page elements. Please verify the tutorials for every particular page type. Generally, pages can be customized in Layout, Design mode and HTML mode.
In Design mode, HTML based pages can be edited using the tools of the WYSIWYG editor. In HTML mode it is possible to edit directly the HTML/CSS, JavaScript or jQuery code.
5/10
The functions of each tool are described in the FAQ page
Resource Manager Using the Resource Manager you can upload all the graphics, media files, pages, etc that will be used in your app. More information about the Resource Manager find in the following tutorial.
Design Properties section From here it is possible to set the default background image or color, text/link color, etc. Style classes that affect the appearance of page elements throughout the app are stored in the style.css file.
6/10
To edit style.css click on the link. When a new page is added its style classes are included in style.css It is possible to create new classes and edit the existent ones.
7/10
Navigation Settings You may select the type of Tabs (No Tabs, Standard Tabs, Custom Tabs, Wheel) and edit each style in Navigation Settings. You may change the tab name, icon, background or text color.
Edit Localizable Strings
8/10
It is possible to have the text words and keys in your app displayed in any language. Simply, input your translation. For that go to App Settings – > Localization to start editing localizable strings. Note, all the changes should be done manually. To input your translation for an iOS application you have to insert words instead from the right side.
For Android you will have to select a string and change the "Value". Changing the value, will change the text you want to display in the app.
9/10
© 2016 Copyright | Tecstar Group
10/10
1.3 How style.css works. Apps Template improvements. creatusapps.net/blog/how-style-css-works-apps-template-improvements/
By CreaTusApps CreaTusApps made some essential page and template improvements. There are significant modifications in style.css. All templates have been modified to support Landscape / Portrait mode. All pages in all templates will use flexible HTML/CSS to align center in both modes (Portrait and Landscape) To make page modifications easier you need to know the connection between a page and a CSS class.
On CreaTusApps each page has several corresponding CSS classes. To detect them, please go in your application Dashboard-> Design Properties->Edit" style.css" Ex. If you have created Grid MENU page type, in your style.css classes with prefix gridmenu will be inserted (ex. .gridmenuimagecontainer). for Button MENU page type in style.css will be inserted classes with buttonmenu prefix (ex. buttonmenuitemcontainer)
These classes will be inserted in style.css when you create a new page or when you convert an existing page to a specified page type. These injected classes affect only the pages of specified type. style.css classes has been modified to support landscape/portrait mode. Let's take for example Grid MENU page type. If you already created a Grid MENU page type in your app, it will not support landscape mode. Why? Because your classes related to a page have been already injected before. You need to replace these classes with new classes. To repair this issue please follow these steps: 1.1 Go in your app Dashboard->Design Properties>Edit"style.css" 1.2 Find /*gridmenucssaddition*/ comment and delete all classes starting with gridmenu prefix including /*gridmenucssaddition*/ comment. 1.3 Go to your app Dashboard->Edit Pages 1.4 Create a new Grid MENU page, in your style.css will be inserted new gridmenu CSS classes.
1/2
1.5 Verify on your device the old Grid menu page, it should work like a new page supporting landscape mode, because it uses the new CSS classes. 1.6 Delete from your pages the last new Grid MENU page created.
!!! The second option may result in loss of page information. 2.1 Go to your app Dashboard->Edit Pages 2.2 Click on your existing Grid MENU page and convert it to Grid MENU page type. If you do not have /*gridmenucssaddition*/ in your file style.css, corresponding classes will be inserted in style.css when you convert your page to Grid MENU page type. If you have /*gridmenucssaddition*/ please follow steps 1.1 – 1.6
© 2016 Copyright | Tecstar Group
2/2
1.4 How to publish your app on the App Store creatusapps.net/blog/how-to-publish-your-app-on-the-app-store/
By CreaTusApps
How to submit an iOS APP. Step by step instructions.
Ready to submit app to App Store?
Step 1. Click on "Ready to Publish or Publish" button.
1/11
Step 2. Start Submission Process.
Step 3. Select Build and Publication Type.
2/11
3.1 Instant Build — in under 1 hour 24 / 7 you will receive an email with a link to a build of your app for you to publish. (You need a Mac and Application Loader to upload it to AppStore). Instant builds are FREE and UNLIMITED for all our customers. If you choose this option next steps are: 4 → 6 (6.2.1) → 7 → 8
3.2 Build & Review — in under 2 business days you will receive a link to a build of your app or review notes in case your additional input is required. (You need a Mac and Application Loader to upload it to AppStore). 1 Build & Review = 1 Build Credit. If you choose this option next steps are: 4 → 6 (6.2.1) → 7 → 8
3.3 Build & Publish under my account — in under 2 business days your app will be published under your developer account or you will receive review notes in case additional input is required. Review and Submission to App Store is done by one of ours build engineers. 1 Build & Publish = 1 Build Credit.
3.3.1 Please specify your primary iTunesConnect account credentials. We will use your credentials to login to iTunesConnect and upload your application binaries.
3/11
NOTE: You need to enter your primary iTunes account here. We will use your account credentials to login to developer.apple.com, generate a certificate and a provisioning profile for this app. You need to provide an account with full access to developer.apple.com. If you choose this option next steps are: 5 → 6 → 7 → 8
3.4 Publish Under DevForApps' Account — in under 2 business days your app will be published under our developer account or you will receive review notes in case additional input is required. 1 Publish Under CreaTusApps' Account = 1 Build Credit.
NOTE: Please make sure your app corresponds to the following requirements before proceeding: Provides high usability to the end user Is rich in content, informative and instructive Contains offline multimedia content such as audio or video Contains interactive native pages Has a professional look and feel and an original design Is not designed to promote a brand name we don't own Contains no copyrighted material without the express permission of the copyright holder Can not be classified as posing a potential copyright issue Is published for FREE distribution
If any of these requirements are not met, CreaTusApps will NOT submit the app under its company account and will require you to enroll in Apple's iOS program at http://developer.apple.com/programs/ios IMPORTANT: If your application promotes a brand name or a registered trademark you are required to have your own development account with Apple.
4/11
If you choose this option next steps are: 5 → 6 → 7 → 8
3.5 Instant Ad Hoc — in under 1 hour 24 / 7 you will receive an email with a link to a build of your app for you to test. Instant Ad Hoc builds are FREE and UNLIMITED for all our customers. If you choose this option next steps are: 4 → 6 (6.2.1) → 7 → 8
Step 4. Upload the Code Sign Files.
4.1 Upload your Distribution Certificate – Create a Certificate and upload it here.
4.2 Upload the .mobileprovision file for this app – Create a Profile and upload it here.
4.3 OPTIONAL Private Key in .p12 format – You must upload your private key ONLY if you generated your own CSR when requesting a distribution certificate. If you followed our instructions for creating a distribution certificate and used our CSR file in the process you don't have to upload the private key.
Missing certificate
5/11
Certificate successfully uploaded
Step 5. App Store Properties – Fill in all the information regarding App Name, Keywords, Description, Category and the app icon for the App Store.
6/11
5.1 App Store App Name – The App name as it will appear on the App Store. Maximum 50 characters.
5.2 Description – A detailed description of the app version itself, no longer than 4000 characters and no less than 10 characters.
5.3 What's New in this Version (optional) – Add here a short description of what you've improved in your app. Leave this field empty if is the first time when you're submitting the app to App Store.
5.3 Keywords – One or more keywords that describe your app. Keywords are used to help customers search the App Store effectively. Your application will be searchable by application name, company name, and keywords.
5.5 Primary Category – a category that describes your application best, and is the category under which your application will be listed.
5.6 Secondary Category (optional) – The Secondary Category provides an additional search term which may help users find your application, though your app won't be listed under the secondary category. Choose from the same list as the primary category. You cannot choose the same category for both your Primary and Secondary categories.
5.7 Privacy Policy URL (optional) – A URL that links to your company's privacy policy. Privacy policies are recommended for all apps collecting user or device related data, and required for apps that offer auto-renewable or free subscriptions, are designed for kids, or as otherwise required by law.
5.8 Review Notes for CreaTusApps team ( optional) – Additional information about your app that can help during the review and submission process. Include information that may be needed to submit your app to App Store.
5.9 Contact Information – Please add here your (or your client) contact information. If Apple Reviewer will have questions regarding your app he'll call you.
7/11
5.10 Demo Account Information ( optional) – In order to prevent a rejection from Apple Review Team, we need to set a test account (a test login and password) on iTunesConnect if you have a Login form in your app.
5.11 Support URL – A URL that provides support for the app you are adding. This will be visible to customers on the App Store.
Step 6. Push Notifications.
Specify if you want Push Notifications enabled/disabled for your application.
6.1 I want Push Notifications disabled
6.2 I want Push Notifications enabled
Step 7. App Multimedia – Upload App Graphics. Application icons and Splash Screen images.
8/11
The Application icon is the image used for the app's icon, as displayed on the iPhone's home screen. All icons should be .png files without any transparency. Apple recommend that you create images without rounded corners, as Apple will round off the corners themselves. The Splash Screen image (launch image) is the image displayed while your app is loading. All launch images should be in the png format, without transparency. Please provide icon and splash screen files with the following sizes:
iPhone & iPod Touch apps Application icon: 57×57, 114×114, 120×120 px. Splash Screen images: 320×480, 640×960, 640×1136 px.
iPad & iPad Mini apps Application icon: 72×72, 76×76, 144×144, 152×152 px. Splash Screen images: 768×1024, 1536×2048 px.
Step 8. Build Version, Application Name, Resource Synchronization, App Rotation, Background Mode. 9/11
8.1 Build Version (a.k.a. Bundle Version) – The version of your app. It is a number in the format X.Y or X.Y.Z, for example 1.0 OR 1.0.0. When you first publish your app, you should generally use the default value, 1.0 . If you are building a new version of an app that is already on the app store Build Version MUST change. e.g. 1.0 -> 1.1 -> 1.2 …
8.2 Application name is displayed under application icon on the device. Must be a short name to fit icon width.
8.3 Resource Synchronization – Once your application is Ready For Sale in the App Store you will have possibility to synchronize resources (images, sounds, html files, etc.) with app without releasing a new app version.
8.3.1 Sync Button allows manual synchronization of app resources.
8.4 Info Button shows app information such as author name, username and service provider.
8.5 App Rotation – Enable/ Disable App's Rotation. (Portrait > Landscape > Portrait)
8.6 Background Mode – The application plays audible content in the background. Your application may only use background mode for their intended purposes: audio playback, etc. If your app uses a background mode but does not include functionality that requires that mode to run persistently – your application will be rejected by Apple reviewers.
8.7 Shine effect – iOS will add standard gloss effect to your application icon
10/11
Done. Submission Complete! © 2016 Copyright | Tecstar Group
11/11
1.5 How to publish your app on Google Play Store creatusapps.net/blog/how-to-publish-your-app-on-google-play-store/
By CreaTusApps
How to submit an Android APP. Step by step instruction. Ready to submit an app to Google Play Store?
Step 1. Click on "Ready to Publish" button
Step 2. Start Submission Process
1/9
Step 3. Select Build Type
3.1 Instant Build — in under 1 hour 24 / 7 you will receive an email with a link to a build of your app for you to publish. Instant builds are FREE and UNLIMITED for all our customers. If you choose this option next steps are: 5 → 6 → 7 → 8
3.2 Build & Publish — in under 2 business days you will receive a link to a build of your app or review notes in case your additional input is required. 1 Build & Publish = 1 Build Credit.
2/9
If you choose this option next steps are:
5→6→7→8
*Step 4. Google Play Store Properties
4.1 App Title – The name of your application as you would like it to appear in Google Play. Maximum 30 characters. Perhaps the most important field is the title. So try to get relevant keywords into this field.
4.2 Short Description – The first text users see when looking at your app's detail page on the Play Store app. It is 80 character limit and users can expand this text to view your app’s full description.
4.3 Full Description – The visible description of your application in Google Play. There is a 4000 character limit for this field. Note: Repetitive and/or irrelevant use of keywords in the app title, description or promotional description creates a spammy user experience and can result in an app suspension.
4.4 Application Type – Google Play is divided into 2 major application types: "Applications" and "Games". Choose one of them.
3/9
4.5 Application Category – a category that describes your application best, and is the category under which your application will be listed.
4.6 Promotional Video – The URL to a YouTube video showcasing your app. (Optional)
4.7 High-Resolution Application Icon – Should be a higher-fidelity, higher-resolution version of your application's launcher icon. Requirements: 512x512px, 32 bit PNG or JPEG, maximum file size 1024KB.
4.8 Feature Graphic: 1024x500px, 24 bit PNG or JPEG (no alpha, no border)
4.9 Promo Graphic: 180x120px, 24 bit PNG or JPEG (no alpha, no border) ( Optional)
*NOTE: Please be informed that the Google Play Store doesn't have anything like keywords, because features like that get abused to manipulate rankings. Also stuffing keywords in your description is against the Google Play Developer Program Policy and can result in your App being removed from Google Play or your whole account being suspended.
Step 5. App Multimedia
5.1 Application Icon (a.k.a. Launcher Icon) – Is a graphic that represents your application and appear on the user’s Home screen.
4/9
Application Icons are used primarily to: Promote the brand Help users discover the app on Google Play Store Function well in the Launcher
Android runs on a variety of devices that offer different screen sizes and densities. So, to support multiple devices you should create and upload separate icons for all screen densities, including: low 120dpi 36x36px medium 160dpi 48x48px high 240dpi 72x72px extra-high-density 320dpi 96x96px extra-extra-high-density 480dpi 144x144px
5.2 Splash Screen Image– The splash screen is a full screen image which appears while application is loading. 320x480px to 720x1280px PNG or JPEG . Width: min 320px. max 720px. Height: min 480px. max 1280px.
Step 6. Enable Google Cloud Messaging
5/9
Google Cloud Messaging (a.k.a. Push Notifications): is a push notification service that allows you send notifications from CreaTusApps server to your customers.
6.1 I want Push Notifications disabled 6.2 I want Push Notifications enabled 6.3 No Google Play Services – We have implemented an additional Push Notifications system which will work on Android and Kindle Fire devices that do not support Google Play Services (example: devices from China or Iran)
Step 7. Android Permissions
These permissions are ENABLED by default to ensure that all the features and page types work properly. You can disable some of these permissions at your own risk. If you are not sure what are Android permissions or how they can affect your application, please leave all these permissions enabled.
6/9
7.1 Full Internet access (android.permission.INTERNET) – Allows the app to create network sockets and send/receive data to/from the Internet.
7.2 Approximate (network-based) location (android.permission.ACCESS_COARSE_LOCATION) – Allows the app to access approximate location from location providers using network sources such as cell tower and Wi-Fi.
7.3 Precise (GPS) location (android.permission.ACCESS_FINE_LOCATION) – Allows the app to access precise location sources such as Global Positioning System on the device.
7.4 Modify or delete the contents of USB storage (android.permission.WRITE_EXTERNAL_STORAGE) – Allows the app to write to the USB storage and/or to the SC card. Implies permission for reading from the USB storage – android.permission.READ_EXTERNAL_STORAGE
7.5 View network connections (android.permission.ACCESS_NETWORK_STATE) – Allows the app to view information about the network connections such as which networks exist and are connected. This allows for example showing a meaningful error message to the user if there is no Internet connection on the device. This information is also used in analytics and statistics.
7.6 Read phone status and identity (android.permission.READ_PHONE_STATE) – Allows the app to access the phone features of the device. An app with this permission can determine the phone number and serial number of this phone, whether a call is active, the number that call is connected to and the like.
7.7 Record audio (android.permission.RECORD_AUDIO) – Allows the app to record audio with the microphone.
7.8 Take pictures and videos (android.permission.CAMERA) – Allows the app to take pictures and videos with the camera.
7.9 PhoneGap Permissions – These permissions are DISABLED by default. Enable only those permissions that you use in your PhoneGap page. If you don't use PhoneGap in your application, please leave these permissions disabled.
Step 8. Version Name, Version Code, App Name, Package Name, Resource Synchronization, App Rotation.
7/9
8.1 Version Name – A string that represents the release version of the application, as it should be shown to users ( is just something that's shown to the user). e.g. 1.0, 2.1, honey cake, apple pie, …., etc.
8.2 Version Code – An integer value that represents the version of the application code, relative to other versions. You can set the value to any integer you want, however you should make sure that each successive release of your application on Play Store uses a greater value. e.g. If current app version code on Play Store is 2 then next version code should be 3.
8.3 Application Name – Application name is displayed under application icon. Must be a short name to fit icon width (2 lines of approximately 10-12 characters are possible).
8.4 Application Package Name – Is an unique application identifier used by Android to manage the installed applications. The Application package is also unique on the Android Market — there can’t be two apps with the same package name on the Play Store.
It MUST be of the form 'com.yoursite.appname'. It MUST contain only lowercase letters, digits and at least one DOT ('.'). NO others characters, NO spaces.
8.5 Resource Synchronization – Once your application is published in the Play Store you will have possibility to synchronize resources (images, sounds, html files, etc.) with app without releasing a new app version. Enable Sync for each file you want to synchronize. (App' Dashboard
8/9
> Edit Pages > Resource Manager).
8.6 App's Rotation – Enable/ Disable App's Rotation. (Portrait > Landscape > Portrait) By default Rotation is disabled.
Fill in all fields and press SUBMIT button.
Done. Submission complete! © 2016 Copyright | Tecstar Group
9/9
1.6 How to update your app? creatusapps.net/blog/how-to-update-your-app/
By CreaTusApps
How to update your app tutorial Hello All, Many users are asking themselves how to update an app that has been already published on AppStore. The below guidelines will bring some light to your question and hopefully will help you find certain answers.
In order to update your app, please, follow the steps below: 1. Log into your account at CreaTusApps.net
2. In order to update your application access " My Apps" tab.
Note: Remember that you are able to update an app only if you already have a published app.
3. After logging into your account at CreaTusApps, find the application you need to update and click on the applications next to it. Thus, you will be re-directed to you app's dashboard, where you are able to make all the major and minor changes you need to be released with the new version of your app.
1/4
4. Edit the pages, add menu items, do the light changes in the design, etc.
5. When ready, click on " Prepare For Release>>" link and afterwards click the "Submit to AppStore" button, thus, requesting a new build for your app.
2/4
6. Once you click on "Submit to AppStore" button you will be asked to fill in a form for application submission to AppStore. Now, all you have to do is simply follow the instructions for your updated app submission.
3/4
This is all!! © 2016 Copyright | Tecstar Group
4/4
1.7 Automatic Build – How to request it? creatusapps.net/blog/automatic-build-apps-how-to-request-it/
By CreaTusApps
Automatic/Instant Build Automatic/Instant Build is equivalent to Build Only, all submission process to Android Market/iTunes Connect is not included. I will try bellow to explain what is this and how it works and facilitates your decision about what type of build to choose for your application.
STEP 1. Automatic/Instant Build for iOS – How to request it. Pros, Cons and Conclusion. To submit for an Automatic/Instant build for iOS you need to choose it in Build Type step of submission process.
STEP 2. Further, you will have to upload Distribution Certificate and App Store Provisioning Profile, which you have to create on iOS Provisioning Portal page.
1/4
STEP 3. Next step will be to choose the enabling/disabling of Push Notification. If you want Push Notifications in your application, you must upload the Application Push Certificate file from Apple Developers account.
NOTE: Push notifications in Automatic/Instant Builds will work ONLY when it was created using our apnrequest.csr At the end of submission process you will see a Confirmation message and receive an email. Then build is done, a mail with application build download link will be send.
2/4
Pros: * Automatic Build is completely FREE from charges, you can request it by unlimited times. * Speed of binary delivery – because automatic build does not involve any human work, you can receive your application build in MAX 1 hour. * You can request an automatic build 24/7
Cons: * No human reviewer that can give an advice for founded issues. * No test on CreaTusApps real devices. * Screenshots, iTunes upload process, Dev Certificates must be done by yourself.
Conclusion: If you know that your application has no issue and you are familiar with Apple submission and uploading process Automatic Build is the right solution for you. Also, this is the fastest and FREE solution for having your app on AppStore.
STEP 1. Automatic Build for Android – How to request it. Pros, Cons and Conclusion. To submit for an Automatic/Instant build for Android is simpler than for iOS. In Build Type Step of submission process you just need to choose for Automatic/Instant Build.
3/4
After that you should receive a Confirmation message and receive an email. Then build is done, a mail with application build download link will be send.
Pros: * Automatic Build is completely FREE from charges, you can request it by unlimited times. * In max 1 hour (depends on size of your resources) you will get the build that can be uploaded to your Android Market account. * You can request an automatic build 24/7
Cons: * No human reviewer that can give an advice for founded issues. * No information about not-supported on Android OS pages. * No Screenshots of your working application
Conclusion: Android automatic build is the best FREE solution for everyone. Submission process to Android Market is easy and user friendly so we can suggest to request this type of build for 100% no issue in application.
It´s all, good luck!! © 2016 Copyright | Tecstar Group
4/4
1.8 How to use Apple Application Loader? creatusapps.net/blog/how-to-use-apple-application-loader/
By CreaTusApps This tutorial is described to help you prepare your applications for sale in the App Store. You can use Application Loader to create an Application Loader package containing the In-App Purchase metadata you want to add to your application and to submit your application binary files to the App Store.
Application Loader offers fast uploading, stable connections, and early validation warnings. Application Loader 3.0 requires a Mac, at least 512 MB RAM, and OS v10.8 or later installed. Apple recommends at least 20 GB of available space and a broadband internet connection with an upload rate of 1MB/sec or faster.
DOWNLOAD APPLICATION LOADER AND install it on your Mac OS X:
STEP 1. If the link above is not working, download the Application Loader from the iTunes Connect home page in Resources and Help link.
STEP 2. Click the Application Loader link to download the self-extracting installation package (ApplicationLoader_X.X.dmg). Save this file on your computer.
STEP 3. Double-click the installation package (ApplicationLoader.pkg) and follow the instructions that appear. NOTE: When installing Application Loader on the Mac, before you can install the software, you must log in to your computer as a member of the administrator group.
STEP 4. Read the installation introduction, and then click Continue.
1/6
STEP 5. Click Install to perform the standard installation. The installation package installs files in your Applications folder. Type your administrator password and click OK, if prompted.
STEP 6. Click Close. Open the Application Loader application by double-clicking the "Application Loader.app" icon in the Applications folder,or the folder you specified during a custom install. You are now ready to begin using Application Loader. Open the Application Loader application by double-clicking the "Application Loader.app" icon in the /Developer/Applications/Utilities folder or, to access Application Loader from the Xcode developer tools package, choose Xcode > Open Developer Tool > Application Loader. You are now ready to begin using Application Loader.
NOTE: The Xcode developer tools package is part of the latest Software Development Kit (SDK) from Apple. You can download the latest SDK when you sign in to the Apple Dev Center.
Sign in to or out of Application Loader
Before you can use Application Loader to create an Application Loader package and to submit your application binary files to the App Store, you must initialize Application Loader by providing your iTunes Connect login information at startup.
STEP 1. Double-click the "Application Loader.app" icon in the /Developer/Applications/Utilities folder or, to access Application Loader from the Xcode developer tools package, choose Xcode > Open Developer Tool > Application Loader.
2/6
STEP 2. Read the Application Loader Software License Agreement, and then click Agree. Application Loader opens the "Sign In" window.
STEP 3 . Type your iTunes Connect login information (Apple ID and password) in "Sign In" window.
STEP 4. Click "Keep me signed" to stay signed in when you quit Application Loader.
STEP 5. Click Sign In. Application Loader verifies your iTunes Connect sign-in information and stores your Apple UD and password for future Application Loader operations.
NOTES: If you change your iTunes Connect password, you must use the "Sign In" window to reset your Apple ID and password in Application Loader. To reset your Apple ID and password, choose Window -> Sign In As in Application Loader, and then repeat steps 3 through 5 above.
To sign out of Application Loader
Do one of the following: Choose Window > Sign Out Of > <user_name>.
3/6
Deselect "Keep me signed in" in the Sign In window, then quit Application Loader r, to change accounts, click the active user button, then sign in using new iTunes Connect sing-in information.
Submitting Your Application Binary Files
When you finished uploading your assets and completed the application submission process in iTunes Connect, you can deliver your application binary files to the App Store. To submit your application binary files:
STEP 1. Click Deliver Your App in the Template Chooser window, then click Choose.
STEP 2. Select your application binary file from the Deliver Your App window.
STEP 3. Click Open. Application Loader searches for the application and displays a window with your application details, including name, version number, SKU number, primary language, copyright, type, and Apple ID.
Click Activity to display the Background Activity window and view delivery status information for all packages you are currently sending, including pending messages, time remaining, warning and error messages, and so on.
4/6
STEP 4. Click Next. Application Loader begins uploading your application binary file to the App Store.
Click
to stop the transfer and keep the window open to select another file to submit.
Fix any delivery warnings or errors or click "Send to Apple" to submit your delivery failure information to Apple, then deliver your app again.
For more instructions on how to use App Loader click here.
5/6
It´s all!! © 2016 Copyright | Tecstar Group
6/6
2.1 How to position a page type on the tab navigation? creatusapps.net/blog/how-to-position-a-page-type-on-the-tab-navigation/
By CreaTusApps
How to set a page type on tab navigation? Many of you have probably asked how to set up a page on tab navigation. Though, it seems confusing it is a really simple process. In the following tutorial I will set a page under the first tab from my application.
Step 1. Rename the existing tab1.html It is really important you do not have more than two tabs under the same name. Do not rename the tab just typing its name with the upper case, for example TAB1.html . You should set a totally new name such as page1.html.
1/5
Step 2. Name the page type as tab1.html Choose the page you want to place on tab navigation and rename it as tab1.html. If you want to place the page on the second position in the tab navigation rename it as tab2.html, on the 3rd
2/5
position â&#x20AC;&#x201C; tab3.html and so on.
3/5
To set up pages on tabs you should have either Standard Tabs or Custom Tabs selected in Navigations Settings. 4/5
© 2016 Copyright | Tecstar Group
5/5
2.2 How to duplicate your existing app? creatusapps.net/blog/how-to-duplicate-your-existing-app/
By Jorge
How to duplicate an existing app? Duplicating an existing app gives you the possibility either to create a back-up or create an identical application for a different platform.
Below you my find some quick instructions upon how to duplicate your existing application.
1) Access your account at CreaTusApps.
2) Go to your app's Dashboard.
3) Click the "Duplicate" link.
4) Set a new application name or use the one that is generated automatically by the system.
5) Choose Target platform to duplicate your application.
1/2
6) Open the duplicated application in a new window to publish or edit it.
© 2016 Copyright | Tecstar Group
2/2
2.3 How to convert an iPhone app to iPad app? creatusapps.net/blog/how-to-convert-an-iphone-app-to-ipad/
By Javier Converting iPhone app to iPad app implies duplicating the iPhone app and adjusting the content and coding of the resulting iPad app.
1) Duplicating app In the Dashboard of your iPhone app find and click on the word/link Duplicate.
In the window that will pop up enter your new app's name and choose target from the list (iPad). Click on Duplicate button, then Done.
1/4
Your new iPad app will be listed on the Applications page. Note that duplication of the application will output the same (small size) pages with content but for the new target, that is iPad.
2) Adjusting content
Since iPhone and iPad platforms have different sizes the content has to be adjusted in order to be displayed properly on the screen of the device.
You may try to convert every page to their own type. Creatusapps will automatically adjust page properties from iPhone to iPad. However converting pages will result in data loss as the content will be overwritten with that of the template page. So you might like to create new pages and fill in the content, as well as to adjust html code and css manually.
Native pages will look as they should on the device. If not, try to convert the page to the same
2/4
type, or create a new page and copy content to it.
3) Examples
Html-based pages Duplicated html won't look perfect. You may need to update your style.css (which defines width, height and alignment) in Design Properties. You may also need to update html code of the pages. After duplicating pages you have to change width from 320px (specific for iPhone) to 768px (specific for iPad) within the “body” tag in style.css (Application Dashboard / Design Properties / edit style.css ):
Remark: If you create new pages, or convert, they will be sized to fit iPad screen.
Images Small images that look good on iPhone will be “stretched” on the iPad and look blur if not replaced with similar images of larger size to correspond to the size of iPad's screen. Background images (if Rotation enabled) To ensure that the background is filled up you can use small images for “tiling” and edit the “body” tag in style.css, as follows:
Background image (if Rotation disabled)
3/4
If gradient image is used it should have the width of 768px and “body” tag should be edited as follows:
Menu pages (when duplicated from iPhone app) may require editing in HTML mode: 1) change table width to 768px (from 320px) 2) change table items () to appropriate width
Remark: To have content stretch on the whole screen depending on either Portrait or Landscape orientation of the device, you will have to use % instead of fixed widths in pixels.
RSS pages (when duplicated from iPhone app) may require editing in HTML mode: Alter path from your iPhone app directory to your iPad directory (ex below, iPhone app directory "AppCool" and iPad app "AppCoolVersioniPad"), Alter name of RSS reader from "headlines.aspx" to "headlinesiPad.aspx", Also alter width of iframe tag from "320" to "768".
© 2016 Copyright | Tecstar Group
4/4
2.4 How to choose the app target? creatusapps.net/blog/how-to-choose-the-app-target/
By Javier You are able to change the target of your application to a different platform as long as it has the status " Unpaid". Once the application gets "Paid" status, you are not able to change its target, unless you duplicate it.
Therefore, in order to change the target of your app, go to its Dashboard.
By clicking the drop-down menu for the "Target" field, you have the option to select Native iPhone, iPad, Android, Kindle platform or WebApp. Select the one you want your app to be created for.
Š 2016 ă&#x20AC;&#x20AC; Copyright | Tecstar Group
1/1
2.5 CreaTusApps Application Analytics creatusapps.net/blog/creatusapps-application-analytics/
By Jorge
CreaTusApps Application Analytics is a powerful statistics template tool for your application. CreaTusApps App Analytics has an user friendly interface and provide you with all information you need to know about your existing app. Also it could be a good proof of your well done job.
What makes CreaTus Apps App Analytics indispensable tool for everyone: iOS and Android support Real Time data about installed and activated times of your application. Numbers of activated times using Device ID's Type of connections OS version Device Models Screen size and screen density (dpi)
With CreaTusApps App Analytics data you can design applications for your target group and be prepared for marketing estimates.
You can find our free App Analytics tool in your application Dashboard, section page â&#x20AC;&#x153;Statisticsâ&#x20AC;?.
Features We classified CreaTusApps App Analytics by several categories: Summary Events TOP 10 device metrics
1/3
Summary
Here you can find a quick statistics of your application how much time your app was installed, activated, how many days in use or statistics about type of connections and used IP.
Events
In this category you can find a graph containing number of events for a set period of time.
You can change the “from”/”until” date by inserting in designed fields your date or choose it from the calendar button (1), also you can find here and zooming option (2) that's gives you the possibility to choose the graph display options by day/month/year.
TOP 10 device metrics
2/3
1. Device ID sorted by number of activates. 2. Used IP Address sorted by number of activates 3. iOS/Android version sorted by number of devices 4. Screen size sorted by number of devices Small – small screen size Android devices Normal – iPhone/iPod and normal Android phones or multimedia devices Large – 7” Android tablets Extra Large – iPad and 9”-11” Tablets
5. Device model sorted by number of devices 6. Screen density (dpi – dots per inch) sorted by number of devices
© 2016 Copyright | Tecstar Group
3/3
2.6 How to use Dynamic HTML? creatusapps.net/blog/how-to-use-dynamic-html/
By Javier “Dynamic HTML” is a mechanism that allows mapping the values from some JSON data onto an HTML defined in a specific file. The result will be a nicely designed HTML with some custom data from JSON. How it works
The required components for the dynamic HTML are:
JSON data
template HTML file.
The JSON data provides the content that will be displayed on the page. It is usually requested from a server. The request can be specific to a user or a place.
The HTML template will provide the structure and design for the content. This is usually a file that already exists on the device. The HTML contains specific blocks of text which act either as placeholders for some data (like “[%=first_name %]”) or introduce some processing logic for the data (like “[%for-each pics%][%end for-each%]”)
Local HTML pages can also be updated using Sync Module. HTML pages are not static. They will be populated with server side data dynamically. It works very similar to XSLT transformations.
Example of an HTML file with our special tags:
<html> <head> <title>[%=profile.pagetitle%]</title> </head> <body> <div>[%=profile.pagesubtitle%]</div> <img src="[%=profile.imgsrc%]"><br> Messages:<br> <table> [%for-each profile.messages%] <tr> <td>[%=messagetext%]</td> <td>[%=messagedate%]</td> </tr>
1/3
[%end for-each%] </table> </body> </html>
In “app.xml” file for the appropriate page tag needs to be specified JSON datasource url, it’s the “jsonurl” attribute for the “page” tag and it can be any url like for example http://creatusapps.net/getuserprofilexample.ashx
Expected response in the body should contain the following JSON:
{"profile":{ pagetitle : "atitle", pagesubtitle : "asubtitle", imgsrc : "http://creatusapps.net/images/image123.png", messages: [ {messagedate:"1/5/2011", messagetext:"text1"}, {messagedate:"3/5/2011", messagetext:"text2"}, {messagedate:"6/5/2011", messagetext:"text3"} ] }}
Custom tags in the html above will be replaced with data from JSON response resulting in a temporary html which will be rendered on the device’s screen.
<html> <head> <title>atitle</title> </head> <body> <div>asubtitle</div> <img src="http://creatusapps.net/images/image123.png"><br> Messages:<br> <table> <tr> <td>text1</td> <td>1/5/2011</td> </tr> <tr> <td>text2</td> <td>3/5/2011</td> </tr> <tr> <td>text3</td> <td>6/5/2011</td> </tr> </table> </body> </html>
2/3
NOTE: This type of data representation allow users to populate dynamically content of HTML/native pages without any design changes. This feature offers a possibility to interconnect iPhone app with database from your own server and make it more interactive.
Š 2016 ă&#x20AC;&#x20AC; Copyright | Tecstar Group
3/3
2.7 CreaTusApps Custom URL Schemes creatusapps.net/blog/creatusapps-custom-url-schemes/
By Jorge
CreaTusApps Custom URL Schemes In order to give CreaTusApss users even more tools to design feature-rich interactive applications, we have created a custom set of URL schemes. Some of them are platform specific, others will run equally well on both iOS and Android. Please, look through the list bellow and see how you can enrich your apps.
URL Scheme addtocart://
Description
Platform Support
Adds an item to the user's shopping cart. The scheme has four parameters: item name, item price, URL of item info and URL of an image. All parameters are separated with an ampersand (&). Example: <a href="addtocart://id?itemname=name&itemprice=price&urlimg=imag e.png&urlinfo=info">Add item to your shopping cart</a>
bgplayer-play://
Playbacks an audio file in the background. Example: <a href="bgplayer-play://track-1.mp3">Track #1</a>
bgplayer-stop://
Stops background playback. Example: <a href="bgplayer-stop://">Stop background player</a>
counterenter://
Limits user to a specified number of page visits to a linked page or sets to zero the number of visits of the page if resetzero parameter is presented. Example: <a href="counterenter://secret.html?maxenter=1">Access my secret page just once</a> <a href="counterenter://secret.html?resetzero=">Reset the number of your visits</a>
external://
Opens a linked page in a default web browser. This scheme will take user out of your application. Example: <a href="external://http://creatusapps.net">CreaTusApps</a>
1/4
URL Scheme facebook://
Description
Platform Support
Posts a screenshot of current app page to user's Facebook wall. This URL scheme requires no arguments. Example: <a href="facebook://">Let your Facebook friends see this page</a>
globe://
Links a user to a globe-type page from our page type menu. The globe caries location marks that can be edited in our online editor. Example: <a href="globe://offices-worldwide.html">Our offices worldwide</a>
latlong://
Opens following coordinates with available Maps applications. Map opens up inside UI without leaving the app on iOS, while on Android available mapping application is loaded. Example: <a href="latlong://40.689167,-74.044444">Statue of Liberty National Monument, NY</a>
local://
Allows web sites loaded in In-App Browser or Mobile pages to link to internal resources of the app. Example: <a href="local://tab1.html">Start page of our app</a>
logout://
If your app allows users to register their own accounts, this scheme will log them out. Example: <a href="logout://">Log out<a>
map://
Displays the location of preset address using Maps application. Similar with latlong://. Example: <a href="map://Infinite+Loop+Cupertino+Santa+Clara+California+95014">Infinite Loop, Cupertino, Santa Clara, California 95014</a>
movie://
Opens a linked media file in default player. Example: <a href="movie://movie.mp4">Play movie</a>
2/4
URL Scheme ratings://
Description
Platform Support
Allows users to rate and comment a linked page on Facebook. Example: <a href="ratings://gallery.html">My gallery on Facebook</a>
removefromcart://
Removes an item from user's shopping cart by its ID. Example: <a href="removefromcart://item_id">Remove item from cart</a>
sendmail://
Prompts user to send an email to an indicated email address without leaving an app. Example: <a href="sendmail://my@email.com">Email me</a>
sharemail://
Creates a screenshot of current app page and prompts user so send it by email. This URL scheme requires no arguments. Example: <a href="sharemail://">Send a screenshot of this page by email</a>
sound://
Playbacks a sound file in OS' default player. The scheme was designed with audio effects in mind, so the playback can not be stopped. On iOS the audio file can only be 30 seconds long and of >WAV format. Example: <a href="sound://beep.wav">Alert</a>
uploadphoto://
Uploads an image file to a preselected file hosting. Example: <a href="uploadphoto://file_hosting.com/upload">Choose a photo to upload on the web</a>
xaudio://
Playbacks an audio file or stream in OS' default player. Example: <a href="xaudio://track-1.mp3">Track #1</a>
xvideo://
Playbacks a video file or stream in OS' default player. Example: <a href="xvideo://clip-1.mp4">Clip #1</a>
3/4
URL Scheme purchase://restore
Description
Platform Support
"Restore Purchase" option for Apple In-App Purchases. This URL scheme requires no arguments. Example: <a href="purchase://restore">Restore your Purchase</a>
Š 2016 ă&#x20AC;&#x20AC; Copyright | Tecstar Group
4/4
2.8 How to use Embed Application Code? creatusapps.net/blog/how-to-use-embed-application-code/
By Javier You can share via your website the apps you have created on CreaTusApps. This can be done simply by embedding an iframe from the Dashboard of your application to the HTML of your WebSite.
1) Go to your Application Dashboard
2) Copy "Application Code".
1/2
3) Paste "Embedded Application Code " into your web page.
RESULT:
Create your own iPhone app
© 2016 Copyright | Tecstar Group
2/2
2.9 Enabling Your App for Newsstand Tutorial creatusapps.net/blog/enabling-your-app-for-newsstand-tutorial/
By Jorge Newsstand application launched together with iOS 5.0 is designed to provide a comfortable interface to all your digital periodicals. If any of your applications designed at CreaTusApps classify as periodicals, you might want to consider enabling your app for Newsstand. First things first, please note that once Newsstand feature was enabled for an app, it can not be disabled, so think twice before doing this as there is no undo available. From the point of view of development and design there are no actual restrictions to technical or graphical approaches, Newsstand logically indicates that the app is periodically updated with content on a particular topic or topics.
To enable an app designed at CreaTusApps for Newsstand go to its Dashboard â&#x2020;&#x2019; Newsstand Properties and check the Enable for Newsstand checkbox. On the same page provide a Newsstand icons. When ready save the changes.
Newsstand requires Apple Push Notification (APN) service to be enabled in your app (how to enable APN service). Also, you need to think ahead of what files you are going to update while preparing a new issue of your magazine or newspaper and enable synchronization for those files
1/2
in the Resource Manger. This will be needed when you publish a new issue as there is no need to upload it to iTunes Connect because everything can be done by sending a push notification, but please note that any Newsstand application requires at least one In-App Purchase. If your app is free you might want to choose a Free Subscription In-App Purchase type. To publish a new issue of your periodical in the Newsstand, go to app's Dashboard → Newsstand Content Publishing. A simple press of the Publish New Content button will send all of the synced files to user’s devices in a form of a new issue of your periodical.
© 2016 Copyright | Tecstar Group
2/2
2.10 Prompt users to rate your app creatusapps.net/blog/prompt-users-to-rate-your-app/
By Javier It is possible to interactively prompt users who downloaded your app, to rate the app and write a review on the App Store. This option will work for apps which are live on the App Store.
Before requesting a new build (update), make the following changes in the settings of your app. From the dashboard of your app access Application Settings:
Click on Platform Specific Options â&#x20AC;&#x201C; > Rate App Settings:
Enter your app's Apple ID
Note: to find out your app's Apple ID log in to your account on itunesconnect.apple.com / navigate to "My apps" / "More" / "About This App".
1/2
Pick the activity which will trigger the "Rate App" popup message:
prompt at launch application, or at relaunch from background
You can also personalize the message encouraging user to rate/review your app. If not the following message will appear:
"If you enjoy using 'bundleAppName' , would you mind taking a moment to rate it? It won't take more than a minute. Thanks for your support!"
The popup message will look like below:
Tapping on "Rate It Now" user will be taken to "Rating section of your app" from App Store. After signing in with his/her Apple credentials user will be able to rate your app/ submit a review of your app for the App Store.
Š 2016 ă&#x20AC;&#x20AC; Copyright | Tecstar Group
2/2
2.11 How to enable and use resource synchronization? creatusapps.net/blog/how-to-enable-and-use-resource-synchronization/
By Jorge
Resource Synchronization Resource synchronization or SYNC is a an option that allows you instantly update live applications without uploading a new binary on the Store. This is convenient if you have lots of files to update and you do not have time to wait for a new binary approval. To benefit from this option you need to enable SYNC before you request the binary to upload on the Store. On the last step of submission process enable (if not) SYNC to use this option within the application. Note: SYNC option is enabled by default for app.xml
Publish the application on iTunes Connect, Google Play Store or Amazon Store. Once the application is approved you can use Resource Synchronization to update the existing files(images, sounds, HTML files, etc.). You can show or hidden SYNC option from App Settings -> In-App Settings option.
1/3
To choose what files do you want to sync, go to app's Dashboard -> Edit Pages -> Resource Manages. The check-box on the far right of the appeared table represents the sync feature state of the file (page).
Note: Just files set as SYNC in Resource Manager will be updated. When user taps on Setting button -> SYNC, selected files will update from the server. Also, each time the user opens the app the files will update automatically.
2/3
© 2016 Copyright | Tecstar Group
3/3
2.12 Creating, Editing and Publishing a WebApp creatusapps.net/blog/creating-editing-and-publishing-a-webapp/
By Javier Creating, Editing and Publishing a WebApp In this tutorial I will show you how to create, edit and publish a WebApp (Mobile Website).
Create an App using any of our tutorials and choose the target â&#x20AC;&#x201C; "WebApp"
You may also change the target of an existing App (iPhone, iPad, Android or Kindle) to WebApp
There is one important thing that needs to be noted when you are changing the target to an existing App or you are duplicating an existing App ( duplicate an App ). A WebApp cannot have native tabs. So if your existing App has tabs, after changing the target or duplicating, it will not have tabs. The tab pages will be in the App (tab1.html, tab2.html. tab3.html, etc) but the default start-up page will be now index.html.
The start-up page will be blank. But do not worry. When changing the target, a blank index.html file was created. You may rename any page from your App to index.html and that page will show up on start-up (first rename the default index.html to any other name).
1/4
Once you created a WebApp, you will notice in its Dashboard that there are fewer options than a native App has. We have removed all the unnecessary settings like: Navigation Settings, App Store Proprieties, Statistics, Push Notifications, Page Settings, Newsstand. Also some options from App Settings we removed. All of these settings were removed because a WebApp uses only HTML based pages and obviously there is no need for Navigation Settings, Push Notifications, etc.
The WebApp cannot have native features. Here is a list of the page types supported on WebApps:
HTML, Button Menu, Color Menu, Content Menu, Grid Menu, Image Menu, Large Button Menu, Magazine Menu, Menu, Sample Menu, Side Bar Menu, Stripes Menu, WebKit Menu, WebKit Submenu, About Us, Audio Stream, Calculator, Form, Drag & Drop, jQueryMobile, Radio Stream, WebKit details, Image Area, RSS.
As I already mentioned a WebApp cannot have native tabs or a Top Navigation Bar but you may create them in a HTML page. You may also create a back button and many other things.
Once your WebApp is ready, you may publish it. You can publish a WebApp on a domain or a subdomain.
After you click "Ready to Publish", there will be a field where you will have to insert your domain or subdomain. The URL link you set will be the direct link for your Web App. Note that you do not need a server. Your App will be hosted on our server.
a) You may just create an A record and point it directly to out IP address: 184.172.164.220
In App Dashboard, you will find the direct link to your App. In case you want to unpublish the App from your domain, click the "UnPublish button"
It might take some time till the domain is set up to our server (up to 1-2 hours). Open the link in a web browser or a mobile browser on your device:
b) Publish the WebApp on a subdomain. Set your subdomain and click "Publish"
You must add following IP address as host DNS entry of your subdomain (Point your subdomain
2/4
to the IP address)
184.172.164.220
Note that if you are using a subdomain, you do not need to point the domain to our nameserver.
After processing is finished click "Done". The subdomain link will be active from a few minutes up to a few hours.
Once your App is published, you can make changes to it in App Dashboard > Edit Pages. You may add or remove pages. After you make any changes to the App you will have to republish it.
Updates were made to the WebApps functionalities.
New options were added:
1) Offline Mode .This will allow the WebApp to be cached on the device so it will fully work in offline mode. Once the app is installed on the device it will work similar as a native app.
2) Open links in the same window. This is an important option that will make all the URL's and pages from the app to be opened in the same window. A new tab will not be opened in the browser anymore.
3) App Multimedia .You can now upload icons (for all devices) and even splash screens.
4) QR Code will appear after the app is published
5) Updates. Once you would like to update an installed WebApp on a device, you will have just to republish it on the website. In a few minutes then a pop-up message will appear on the device informing about the updates received.
Note: That in order for the WebApp to be updated, it needs to be opened on the device.
Š 2016 ă&#x20AC;&#x20AC; Copyright | Tecstar Group
3/4
4/4
2.13 What are Google Play Store expansion files? creatusapps.net/blog/what-are-google-play-store-expansion-files/
By Jorge
Google Play Store Expansion Files 1. What are Google Play Store expansion files? Google Play currently requires that your APK file be no more than 100MB. For most applications, this is plenty of space for all the application's code and assets. However, some apps need more space for high-fidelity graphics, media files, or other large assets. To make this process easier for you and more pleasant for users, Google Play allows you to attach a large (2GB) expansion file that supplement your APK. Google Play hosts the expansion files for your application and serves them to the device at no cost to you. On most devices, Google Play downloads the expansion file at the same time it downloads the APK, so your application has everything it needs when the user opens it for the first time.
2. How to know if I need expansion files for my Android app? In case you're not sure if your app has more than 100MB, feel free to request a test build (Instant build) for your app and check the binary (.apk) size.
3. How to enable Google Play Store expansion files for CreaTusApps apps?
3.1. Android Application Licensing Public Key For enabling the Google Play Store expansion files for your app you'll need an unique Android Application Licensing Public Key. You can find it under Services & APIs section of your app settings.
3.2. Add the Android Application Licensing Public Key for your app
1/4
After you have copied the app public key, you'll need to add it for your app. Please follow these steps Your App Dashboard -> Application Settings -> Platform Specific Options -> Android Application Licensing Public Key and paste your Application Licensing Public Key.
3.3. Enable Expansion Files In order to enable Expansion Files for your app please follow these steps: Your App Dashboard -> Application Settings -> Platform Specific Options -> Use Expansion Files
**NOTE: Expansion files will be sent to you with the APK file when you request a build.
4. Where I can find the expansion files for my app? Please unzip the received from us build file for your app. You should find an app-release.apk file, this is your main app binary. The expansion file for your app you'll find in the info folder. App
2/4
Expansion file name should be main_expansion_file.obb.
5. How to publish an Android app with Expansion Files on Google Play Store? 5.1 Add a new .apk for your app. You can find this option under APK section of your app settings.
5.2 Upload your main app binary (app-release.apk)
3/4
5.3 After your .apk will be accepted click on No Expansion Files
5.4 Click on Upload a new file and upload the main_expansion_file.obb file
© 2016 Copyright | Tecstar Group
4/4
3.1 How to add the Announcements Page creatusapps.net/blog/how-to-add-the-announcements-page/
By CreaTusApps
Announcements Page Type Tutorial The Announcements Page was created to replace the old Notification Page and old Notification Popup window. The new page allows keeping and saving the sent Notifications inside an app.
STEP 1. In order to add a new Announcements Page in your app, go to " Edit Pages" menu then click on the "+" (Add New Page) button. From the list of the page types available, select Announcement and click on the "create" button.
STEP 2. Once the page is added, you may proceed with editing it.
1/8
You do not have to edit anything in this page. It works as it is when you add it in the app. However you may customize the Style of it and also preview in real mode.
1) Edit Style. Here you can edit the Design of the Page. There are 2 settings:
a) Edit Style Class Body
2/8
This setting allows editing the design which is outside the Push Notifications box.
b) Edit embedded CSS. Here you can edit the Style of the Push Notification box and messages. There are 4 CSS classes:
3/8
1. push-box. This CSS class is for entire Box that contains the message. You can change the background color, add margin, padding, etc. 2. push-item. This CSS class is for a Message cell only. 3. push-date. This CSS class is for the Date message. 4. push-message. This CSS class is for Message tex. See the next step where the Preview shows where each class is located.
2) Preview. You can preview how the Announcements Page looks like.
4/8
* Please edit the CSS style settings only if you want to have a custom design for this page. By Default the page will have Standard Design for iOS and Android platforms.
Also, you may edit this page form HTML mode. You may add Header Images or any other elements. Make sure to NOT delete the placeholders '$messageDate$' and '$messageText$'.
The Styles you set for the Announcements Page will take effect also for the Push Notification Popup window which shows on the device.
Android
5/8
iOS
6/8
7/8
You can modify the "Announcements" text from App Dashboard > App Settings Localization.
The keys are: iOS: "Announcements" = "Announcements"; Android: announcements_title (Announcements)
3) Delete sent messages. You may delete the sent messages using this option.
The Announcements Page and Popup window can be tested only in new Applications (or new versions) submitted after November 28th 2014. Š 2016 ă&#x20AC;&#x20AC; Copyright | Tecstar Group
8/8
3.2 How to add the App Share creatusapps.net/blog/how-to-add-the-app-share/
By CreaTusApps Sharing is one of the most important function an application could have. CreaTusApps comes with the "App Share" feature that helps users to communicate about their app via Whatsapp, E-mail, Facebook, Twitter, etc.
Benefits: Sharing increases app's visibility: – Provides impressions in the Facebook News Feed – Sharing the app drives traffic and app installs
Update – July 2016. The new App Share Page will now support sharing on all Apps installed on devices. This is available for all platforms. All the URL links added in the edit mode of the page will be shared. Some Applications like Facebook support only one link for sharing. For this use case, you can select which link will be shared (primary) in the edit mode of the Share Page.
To add "App Share" page you need to access the Application's Dashboard and go to "Edit Pages" section. Click on Add Page button "+" to add a feature to your application. You will be redirected to the Marketplace where you may find different pages for the app.
1/5
Once added you may go to Edit the page.
2/5
Page Properties 1. App Name – Enter the Application's Name 2. Icon – Select the application's icon with a maximum resolution of 100x100pixel 3. App Description – Add App Description that will be displayed on the page itself 4. Share Description – Add a short description of the app that will be shown in the E-mail or Facebook share message you will send. 5. App Store/Google Play/ Kindle Fire – Insert the links of the Application from the App Store: Google Play Store for Android App/ Apple App Store for iOS App/ Amazon App Store for Kindle App. Select which link will be shared primary.
3/5
You need to have sync enabled for the App Share page in the Resource Manager to be able to add the corresponding links once the application will be live on the Store.
This is all, good luck! 4/5
© 2016 Copyright | Tecstar Group
5/5
3.3 How to add the Audio Stream creatusapps.net/blog/how-to-add-the-audio-stream/
By Jorge
Audio Stream Page Tutorial In this tutorial I will show you how to use the Audio Stream Page type. In order to add a new Audio Stream Page to your app, go to Edit Pages menu then click the "+" (Add New Page) button. From the list of the page types available select Audio Stream and click the "Create" button.
Once the page is added, you are able to proceed with editing it.
1) Here you can set a cover image. The cover image can be any size (PNG or JPEG) 2) The stream title will appear on the bottom of the page. You can set any title.
1/3
3) Here you can set an Audio Stream link. The Audio Stream link can be any mp4 or mp3 file. An example of a streaming link is http://www.jplayer.org/audio/m4a/TSP-01-Cro_magnon_man.m4a.
Note that for iOS you can use also Radio Streaming links and direct links to media files uploaded in the Resource Manager of the App. So if you uploaded a media file in the Resource Manager (see the next screen image) you can set only the name of the file in this field. You may upload media files up to 25 MB size each.
If you want to stream a media file on Android platform from the Resource Manager, you will have to use this link format: http://creatusapps.net/myapplications/Username/AppID/Media_File_Name . This link format will work also for iOS platform. Note that on Android platform the Audio Stream page will always work in background mode even if you exited the app using the "back" button. Now let's see how the page looks on a device:
iOS
Android
2/3
The minimal Android version supported is 4.0 The minimal iOS version supported is 6.0
© 2016 Copyright | Tecstar Group
3/3
3.4 How to add the Barcode Scanner creatusapps.net/blog/how-to-add-the-barcode-scanner/
By Javier Nowadays a barcode can be found everywhere. That's why CreaTusApps developers created a new page type: Barcode Scanner.
With this feature in your application, people can scan any desired barcode and find the information about scanned product from an international barcode database.
To insert the scanner in the app, you can just select the â&#x20AC;&#x153;Barcode Scannerâ&#x20AC;? page type from Page Type Resource Manager.
**NOTE: No further action required for QR Scanner page.
1/2
Features:
Barcode Scanner uses Phone or Multimedia Device primary camera as scanner. It works without any problems on low resolution camera devices, such as iPod.
Tap SCAN button to begin the scan.
Just look to fit the Barcode into your screen and scanner will automatically find the code.
Tap CLEAR button to clear the list of scanned codes.
Š 2016 ă&#x20AC;&#x20AC; Copyright | Tecstar Group
2/2
3.5 How to add the BMI Calculator creatusapps.net/blog/how-to-add-the-bmi-calculator/
By Jorge
Body Mass Index (BMI) â&#x20AC;&#x201C; screening tool to identify possible weight problems BMI is a number calculated from person's weight and height. Body Mass Index provides a reliable indicator of body fatness for most people and is used to screen for weight categories that may lead to health problems. Easily you may integrate this page type with application related to the sport or healthy food.
1. Find the BMI page from "Page Types" and add it into your application you are working on.
Click in ADD PAGE and add BMI Calculator function page type to your application.
1/3
2. Once you've created the page you may edit it.
3. You may alter Result Properties for every BMI Condition. For that choose one of the formula from Conditions and edit it in Result Properties.
2/3
3.1. Image Name: Here you may insert an image which will be shown in the square. 3.2. Message: Message will appear to serve with the information about the Body Mass Index. 3.3. Page Name: Once you click on the message you may link to a page that describes current BMI and advices about healthy life style. It is up to you what page you link with and what will be shown in it.
4. Test BMI page type to see if everything is working as expected. Moreover, on the previewer you will see 2 alternatives to calculate the BMI: metric version(kg; cm) and english version(ft+in; lbs).
5. Enjoy editing this stunning feature for your application. *Note: This function is available for both platforms: iOS and Android.
Š 2016 ă&#x20AC;&#x20AC; Copyright | Tecstar Group
3/3
3.6 How to add the Button Menu creatusapps.net/blog/how-to-add-the-button-menu/
By Javier Button Menu page type is a page that contains a classic list of buttons, and each of the menu items can be linked to a separate page.
In order to add a Button Menu page to your app, go to your app's Dashboard and click on "Edit Pages" link. When re-directed to the app's editor click "+" (Add New Pages) button to call up the list of the available page types.
In the list select Button Menu page and click "Create" button to actually add it.
Now you may start editing it. For that, click on "Edit" button next to the newly added page.
On the Button Menu page editor you may change the header image by selecting different images from the resource manager (Note: you need to upload the header image to the Resource Manager first).
Now, adding new menu items (buttons) â&#x20AC;&#x201C; click "+" to add a new button or "â&#x20AC;&#x201C;" to delete the currently selected one.
Once a button is added, you may re-name it, change the button background image and finally link it to another page from your app accordingly.
1/2
You may also change the design of the page by accessing the PAGE STYLE section.
Now, remember to click "Save" button when you are done with editing the page to have the changes applied.
Š 2016 ă&#x20AC;&#x20AC; Copyright | Tecstar Group
2/2
3.7 How to add the Calculator creatusapps.net/blog/how-to-add-the-calculator/
By Javier Our team is happy to present you a new page type called Calculator. The Calculator page type is designed in order to help you and indeed the users of your app to solve predefined mathematical problems. There are many situations when you might want to use a predefined formula calculator. Some of the most popular are body fat percentage calculation, ingredient amount calculation for recipes, etc.
So, get started by adding a Calculator page to the list of all pages of your app. Go to app’s Dashboard → Edit Pages → + Add New Page. In the menu of all our page types select Calculator and click Create.
A page looking like this will appear:
Calculator page type stands out from the list of our other page types because it has the strongest emphasis on editing the code. To take most out of calculator page type you will have to have at least basic HTML skills, but don't worry – the default template source code is designed and formatted to be easily understood and edited.
By default Calculator page type has three input fields values of which are summed when you tap Calculate button. If your formula has more (or less) parameters than three go into HTML editor by clicking HTML to add more of them.
Locate the following entry:
<input id="p1" type="number" style="text-align:right; width:60%; font-family:monospace; font-size:100%; font-weight:bold;">
This is a code for one input field of your formula. Copy and paste it as many times as many parameters you have. Please note that each input field has a different ID — the first attribute of the element. The IDs are assigned to the input fields sequentially. Edit each id attribute so that its value would represent a p followed by its number in the list of the input fields. Numeration of input fields is done in natural numbers and starts from one (1).
After you have created all the input fields for formula parameters you have, it’s time to go into editing the JavaScript function that does the calculation.
Locate the following entry:
1/2
var param1=parseFloat(document.getElementById("p1").value);
This is a JavaScript code that assigns value of input field p1 to param1 variable. Copy and paste this code as many times as many input fields you have changing the numeration respectively.
Now its time to go into the formula itself. Locate the following entry:
var result = param1 + param2 + param3;
This is another JavaScript assignment. You should only take an interest in the part right to the equality sign (=). Here are all the mathematics done. Use plus sign (+), asterisk (*), hyphen (-) and forward slash (/) for adding, multiplying, subtracting and dividing parameters. You can also introduce coefficients to the parameters in case you need them.
This is it, Calculator page type needs no further editing. In case of a wrong input the Calculator will come up with the invalid input result.
Please feel free to create a support ticked or a forum post in case you need some help with our Calculator page type.
Š 2016 ă&#x20AC;&#x20AC; Copyright | Tecstar Group
2/2
3.8 How to add the Agenda Calendar creatusapps.net/blog/how-to-add-the-agenda-calendar/
By Jorge
Calendar Page Type Calendar page type is a native page that can be used to organize and keep track of events from your daily agenda. In the Edit Mode of the page you will find that there are some fields that can be customized. Specifically, you can add your own Event Categories and Event Category Colors. If you leave these two fields empty, the default listings will be shown within the page.
1.Default Listings- Leave the fields empty for default listings
2.Custom Listings- add your own categories and colors; separate the values by a comma (,)
1/4
Also, you can add your custom events directly from the Editor. Use "+" Add and "-" Remove buttons to create new events and delete the existing ones. In the Event Properties you have to set a Title for the event, set a category for it, add Location, Start/End date/time of the event, mark as All Day event or an active event(active option allows to either show or hide the event). Moreover, you can add a description to the event, it can be customized by editing a blank HTML or link to an existing page from the application's resources.
Here is how the event is displayed on the device.
Month Prospective Day Prospective List Prospective
Directly from the device you can also add your own events. These events can be deleted from the device, but the ones which are created on the website cannot be deleted nor changed. On the device there are the same fields for events creation as on the website. You have to introduce the event's title, category, location, start/end time or mark the event as an All Day Event.
Š 2016 ă&#x20AC;&#x20AC; Copyright | Tecstar Group
2/4
3/4
4/4
3.9 How to add the Camera Cover creatusapps.net/blog/how-to-add-the-camera-cover/
By Javier Cover Camera Page is an awesome feature to help your friends, family members and beloved pets become a magazine cover model. You can take a new photo and insert it into a cover template and then email it or share on Facebook, send an e-mail or save it to Photo Library.
In order to add a new Camera Cover Page to your app, go to Edit Pages menu then click the "+" (Add New Page) button. From the CreaTusApps Marketplace find Camera Cover page type. Click on it to add to your application.
Once the page is added, you are able to proceed with editing mode.
1/4
On the right side there are 3 fields that should be edited to get a fully customizable and functional Camera Cove Page . Specifically, you will find 2 major fields: Camera Cover Resources and Cover Properties. In Camera Cover Resources you have to set up the e-mail address to which the users will send their covers(the e-mail address can be changed from the device). Below you have to add the number of covers you want to use for Camera Cover Page; press "+" button to add covers or "â&#x20AC;&#x201C;" to remove the existing.
2/4
Let's see how it works on the device
We can see three buttons. Click on the top-right to take a photo.
After you have taken a photo, you will be able to apply the covers you have set in the edit mode on the website.
The images taken using Camera Cover Page can be send to an e-mail, shared on Facebook or saved in the Photo Library of your device. Moreover, you can draw on it or rename the image. All of this is available on the cover's dashboard.
There is also a possibility to delete all the covers that have been made. Press on the "Clear" button to delete the covers.
*NOTE: This page can be tested ONLY using CreaTusApps's AppPreviewer application.
Š 2016 ă&#x20AC;&#x20AC; Copyright | Tecstar Group
3/4
4/4
3.10 How to add the Map function creatusapps.net/blog/how-to-add-the-map-function/
By CreaTusApps The Map type page allows to display the Google map with multiple locations. Locations are determined by latitude/longitude coordinates and are marked by pins on the map. It is possible to provide each location with a brief description and a link to a target URL of a page containing detailed description of the location.
The page should be tested on CreaTusApps Previewer App (The image in the web simulator has no clickable areas). Editing is done in Edit Map Page.
1/7
Page displayed on the device:
2/7
The Map Title is editable Map type, select view map or satellite.
3/7
Locations can be added (+button) or removed (-button) from “Locations:” table.
In the table “Location details” you can specify name of the place and its coordinates (latitude/ longitude). Additionally you can enter a brief description and a link (Target URL) to a page within your app or a web page containing detailed description of the place.
Page displayed on the device (upon taping on location pin)
4/7
Locations can also be entered directly in the app.xml file. In the app's Dashboard find the link Edit "app.xml" file A Resource Manager window will open with the xml file.
5/7
Scroll down until you find the following code:
1
<location>
2
<name>Location 1</name>
3
<latitude>53.408708 </latitude>
4
<longitude>-2.157344 </longitude>
5
<imageurl> </imageurl>
6
<ldescription>About Location 1 </ldescription>
7
<ltarget>Location1.html </ltarget>
8
</location>
These xml tags contain the data for each location you input. Copy/paste the tags â&#x20AC;Ś for as many locations you want to add and simply replace the valued between <>â&#x20AC;Śtags.
1
<name>Location1</name>
Contain the name of location (Location1 can be replaced with a real name of the place) Also enter for each location
6/7
1
<latitude>... </latitude>
2
<longitude>... </longitude>
3
<ldescription>... </ldescription>
4
<ltarget>… </ltarget>
Enter either link to a page in your app, either URL to a page about “Location1” place.
© 2016 Copyright | Tecstar Group
7/7
3.11 How to add the Login Page Function creatusapps.net/blog/how-to-add-the-login-page-function/
By Javier CreaTusApps allows its customers to have user accounts in their apps. This has become possible since we have designed a Login Page type.
To add a Login page to the resources of your app you can do the following: go to your app's Dashboard → Edit Pages → + Add New Page. In the menu of all our page types select Login and click Create.
Login page editing options are available only to the designers of an app. So if you decide that users should be able to register their own accounts in your app, you will have to provide them their credentials, namely login and password.
To add a new user account to your app click on the "+" at the bottom of the list of all users. In the window just below provide login and password for the user as well as a target page of your app to which he or she will be redirected after successful logging in.
For example the picture above represents credentials of the user "User1" who's password is "user1pass". He will be redirected to a page called tab1.html which other users might not have a right to access.
© 2016 Copyright | Tecstar Group
1/1
3.12 How to add the Menu Page Function creatusapps.net/blog/how-to-add-the-menu-page-function-android-ios/
By Javier In order to add a "Menu" page type you need to access your Application's Dashboard and go to "Edit pages" section.
Click on Add New Page button, the "+" button below the list of the currently available pages.
Once added you may go to Edit the page.
Here, you may add as many menu items as you need, just make sure that all of those have other pages linked to each of the item from the list.
1/3
In Edit mode for that page you may change the Header image. You may choose an image already existing in Resource Manager or upload a new one.
In the "Menu Items" section, you may click on "+" button to add more menu items and "–" to delete the existing one. With the controllers you can switch items among them.
Below you may find the Items Proprieties section. Here, you may change the title, image and the Link-To page of the item selected in "Menu Items" section.
Sample "Menu page" on the device
© 2016 Copyright | Tecstar Group
2/3
3/3
3.14 How it works EPUB Reader creatusapps.net/blog/how-it-works-epub-reader-for-android-ios/
By Javier Because Apple iPhone, iPod Touch and iPad have become major platforms on which to read eBooks, CreaTusApps developers designed a new ePub reader page type with which we want to give similar experience in users reading process as modern eReader devices.
Now, it's very easy to add an eBook in your Android & iOS application.
Add a new page and choose from Page Type Resource Manager the â&#x20AC;&#x153;ePub Readerâ&#x20AC;? function page type.
Upload your eBook to Resource Manager (In-app resources)
The last step is to choose from Resource Manager your eBook.
1/4
NOTE: Only .epub file type accepted.
And now you can check using CreaTusApps App on your mobile device how it looks.
Features: CreaTusApps ePub Reader page type transforms your application into a book, with all properties of a modern eBook Reader dedicated device.
You can choose the chapter
Resume Reading
Swipe pages by tapping on the left/right part of the screen
Swipe pages by sliding
Landscape and Portrait mode supported.
© 2016 Copyright | Tecstar Group
2/4
3/4
4/4
3.15 How to add the Coupon Discount Function Android & iOS creatusapps.net/blog/how-to-add-the-coupon-discount-function/
By CreaTusApps The Coupon Function Page Type allows to include a coupon image in your app which the end user will be able to use (namely show it to the vendor) in order to benefit of a discount, etc. The coupon image becomes unlocked (displayed on the screen of the device) after end user scans a certain amount of times the QR code printed on your product, or displayed on the screen in your points of sale, etc.
The coupon type page allows to include a coupon image in your app which the end user will be able to use (namely show it to the vendor) in order to benefit of a discount, etc. The coupon image becomes unlocked (displayed on the screen of the device) after end user scans a certain amount of times the QR code printed on your product, or displayed on the screen in your points of sale, etc.
NOTE: Coupon page type can only be viewed on a device. Editor mode simulator is for demonstration purposes only.
In Edit mode, it is possible to customize the multiple options:
1/8
1. Coupon name: Your coupon name
2. Coupon image: Your coupon image Sample in App Resources:
2/8
3. Start date: Coupon will be available starting with this date
4. End date: Coupon will be available until this date
5. QR code data: Data (text, etc) contained in the QR code
3/8
6. Check-in target amount: Number of times required to scan QR code in order to unlock the coupon image in the app
7. Hours before next check-in: Hours to pass until next scanning is possible
8. Can be used again: The coupon can be used again after being used once
9. Coupon description: Set description for coupon
The coupon is "locked" until QR code is scanned the required amount of times. User can read instructions tapping on "How to Unlock" or proceed to scanning by tapping on "Scan" button.
4/8
Coupon successful scanning the Checkin target amount will be automatically incremented by 1 (for instance 1 of 4) and the following message will pop up:
When Checkin amount target is reached (for instance 4 of 4) coupon image is unlocked and user prompted to show the coupon to the vendor:
After vendor taps on "Use this coupon" the coupon image becomes locked and Check-in target amount is nulled (0 of 4)
5/8
Unlocking the coupon will require scanning the QR code from the beginning.
FAILURE In case of failure to scan the following messages will pop-up:
6/8
Scan the QR code again
Coupon is not valid until Start date (availability period is set in the page)
7/8
Coupon is not valid any longer (date is set in the page).
Great!, already have a discount coupon on your app! © 2016 Copyright | Tecstar Group
8/8
4.1 Bookstore Template creatusapps.net/blog/bookstore-template-for-android-and-iphone/
By CreaTusApps
How to build your application using BookStore template
The reason for using this template is to offer the possibility for publishers and authors to put in selling your books into an iPhone application. To build your own bookstore application there is no necessary to be an iPhone developer expert, you can use BookStore template.
The following steps will help you create your BookStore application: Select BookStore template from Templates page Choose "Use This Template" and get the name for your application Now you can start to edit the content of your bookstore:
1. First tab (Book Store) is an IMG MENU page with the list of books in your bookstore. Each item points to a book cover page with detailed information about the book's content and price (using In App Purchase link or inAppPurchase subscription).
2. Cover page has a brief description of the book. On this page we have 2 buttons: "GO TO
1/3
BOOKMARK" and "OPEN BOOK". Each button opens book content page:
Simple link: "OPEN BOOK" <a href="http://Content_b1.html" </a> "GO TO BOOKMARK" <a href="http://Content_b1.html?gotobookmark=1&" </a>
In App Purchase link: "OPEN BOOK" <a href="buy://46312:Content_b1.html" </a>
"GO TO BOOKMARK" <a href="buy://46312:Content_b1.html?gotobookmark=1&" </a>
NOTE: If the book from bookstore is free for visualization we will use Simple link (http://) otherwise we will put in selling the book via In App Purchase link (buy://).
NOTE: In the sample below 46312 is a sample product number issued by Apple. To get your own product number you need to submit a product application on itunesconnect.apple.com, where you'll specify the price amount and the billing cycles.
3. Book's content pages can be a collection of interlinked HTML pages or an HTML page with type EPUB (CreaTusApps special page type) with attached file of type *.epub (electronic publication).
a) If we are using a collection of interlinked HTML pages to show the contents of the book we have additional options on each page:
"BOOKMARK" <a href="bookmark://book=Content_b1.html&page=Page1_b1.html/anothercontent"> "bookmark://" schema have two parameters:
book â&#x20AC;&#x201C; the name of the book you're applying bookmark page â&#x20AC;&#x201C; the name of page you're applying bookmark
"INDEX" <a href="Content_b1.html"> Return to content page of the book (first page).
NOTE: "bookmark://" schema allows users to save bookmarks for different pages in your book
2/3
store application.
Transitions between pages can be set (slide, curl) in design mode.
b) When we are using HTML page with type EPUB (CreaTusApps page types) with attached file of type *.epub ( electronic publication ) bookmark mechanism automatically will save last navigation page. Transition between pages is activating on double-click event on the page or with navigation buttons (Forward, Revers) from header of the document.
Š 2016 ă&#x20AC;&#x20AC; Copyright | Tecstar Group
3/3
4.2 Mobile Shop App Template creatusapps.net/blog/mobile-shop-app-template-android-iphone-or-ipad/
By CreaTusApps
Introduction If you're reading this guide you probably need a new mobile app for your store. The first step in this process is to use CreaTusApps App Builder with the mobile ordering features from our "Add new page" section to create a working app that can be previewed and tested using our Previewer Applications (Download Android App Hereâ&#x20AC;&#x201C; Download iOS App Here).
A checklist for building your first app Step 1. We advise all our customers to write on a paper the basic app requirements. Having this will help you design your app much faster. I have already compiled a list of requirements for my Mobile Store app so I'll share these with you:
â&#x20AC;&#x201C;NO TABS Buttons for: Categories, Win a Prize, About, Our Locations, Facebook page and Share the app. Categories: Fashion, Jewelry, Electronics, Sports. etc
Step 2. Pick a template from our Available Templates page or start with a Blank Template. As first page (index.html) I'll use the Button Menu and will add some custom design to it. Categories: Product Order page type.
1/5
Win a prize: Slot Machine page type. About: About Us page type. Find us: Map page. Facebook: Mobile page type. Share the app: App Share page type. Order page type for processing the order. ** I'll pick a Blank Template; however, the app that I'm designing now will be added as a template, and you may pick it from our templates page: MobileShop
Building your Mobile Store app Step 1. Since I have already written down all of the app requirements and the needed features (page types), I'll simply add all the needed pages in my app.
Step 2. In the navigation settings I've chosen the "No Tabs" option because I don't need tab buttons in my app. However, feel free to pick Native or Custom tabs if you need them, this is up to you. Now I'll start to customize the "Landing page" of my app which is index.html .
Using the Button Menu page is really easy (TUTORIAL). However, I'll design 2 custom buttons in it with our Layout Editor â&#x20AC;&#x201C; One will be for the Product Order page and the second one for the Order page type.
Final result:
2/5
Step 3. In this step, I'll configure the ordering feature in my app.
Result:
3/5
**Please note: If you're developing this app for your customer, you may provide him with a restricted access to the app for updating his available products without "touching" the app design and app settings.
4/5
Step 4. In the last step, I'll configure the pages used in my app.
Š 2016 ă&#x20AC;&#x20AC; Copyright | Tecstar Group
5/5
4.3 Coffee Shops App Template creatusapps.net/blog/coffee-shops-android-iphone-app-template/
By Javier Create an Android, iOS or Kindle app for your Coffee Shop, Restaurant or Bar. Find nearest to you coffee shop. See locations on the map.
Find nearest to you coffee shop. See locations on the map.
This template uses 4 new pages type:
Grid MENU type page
1/7
1. To change the background color for each menu item in Grid MENU please set it in Background Color Item field:
2. Also you are able to change the text color in Text Item Color field:
3. transparence in Opacity field using values from 0 to 1:
4. Add ( +), Delete (–), Move(
) menu items:
5. Each item has some properties ( item name, item image and item link to another page), that you can customize:
LOC Finder type page
NOTE: This page type requires CreaTusApps App v.2.9
"Location Finder" is a native page type that has an XML source (see example below) with locations and 3 predefined search fields:
NAME – text field – filters against the name of the location TYPE – choose value from a list – filters against the type of the location WHERE – pick a location on the map – orders the results so that the closest location is at top of the list and the furthest is at the bottom
As an input source it uses an XML that can be either stored locally on device or can be pulled from a URL. The source xml (filename or URL) is specified on CreaTusApps website.
Pressing the “FIND” button will filter the source XML based on searchable data. The resulted list is displayed is displayed in a native table.
Choosing any item in the table will show it on the map.
There is also a “Show all on Map” button below the list that will show all locations on the map simultaneously.
Each location on the map can be pressed and some additional data about the location will appear.
2/7
Sample XML <document> <location> <name>Paris</name> <latitude>2.350987</latitude> <longitude>48.856667</longitude> <target></target> <type>capital city</type> <imageurl></imageurl>
<description>France</description> </location> <location> <name>Moskow</name> <latitude>55.755786</latitude> <longitude>37.617633</longitude> <target></target> <type>capital city</type> <imageurl></imageurl>
<description>Russia</description> </location> <location> <name>Tokio</name> <latitude>35.689488</latitude> <longitude>139.691706</longitude> <target></target> <type>capital city</type> <imageurl></imageurl>
<description>Japan</description> </location> <location> <name>New York</name> <latitude>40.714353</latitude> <longitude>-74.005973</longitude> <target></target> <type>big city</type> <imageurl></imageurl>
<description>US</description> </location> <location> <name>Sydney</name> <latitude>-33.868901</latitude> <longitude>151.207091</longitude> <target></target> <type>city</type> <imageurl></imageurl>
3/7
<description>Australia</description> </location> </document>
– It can NOT be used on a TAB
– The searchable fields are hardcoded, i.e. name, type and location are the only 3 fields that can be used, NO field can be either added or removed.
Magazine MENU page type
1. To add (+), to delete ( –), to move ( Magazine
) items please use
Menu Items window:
2. Similar to Grid MENU page each item has some properties with some new added properties ( item image, item title, item link to another page and item short description), that you can customize:
3. To change the general style for this page (background-color, textcolor, link-color), please use the link above Save button:
Stripes MENU page type
1. To add (+), to delete ( –), to move (
) items please use Strips
Menu Items window:
2. Each item has some properties ( item image, item title and item link to another page), that you can customize:
3. To change the some general style for this page (background-color, text-color, link-color), please use the link above Save button:
4. To set a page title, please enter in HTML edit mode and delete the HTML comment <!– and –> after that write a page title:
4/7
5. If you want to change more properties (item background color, opacity, line height, text-color, font size ) for this page, please do it in style.css
via Design Properties and make all changes in .StyleWebKitPanel classes.
Š 2016 ă&#x20AC;&#x20AC; Copyright | Tecstar Group
5/7
6/7
7/7
1.1 How to sign up for a subscription plan? creatusapps.net/blog/how-to-sign-up-for-a-subscription-plan/
By Jorge To activate a subscription with CreaTusApps, please follow the instructions bellow.
Log in to your CreaTusApps.net account and click on Profile to open your profile page:
Click on Subscriptions to manage your current subscriptions:
On your subscriptions page you will be prompted to activate a new one. If no subscriptions have been activated yet there will be no records.
Click ACTIVATE NEW SUBSCRIPTION to proceed:
1/4
Select a subscription plan by clicking on Change to different plan from the bottom:
Next you will be redirected to the Subscription Plans page where you have to sign up.
2/4
Payment by PayPal and Credit Card is available.
Choose payment method that you prefer and you will be redirected to either PayPal or Credit Card. Login under your account and make payment. Payment amount includes the first monthly fee (charged monthly) and the activation fee (paid once).
After payment has been completed view of your Subscriptions page will change. Your current subscription, its status, recurring amount, etc. will be displayed:
Once subscription has been activated you can add app(s) to your payment plan. Click on (View) to view apps covered by your subscription. Under the list of apps click on link to add an application to the plan:
3/4
Select from your projects the app that you want to add and click ADD button:
Once the app has been added it will be displayed in the list of your apps covered by the current subscription:
Until first build/submission to App Store has been ordered, app can be removed from plan. After your build request is processed the app becomes locked in the plan.
Š 2016 ă&#x20AC;&#x20AC; Copyright | Tecstar Group
4/4
5.1 How to create a Distribution Certificate? creatusapps.net/blog/how-to-create-a-distribution-certificate/
By Javier This tutorial is a step-by-step instruction on how to generate a Distribution Certificate (.CER) file on Apple provisioning portal in order to build and submit your application from your account. You don't need a Mac to do this. A computer with any of our supported browsers will work.
NOTE: You must be enrolled into Apple iOS program at http://developer.apple.com/programs/ios. Learn how to create production certificate for Apple Push Notification service here.
1) Login using your dev account credentials on http://developer.apple.com/ios. Go to "iOS Dev Center"
2) On right side menu click on "Certificates,Identifiers & Profiles"
3) On left side menu click " Certificates" (or follow direct link http://developer.apple.com/ios/manage/certificates/team).
4) On left side menu click on " All"
5) Click on this button for add new.
6) Choose "App Store and Ad Hoc " and click button "Continue".
7) Next step click button "Continue".
1/3
8) <<< CLICK HERE >>> to download "request.csr" certificate request file and save it on your computer
NOTE: If you have a Mac, DO NOT generate a new .csr file. Use downloaded request.csr
9) On Provisioning Portal click "Upload File" and upload "request.csr" you downloaded in previous step
NOTE: depending on your browser, this button may be "Choose File" or something else.
10) Select request.csr file you saved in previous step and click "Generate"
11) Click on Download button
Š 2016 ă&#x20AC;&#x20AC; Copyright | Tecstar Group
2/3
3/3
5.2 How to create a Distribution Provisioning Profile (.mobileprovision)? creatusapps.net/blog/how-to-create-a-distribution-provisioning-profile-mobileprovision/
By Jorge This tutorial is a step-by-step instruction on how to generate a Distribution Provisioning Profile (.MOBILEPROVISION) file on Apple provisioning portal in order to build and submit your application from your account. You don't need a Mac to do this. A computer with any of our supported browsers will work. You need a .MOBILEPROVISION file for every application you want to submit to the AppStore. Please repeat these steps for every application.
1.Login using your dev account credentials on http://developer.apple.com/iphone.
2. On the right side menu click on "Certificates, Identifiers & Profiles" section.
3. Pick the "Certificates" section (or follow the direct link http://developer.apple.com/ios/manage/certificates/team).
4. Click on the "App Id" tab in order to create it.
5. Click on the "+" button for adding the new App.
6. Enter your application name in the App Name box
7. Specify the Bundle Identifier as com.[your_domain_name].StyleM if your AppID is StyleM. (replace [your_domain_name] with a valid name) This Bundle Identifier is case sensitive. Make sure you'll use the same lower/upper case letters, exactly as your AppID appears on SeattleClouds. Use the Application ID you specified when you first created your app on SeattleClouds. This AppID is listed under the My Application tab.
8. Click the "Continue" button and in the last step click on the "Submit" button.
9. On the left side menu select " Provisioning Profiles". Then select the DISTRIBUTION tab.
10. Click on the "+" button for adding a new Mobileprovision.
1/3
11. Select the Distribution Method to be " App Store". Then click on the "Continue" button.
12. Select your Bundle Id then click the "Continue" button.
13. Select the Distribution Certificates that will "sign" this provisioning profile, then click on the "Continue" button.
14. Name your mobileprovision file (Ex: yourAppID_profile). Click the "Generate" button.
15. Click on the "Download" button and save this file on your computer.
Now you should have a .MOBILEPROVISION file saved on your computer. Remember its location as you will need to upload this file to request a submission for your application on CreaTusApps.
Š 2016 ă&#x20AC;&#x20AC; Copyright | Tecstar Group
2/3
3/3
5.3 How to generate an APN Certificate (.cer) file in order to enable Push Notification? creatusapps.net/blog/how-to-generate-an-apn-certificate-cer-file-in-order-to-enable-push-notification/
By Javier This tutorial is a step-by-step instruction on how to generate an APN Certificate (.CER) file on Apple provisioning portal in order to enable Push Notifications. You don't need a Mac to do this. A computer with any of our supported browsers will work.
1) Login using your dev account credentials on http://developer.apple.com/iphone.
2) On the right side menu click on "Certificates, Identifiers & Profiles" section.
3) Pick the "Identifiers" section (or follow direct link https://developer.apple.com/account/ios/overview.action), and you'll be redirected to the App ID's section.
4) In this step you'll need to pick the "App Id" that you created before. If you have not yet created it, please read this tutorial and follow the steps 7 to 10.
5) Select your App ID and click on the Edit button.
6) Enable the Push Notifications checkbox
1/5
7) <<< DOWNLOAD apnrequest.csr >>> certificate request file and save it on your computer.
2/5
8) Click on the "Create certificate" button for Production Push SSL Certificate and in the next step just click the "Continue" button.
9) Choose the .CSR file you've just downloaded in step 8.
**Please note: Using our .csr file is Required. If you use your own .csr for Push Notifications this option won't work in your iOS app.
Click on the "Generate" button.
10) Click on the "Download" button to download your certificate
3/5
Save aps_production.cer on your computer.
11) Click the "Done" button.
If everything was done right, you should have a file named aps_production.cer saved on your computer. Please remember its location. You need to upload it on Push Notifications page from Dashboard of your application.
12) * APN Certificate needs to be renewed once a year. Contrary, Push Notification option won't work. To renew the certificate you need to go to Identifiers section and in App ID find the application by its name or ID you have previously set.
13) You can find out that the PN is expired if it has Configurable status. Press Edit button to renew the APN certificate for your application.
14) To renew the certificate follow the Steps from 7 to 11.
15) It is really important to renew the Provisioning Profile for your application because now it has Invalid status. For that go to Provisioning Profiles in All field.
4/5
1) Find the application by its name and press Edit.
2) Generate a new Provisioning Profile and download it.
With updated certificates you can request a new submission for your application.
Š 2016 ă&#x20AC;&#x20AC; Copyright | Tecstar Group
5/5