Build Mobile Apps with WordPress using PhoneGap / Cordova - Part 1
As per reader suggestion, I'm going to write the article for how to build mobile apps with WordPress using PhoneGap / Apache Cordova.
Requirements:
- A WordPress Blog
- Wordpress - JSON API (Plugin)
- WordPress - JSON API User Plugin
- Cordova CLI / PhoneGap Build
- Jquery
[download src="https://codesundar.com/wp-content/uploads/2016/10/wordpress.zip" text="DOWNLOAD SOURCE CODE"]
Step 1: Setup WordPress Blog
- Login to your WordPress blog
- Add Wordpress JSON API (Plugin) Plugin
- Activate plugin
- validate Plugin using
yourwebsite.com/?json=get_recent_posts - It will return the latest post from your blog (10 recent posts) as JSON
Step 2: Creating Cordova Project & Edit code
-
Create New project using Cordova CLI
cordova create WordPress com.phonegappro.wordpress WordPress
-
Change your working directory
cd WordPress
-
Add your platform
cordova platform add android cordova platform add ios
- Edit your index.html
<script type="text/javascript">
$(document).ready(function()
{
var url="http://yoursite.com/?json=get_recent_posts";
$.getJSON(url,function(result){
$.each(result.posts, function(i, field){
var title=field.title;
$("#listview").append("<li><h2>"+title+"<h2></li>");
});
});
});
</script>
<ul id="listview"></ul>It'll append all title into div id #listview