A full front-end AngularJS template for WordPress Rest API.

Getting Started

Install FrontPress using NPM:

npm install frontpress --save

• Import angular and frontpress to your project.

<script type="text/javascript" src="/node_modules/angular/angular.min.js"></script>
<script type="text/javascript" src="/node_modules/frontpress/release/frontpress.min.js"></script>

Install FrontPress using Bower:

bower install frontpress --save

• Import angular and frontpress to your project.

⚠️ remember to install angular 1.x.

<script type="text/javascript" src="/bower_components/angular/angular.min.js"></script>
<script type="text/javascript" src="/bower_components/frontpress/release/frontpress.min.js"></script>

Configure your project to use FrontPress

• Add frontpress to your required modules list:

angular.module('myBlog', ['frontpress']);

• Configure your module using $FrontPressProvider !

angular.module('myBlog').config(function($FrontPressProvider){

	$FrontPressProvider.configure.load({
		"restApiUrl": "https://demo.wp-api.org/wp-json",
		"apiVersion": "v2",
		"pageSize": 5,
		"infiniteScroll": true,
		"routes": {
			"post": "/:postYear/:postMonth/:postDay/:postSlug",
			"home.pagination": "/page/:pageNumber"
		},
		"titles": {
			"post": ":postTitle - :siteName",
			"home": "Home - :siteName"
		},
		"overrides": {
			"siteName": "My Awesome SPA Blog"
		}
	});
	
});

It's done!

Further relevant informations

• How can I discover my restApiUrl?
• How to use FrontPress for Wordpress api version 1?
• What configuration is required?
• All configuration options
• What is a SPA and why you should care about it?
• Readme for FrontPress core developers

License

MIT © Teles