Various options in AEM integrated with AEM Mobile On-Demand Portal

Various options in AEM integrated with AEM Mobile On-Demand Portal

'View Properties' : This helps to view and edit the content settings for article, banner and collection.

'Upload' : Upload helps to upload the newly created/ modified article/banner/collection to AEM On-Demand Portal.

'Add to' : Specific to articles & collections. The selected article gets added to a collection which is mentioned in next step.

'Publish': Helps publishing the content to AEM Mobile and directly to an APP.

'Un Publish': Helps un-publishing the content from AEM Mobile and directly to an APP.

'Unlink': Unlink the selected items link between local(AEM) and remote instances of the content.

'Delete': Delete the item from AEM Mobile. On clicking 'Delete' provides an optional checkbox to delete item from 'AEM' also.

'Upload Shared Resources': This helps to upload the HTML common resources of the App of AEM to the common HTML on Experience Manager Mobile.

'Preflight': This helps to preflight all content, collections and layouts on device using a preflight app created from Experience Manager Mobile.

Change the configuration of AEM, AEM Mobile mapping
Clicking on gear icon to update the configuration as shown below section.

Go to the mapped AEM Mobile account from AEM by clicking on 'dots' as shown below.

Click on image to see it big

Read More:

1. AEM Mobile Overview

2. AEM Mobile Integration with third party application for authoring

3. AEMM: How to create custom authentication

4.  AEM Mobile(AEMM) Applications - FAQ

5. AEM Mobile Desktop Web Viewer

6. AEM Mobile Access Protections at collection , article levels

AEM Mobile Search

All what you need to know about AEM Mobile search

AEM Mobile search functionality
AEM Mobile provides a search feature for its app on menu bar once enabled. When you enable search indexing, article metadata is indexed on article creation.
This is a one time 'on' service which cannot be disabled once enabled. The content gets indexed from then. It can be individually enabled or disabled for different type of apps like 'production app' or preflight.

How to enable search in menu bar of AEM Mobile app?
Go to project settings> Select the project , click on 'Edit Project' from top left corner, select the tab 'Search'

I have enabled the search but I am unable to get results.

To enable search in your mobile app, you must rebuild it by selecting the app, clicking the edit icon, and clicking Submit.

What data is searchable in AEM Mobile?

Article metadata gets indexed in search (which are public facing). Internal properties such as 'Internal Keywords' or 'Article Name' are not indexed. Based on metadata of published articles, for e.g. title, category, author, department etc. If an articles metadata field includes the search string, the article appears in the list of search results.

Note: Search index also does not cover selection items such as 'Metered' (Property of Article Access) or 'High' (Property of Article Importance) - which are internal properties. Items tagged with 'Restricted' are hidden from search results unless the user is signed in and has access to it.

Search and indexing language configuration

Search configuration provides option to configure the index language at project level and article level. We can edit individual articles to override the default project language setting at lower levels. During content search, an article will appear in search results only if its language setting matches the device language setting. For e.g., if the device language is German, articles indexed in French language will not appear in search results.

What is the template layout of search? 
Default Layout in the Layout Templates section of the Portal is used to display search results. It can be changed by modifying the default layout to a specific layout as per the requirement.

Read More:

1. AEM Mobile Overview

2. AEM Mobile Integration with third party application for authoring

3. AEMM: How to create custom authentication

4.  AEM Mobile(AEMM) Applications - FAQ

5. AEM Mobile Desktop Web Viewer

6. AEM Mobile Access Protections at collection , article levels

Create & Sign Android apps for AEM Mobile on Windows OS(.apk files)

Create & Sign Android apps for AEM Mobile on Windows OS(.apk files)

Go to On Demand portal 'Apps' click on 'create' button select the type of app which you want to create (android)

Fill out basic mandatory fields. At present the mandatory fields are given below.

App Details : App Name, Bundle ID are mandatory
Assets Tab : App Icon

Once basic fields are entered, click on 'Submit', this creates an unsigned version of your AEM Mobile app.


Android app creation 

To create an installer we need below requirements in addition to Java (version 7 or later) installed on our machine.

• The unsigned .apk file downloaded from the Apps section of the Portal.
• A valid .p12 certificate for signing Android apps.

Create a .p12 certificate 

If you have java installed and configured on your windows machine, just enter below line on command prompt and press enter(by replacing 'yourcertificatename' with a proper name)
keytool -genkey -v -keystore yourcertificatename.key.p12 -alias alias_name -keyalg RSA -storetype pkcs12 -keysize 2048 -validity 10000

You now will have a certificate created on your windows/users/ folder.

Download the Unsigned app from 'Apps section'

Click on image to see it big

Download the AEM Mobile Signing Tool.  Click on icon in the upper right corner of the Apps section(Both iOS and Andriod works on same tool).

Install the Signing tool

Launch the App Signing Tool

Enter the details of the app to be signed, certificate to be referred while signing, with its password, click on 'Sign application'

A new app is created at the same location as the source app which is signed.

Move the signed app onto your device and install it, you will have the app installed on your device.

You can also submit the signed app to the android or iOS store.


Debug

If you face any error in signing the app, you can go to Signing in tool installed directory, 'AEM Mobile Signing Tool', open 'aemm-sign-tool.log' file in notepad and search for any error.

Read More:

1. AEM Mobile Overview

2. AEM Mobile Integration with third party application for authoring

3. AEMM: How to create custom authentication

4.  AEM Mobile(AEMM) Applications - FAQ

5. AEM Mobile Desktop Web Viewer

6. AEM Mobile Access Protections at collection , article levels

AEM Mobile Access Protections at collection , article levels

AEM Mobile Access Protections at collection , article levels

AEM Mobile uses the section 'Entitlement' to specify whether the users have permission to access content. Entitlement is determined at the collection level, and is based on the product that is associated with the collection.

[Click on images to see it big]

Each collection, segregated into 3 types of access. They are 'Free', 'Entitlement Required', 'Restricted'

Free	Entitlement Required	Restricted
Available to all users regardless of article settings	Appears in the app, but metered or protected articles, which requires payment or sign in(Usually paid contents/collections are not hidden.)	They are hidden until the user signs in to gain access.
.	Entitled collection provides option to edit article properties to determine whether the Article Access option is set to Free, Metered, or Protected	.

  Article Access Levels : This is set to collections that are set to Entitled or Restricted.

Free	Free Articles are available for all users to view(Even if the article is in a collection set to Entitled).
Metered	Metered articles are available for a specified period of time. Entitled collection allows users to view an article preview until they reach the specified threshold. When the threshold time elapses at the specified Start Time, users can view metered articles again
Protected	The articles which are paid. A user sees a payment option when viewing an entitled or restricted collection

 

 Configuring threshold for metered articles

In project settings, Enable the Article Preview in the Content tab, and specify threshold settings as below.

Free articles are always visible if Enable Article Preview is not selected. Select the 'Enable Article Preview' option to allow users to preview articles in an Entitled collection. If the articles are set to Metered, non-entitled users can preview articles until they reach the threshold that we specified.
If the user signed in or purchased the collection, the protected articles in entitlement collection are enabled. Else protected articles are obscured by a payment option.

Threshold time in action - 'Dwell Time'
Dwell time is used to consider whether the threshold is reached when a user stays on an article for a period of time. Below are the measurement criteria,

• For Tablet - 25 seconds
• Mobile - 15 seconds

A user who just swipe and pass through articles are not considered for threshold time.

Read More:

1. AEM Mobile Overview

2. AEM Mobile Integration with third party application for authoring

3. AEMM: How to create custom authentication

4.  AEM Mobile(AEMM) Applications - FAQ

5. AEM Mobile Desktop Web Viewer

6. AEM Mobile Access Protections at collection , article levels

AEM Mobile Desktop Web Viewer

AEM Mobile Desktop Web Viewer

Adobe AEM Mobile provides a desktop web viewer option for developers to test the content directly on desktop device , instead of testing them on Mobile. Web Viewer will have all features enabled which is available in mobile like navigation, entitlements, layout and collection listing etc.

How to configure AEM Mobile Web Viewer?

From the AEM Mobile on demand portal once logged in, go to ,

APPS> Create > Desktop Web Viewer. You will have a form with configurations enabled as seen in image. Leave all the fields blank without filling any information if you want to see the desktop version on Adobe hosted URL. Click on 'Submit', which will create Desktop Web Viewer.

How to access the Adobe Hosted desktop web viewer.
Click on the 'URL' which is accessible on 'Apps' section. This opens up the desktop web viewer on another tab. Keep the URL handy so that you can access it next time.

Login required for the desktop web viewer?
No. Once configured and content is available, you can just access the url to view content without login again.

How do we configure our own site?
If we need to configure the desktop version through our site, ensure we have secure version of url (https://). Configuring this will provide us the url with our custom domain. Please note no content or data is moved to custom domain when we do this, it just gives a url which shows the user appear content is stored in custom domain.

Additional points:
Ensure you have all the articles and collections in published state before creating the Web Viewer. Till you publish it, the content will not be visible on desktop.

Preference of content in web viewer: Say we have both tablet and phone collections, the collection for tablet is displayed in web viewer.

Need to have internet connectivity to see the content on web viewer, no offline mode as in mobile.
Web viewer will always have the latest content displayed, since it is an online connection. No 'Update Available' option.

Desktop web-viewer works only on desktop browsers, not mobile devices


Disabling web viewer?
Clicking on delete icon after selecting the web viewer will delete and disabled the viewer.

Can we have multiple web viewers?
No , we cannot have multiple web viewers, once a web viewer is created it disables the web viewer option creation from App's Menu.

AEM Mobile(AEMM) Applications - FAQ

AEM Mobile(AEMM) Applications - FAQ

Why Mobile Apps?
Now a days mobile applications are getting wide acceptance because of their capability to deliver personalised content. Responsive websites are normally generic type but mobile application deliver better engagement thus better efficiency.

Why AEM Mobile?
Adobe Experience Manager Mobile gives us ease of development, complete control over the user experience and allows us to design and build apps quickly for clients. AEMM provides better automation of the publishing of latest content and data into the apps, while authoring is a built in support. This  feature helps to keep the app any time and when user opens the app it automatically updates the latest content.

Backbone of AEMM is the strong design. Combining efficient development by utilising the Adobe cloud tools provides a better AEMM application. AEMM avoids the lengthy native app development process. AEMM also takes advantage of multi-channel publishing to the web and mobile apps like AEM published content, assets etc.

There are cases where clients sanction fund for new applications and it take months to get a bsic version of application. AEMM helps clients to deliver an app with the relevant content in weeks.

What are all the ways of authoring/ adding content to an AEMM application?

AEM Mobile cloud provides a beautiful authoring environment where user can login and add content.
Cordova enabled development efficiently allows adding new layouts and content to system.
AEM Mobile also provides API's, through which any custom developed application can author the content in AEM Mobile.

Technical knowledge for AEM Mobile development
Any one who knows Java script with front end can work on AEM Mobile development. AEM knowledge is an added advantage because content authoring comes in picture.
People who are good at mobile development using Cordova knowledge are best fit for this job.

Is it possible to develop personalised content in AEM Mobile?
The answer is yes. AEM APIs provide option for sign in and integration with various Adobe cloud tools like analytics. This helps clients to configure custom content for each user.
AEM Mobile provides various dynamic banner, collections, layouts which can be configured using cordova apis through keywords and meta tags. This provides a better personalised content.

AEM knowledge is mandatory for AEMM Development?
AEM knowledge is an added advantage but not mandatory.

Where are we can find more useful tips on AEM Mobile and related development?
Below are some of the best helpers available:
https://helpx.adobe.com/digital-publishing-solution/topics.html
http://blogs.adobe.com/aemmobile/

Can we have any type of content in AEM Mobile?
Yes We can have any type of content like text, image, video, pdf , documents etc.

Can we search in AEM Mobile Application?
Yes. AEM Mobile provides an inbuilt search which needs to be enabled from admin console. Once enabled search box appears in header and enables any type of content search.

Does AEM Mobile support login?
Yes. AEM Mobile support login using AEM Mobile provided API.

Do we need license to create an AEM Mobile app?
Trial versions are available for AEM Mobile development. By registering we can get trial access, but to develop a commercial app, we need paid license from Adobe.

Can we extract the articles from .article file?
Yes. Use 7 zip or any extractor.

What is preflight app?
Preflight app is a mobile app which helps to test(preview) the AEMM developed app in mobile devices by configuring the Adobe id. All the app which are assigned to a specific Adobe id can be previewed through this app.

Preflight mode enabled while creating an app? sign in/entitlement related will not work  - in web url it will appear but it doesnt allow to login.

Read More:
1. AEM Mobile Overview


2. AEM Mobile Integration with third party application for authoring


3. AEMM: How to create custom authentication


4.  AEM Mobile(AEMM) Applications - FAQ

AEMM: How to create custom authentication

There are cases where we need to use custom login screen other than the login UI provided by AEMM. In such cases we need to use generic auth method in AEMM with custom UI hosted in our own server. Below given the approach.

We need to have our own API authentication mechanism running to achieve the functionality. In this case our system exposes an API which gives status as success or failure while authenticating in JSON format

Click on image to see it big

Step 1:
Create a login form which accepts user credentials

<form onsubmit="loginfunctioncall();"> 
Username: <input type="text" /> 
Password: <input type="text" /> 
<input type="submit" /> </form>

Step 2:
Add a post method which takes the response and  collects user info. This info is processed to respective format as our API requires.
Do a post call and get response.
Process the response(JSON format) back from POST and check the authentication is success
If authentication is success, redirect the user to app home screen, else alert user with an error message


<script>
function login() {

//process response and if authentication is success, set the success to true
var success = true;
var authToken = 'AUTH_TOKEN_BASED_ON_USER_LOGIN';
if (success && authToken) {
window.location = appData.redirectUri + '?authToken=' + authToken;  } else {
window.location = appData.redirectUri + '?error="Internal Error"';  } }
</script>