npm

Need private packages and team management tools?Check out npm Orgs. ¬Ľ

nuxt-wp-json

1.0.4¬†‚Äʬ†Public¬†‚Äʬ†Published

nuxt-wp-json


ūüíę Wordpress REST API plugin for Nuxt.js with out-of-box routing and SSR data handling ūüíę



Installation


A. Nuxt.js


1. Go to your app's main directory and run:


npm install nuxt-wp-json

or

yarn add nuxt-wp-json

2. Go to your app's nuxt.config.js and register the package as a Nuxt.js module


export default {
  ...
  modules : [
    'nuxt-wp-json', {
      config: {
        url: 'http://your-wordpress-url.com/',
        pages: {
          home: "home"
          // Here put pairs like - routeName: "slugInApi"
          // Then plugin will download page structure from /wp-json/wp/v2/pages?slug=home-page when current route is called 'home'
        },
        menus: [
          "first-menu-slug",
          "second-menu-slug"
          // There provide your menus' slug, if you have only one menu, provide it as string. If you do not have any menu, set to false or just delete this key
        ]
      }
  ]
  ...

B. Vue.js


If you want to use this module without Nuxt.js, you can use core package that this module is based on available here: vue-wp-json


C. Vue Storefront


Usage


Pages


All you need to do to create new Page's route in your app is to create it in Wordpress Admin in Pages tab. It will automatiaclly be available under /page/<:page_slug> route.


Posts


The process is the same as above. You just need to create and publish new post in Wordpress Admin at Posts tab. It will automatiaclly be available under /post/<:post_slug> route.


Media


To be written.


Menus


To be able to use WordPress Menus in your app, you have to install additional plugin in your WordPress - WP-REST-API V2 Menus plugin. It extends native Wordpress REST API by adding a new endpoint with menus at /wp-json/menus/v1/menus/. After you have added the plugin vue-wp-json will automatically detect and store your menus at:


store.state.wp_rest_content.menus[YOUR_MENU_SLUG]
this.$store.state.wp_rest_content.menus[YOUR_MENU_SLUG]

Advanced Usage


More information about additional features available with PRO version of module will be available here: https://vuejs.shop/modules/vue-wp-json-pro


Additional modules (Coming soon)


Free Extensions



Yoast SEO Extension (Coming soon)


https://github.com/new-fantastic/vue-wp-json-yoast


qTranslate Extension (Coming soon)


https://github.com/new-fantastic/vue-wp-json-qtranslate-x


PRO Extensions



Advanced Custom Fields Extension (Coming soon)


https://vuejs.shop/modules/vue-wp-json-acf


DIVI Page Builder Extension (planned for Fall 2019)


https://vuejs.shop/modules/vue-wp-json-divi

install

npm i nuxt-wp-json

Downloadsweekly downloads

17

version

1.0.4

license

MIT

homepage

github.com

repository

Gitgithub

last publish

collaborators

  • avatar
  • avatar
Report a vulnerability