justiceo / angularize-wp

Super-charge WordPress with AngularJs components

Angularize WordPress

Super-charge your WordPress site with AngularJs components. For example, loading all sidebar widgets, banners and sliders, ads, forms etc.

Hello World component

Below is a complete (with script tag) example of an angular component in a WordPress site.

<script type="text/javascript">
  document.addEventListener("DOMContentLoaded", function(event) {
    angularize.component("echo", {
      template: 'Hello World!',
      controller: function() {}
    })
  });
</script>

Now, anywhere you enter the tag <echo></echo> in your WordPress site (posts, pages, widgets etc), you will get the text Hello World!

Stack

AngularJs, ES6, Babel + Browserfiy, Gulp, Karma + Jasmine

Quick start

# clone the repo
$ git clone https://github.com/justiceo/angularize

# change directory to your app
$ cd angularize

# install the dependencies with npm
$ npm install

# Ignore updates to app.templates.js
$ git update-index --assume-unchanged src/core/app.templates.js

# start the server
$ npm start

go to http://localhost:3000 in your browser.

Developing

• single run: npm run build
• build files and watch: npm start

Testing

• single run: npm test
• live mode (TDD style): npm run test-watch

Plugins that Interfer with Rest Api

• Wordfence security: the most popular security plugin on wordpress.
  • When enabled, some requests incorrectly return a 404
  • An example request would be localhost/wp-json/wp/v2/posts/?author=1

License

MIT

Release 1.0.0 Goals

• working documentation
• working demo
• optional inclusion of extra components
• optional inclusion of extra modules
• working tests

todo

• on new-post page, display a loading sign while component loads
• create a build-from-dashboard solution for this project
• Angularize should have an auth endpoint for /login register/ and logout/ - depends on WpObject not collection error above
• Revisions doesn't work
• Settings object works but have WpCollections
• Issue a warning when WordFence is installed

angularize-wp's Issues

Search for category & tag

Both options do not work. They just sort of zone out of the page entirely till you click on the featured image again. Thought we'd be going with a dropdown for the categories actually.

Tags and categories

It'd be best if we made the category a dropdown so people can see all the categories in the site as opposed to having to type in a letter to see a list.

About tags, users should be able to add new tags themselves and not rely solely on what's available

Plugin affects display of grid layout

The plugin shows just one side of the blog layout grid and halves that entire page in general.

Image insert in posts not working

It's not possible to insert an image within posts (not featured image). Tried severally with the image button in the toolbar, nothing happens

Category & tag selection

Making categories a dropdown, where a user can actually see a list of available categories and click to select will be much easier and let them know all the categories beforehand.

For tags, they should be able to add new tags themselves and not have to just select from old ones.

Insert image

Cant find any option to insert media anywhere on the page

Unpredictable behavior with cache disabled

And mind you, some browsers do not support local storage while some users have it out-rightly disabled

Post published/submitted for review

Upon clicking save and publish, nothing really shows the post has been submitted. Some sort of success message will be best. Also posts have to be submitted for review first!