Home | Archives | Blog | Articles | Categories | Sitemap | Contact | Terms | Privacy | About Me

App Favorites Bookmarking Tutorial How To Add A Favorites List To Your Mobile App

Favorites page screenshotHow many times have you bookmarked a page so you could return to it later? A lot probably. Recently some app users asked if I could add this feature to my mobile apps.

Yes sir, you bet, right away, no problem. Three working days later the update rolled out. Geez, that was a lot of hard work, hope you like it. A tutorial could save other developers some time.

Here is how to add app favorites bookmarking to your Miappmaker.com mobile app. First thing you need is the favorite pages and second you need a bookmarking icon or button to place in the content pages.

If your app is small this task only takes about an hour to do. If your app is larger the time scales up accordingly. The more pages the longer it takes. Because this task can be repetitive you to get it right everytime.

App Favorites Bookmark Tutorial

Edit Pages built in Miappmaker builderStep 1. Navigate to your app in the builder. Open it up and go to 'Edit Pages' tab. This action opens the 'Edit Application Pages section of the builder. You are then presented with all the pages in the app and tools to manipilate them.

Edit Application Pages wizard.Step 2. Click on the + icon to add a new page. This opens the page library. In the page library scroll down till you see "Favorites' page. Select it and click 'Next' to continue.

Select Favorites page type.

Name your pageStep 3. give the new page a name.

The page has a default filename of 'favorites1,' Feel free to change this if you like.

All pagetypes in the library are intuitively named. You could easily accept the given name. Be aware that subsequent page additions will increment the number. So the second favorites page would be named 'favorites2' and so on. But only if you accept the default.

Selecting 'Add Page' inserts the page into the app and moves you to the page for editing.

Select Header LogoStep 4. 'Edit favorites Player Page' is opened. There are only 2 options available on this page. Header image selection and enable dynamic data. You may want to include a header logo or not.

Dynamic data allows you to edit the source code on the page. I recommend this for advanced programmers only. Leave this box unchecked for best results.

Your favorites page is now ready to accept bookmarks.

Add App Favorites Bookmarks To Your Pages

Edit a page to add the bookmark iconStep 5. At this stage you need to add the app favorites bookmark icon to your pages. You will want to add this icon to every content page in the app.

Select your first page to edit. Locate where you want to add the icon and place your cursor there. This will be the insertion point for the icon. You must be in the "Design' tab of the simulator/editor. The toolbox on the right will be active when in design mode.

After locating your insertion point click on the heart icon at the bottom of the tool box. Fill in the dialog box. Then Click save. This will insert the icon.

Select 'Favorites' icon

Favorites dialog boxStep 6. Fill in the favorites icon dialog box.. This dialog box allows tou to add a title, link, image and icon size on the 'Favorites' page.

This title is different from but should be the same as the page's name. You can squeeze in extra information in this title as it can occupy a fair amount of room on the 'Favorites' page.

Select the size height and width of the image displayed on the 'Favorites' page. The default is 24 and is a good size.

Select a link to go to when the favorite is selected. It should be the same page that you are editing but could be different.

Select an image to go on the 'Favorites' page. It should be related to the page in the link option.

Favorites icon added to titleStep 6. You should now see the 'favoritesoff' icon. This icon along with the 'favotite' icon are automatically added to the app. You may change these by uploading your own icons.

When the favoritesoff icon is tapped the page is added to the 'Favorites' list and the icon switches to 'favorite' icon. indicating the pages is selected.

You will have to do this procedure for each page that you want to favor.

Favorite off iconThis icon is displayed on pages that have been not been added to favorites list.

Favorite selected iconThis icon is displayed on pages that have been added to the favorites page.

Add a link to your favorites page.Step 7. add a link to the app favorites page on your home page. Of course you want users to find and use the favorites feature. I recommend you add a link to the page on your main menu.

Users will use this feature, believe me. Especially if your app contains a lot of information. A 'Favorites' page makes it a lot easier for users to return to the app. Make sure your link is prominently displayed.

Thanks for reading App Favorites Bookmarking Tutorial. If you have questions feel free to contact me.

See Also:
Mobile App Tutorial - for beginners. Teaches you the basics of making a mobile app.
Mobile App Builder - tutorial teaches you how to begin making your own mobile app.
Mobile App Editor - tutorial teaches you how to use the editor to configure and modiy your app.
Mobile App Graphics - tutorial teaches you how to create icons for the App Stores.
Mobile App Previewer - tutorial teaches you how to use the previewers to test your mobile app.
Mobile App Publisher - tutorial teaches you how to use MiAppMakers publishing tools.

: Mobile App Tips : App favorites bookmarking allows users to quickly find pages. Learn how to add a favorites book mark and icon to your mobile app. Tutorial teaches with step by step instructions.

top of the page

Inside Miappmaker

Follow me on Twitter Follow me on Twitter. Follow me on Blogarama Follow on Blogorama
Google Plus

Rss/Blog Feed

Mobile App Blog

↑ Grab this Headline Animator