• Stars
    star
    180
  • Rank 206,095 (Top 5 %)
  • Language
    PHP
  • Created about 4 years ago
  • Updated 2 months ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

❤️ A WordPress plugin that adds features to use WordPress as a headless CMS with any front-end environment using REST API

Headless CMS

Project Status: Active.

A WordPress plugin that adds features to use WordPress as a headless CMS with any front-end environment using REST API. This plugin provides multiple features and you can use the one's that are relevant to your front-end application. You don't necessarily need to use all.

Headless CMS WordPress Plugin

Install via Composer

composer require imranhsayed/headless-cms

Install from WordPress.org

Download and activate plugin from WordPress.org

Maintainer

Name Github Username
Imran Sayed @imranhsayed

Assets

Assets folder contains webpack setup and can be used for creating blocks or adding any other custom scripts like javascript for admin.

  • Run npm i from assets folder to install required npm packages.
  • Use npm run dev during development for assets.
  • Use npm run prod for production.
  • Use npm run eslint:fix js/fileName.js for fixing and linting eslint errors and warning.

REST API ENDPOINT

This plugin provides you different endpoints using WordPress REST API.

Getting Started 📋

These instructions will get you a copy of the project up and running on your local machine for development purposes.

Prerequisites 🚪

You need to have any WordPress theme activated on your WordPress project, which has REST API enabled.

Installation 🔧

  1. Clone the plugin directory in the /wp-content/plugins/ directory, or install a zipped directory of this plugin through the WordPress plugins screen directly.
  2. Activate the plugin through the 'Plugins' screen in WordPress

Example Frontend applications

Example of front-end applications where this plugin can be used:

  1. Gatsby WordPress Theme
  2. React Wordpress Theme

Features

  1. Custom REST API Endpoints.
  2. Social links in customizer.
  3. Image uploads for categories.
  4. Custom header and footer menus.
  5. Custom Widgets.
  6. Custom Header and Footer GraphQL fields when using wp-graphql plugin
  7. Adds coAuthors data in the GraphQL Api.
  • Adds option to add social links in customizer
  • Registers two custom menus for header ( menu location = hcms-menu-header ) and for footer ( menu location = hcms-menu-footer )
  • Registers the following sidebars
  1. HCMS Footer #1 with sidebar id 'hcms-sidebar-1'

  1. HCMS Footer #2 with sidebar id 'hcms-sidebar-2'

More Features

  1. Registers the sections for socials icons in the customizer
  • Social icons urls for 'facebook', 'twitter', 'instagram', 'youtube'

  1. Image upload features for categories
  • Provides Image upload features for categories.

  1. Plugin Settings Page
  • Settings for getting data for a custom page like Hero section, Search section, Featured post section, latest posts heading.

  • Registers custom end points

  1. Following fields when using wp-graphql plugin.
  • Custom Header and Footer GraphQL

  • WooCommerce Countries and States

{
  wooCountries {
    billingCountries {
      countryCode
      countryName
    }
    shippingCountries {
      countryCode
      countryName
    }
  }
  wooStates(countryCode: "in") {
    states {
      stateCode
      stateName
    }
  }
}
  • WooCommerce Shipping Zones.
{
  shippingInfo {
    shippingZones
    storePostCode
  }
}
  • Add Product to Wishlist Mutation ( Authenticated request )
mutation ADD_ITEM {
  addToWishlist(input: {clientMutationId: "example", productId: 340}) {
    clientMutationId
    error
    added
    productId
    wishlistProductIds
  }
}
  • Remove Product from Wishlist Mutation( Authenticated request )
mutation REMOVE_ITEM{
  removeFromWishlist(input: {clientMutationId: "example", productId: 340}) {
    error
    productId
    removed
    wishlistProductIds
  }
}
  • Get Products from Wishlist Mutation ( Authenticated request )
query GET_WISHLIST {
  getWishList {
    productIds
    error
    products {
      databaseId
      name
      slug
      buttonText
      image {
        alt
        src
        attachmentId
      }
      priceHtml
      productUrl
      stockQuantity
      stockStatus
      typename
    }
  }
}
  • Schema Details
  posts {
    nodes {
      seo {
        schemaDetails
      }
    }
  }

Available Endpoints:

Get single post ( GET request )

  • http://example.com/wp-json/rae/v1/post?post_id=1

Get posts by page no: ( GET Request )

  • http://example.com/wp-json/rae/v1/posts?page_no=1

Get header and footer date: ( GET Request )

  • Get the header data ( site title, site description , site logo URL, menu items ) and footer data ( footer menu items, social icons )
  • http://example.com/wp-json/rae/v1/header-footer?header_location_id=hcms-menu-header&footer_location_id=hcms-menu-footer

Get WooCommerce Country and states ( GET Request )

  • /wp-json/rae/v1/wc/countries/
  • /wp-json/rae/v1/wc/states?countryCode=IN

Contributing 👥

Please read CONTRIBUTING.md for details on our code of conduct, and the process for submitting pull requests to us.

Versioning

I use Git for versioning.

Author 📝

License 📜

License: GPL v2

More Repositories

1

woo-next

🚀 React WooCommerce theme, built with Next JS, Webpack, Babel, Node, Express, using GraphQL and Apollo Client
JavaScript
857
star
2

aquila

🎨 An Advanced WordPress theme
PHP
737
star
3

nextjs-headless-wordpress

🔥 Nextjs Headless WordPress
JavaScript
615
star
4

gatsby-woocommerce-themes

⚡ A Gatsby Theme for WooCommerce E-commerce site Gatsby WooCommerce WordPress
JavaScript
587
star
5

gatsby-wordpress-themes

🎨 Gatsby WordPress Theme
JavaScript
339
star
6

react-with-wordpress

🔥 Example of react application to access WordPress REST API
JavaScript
230
star
7

nextjs-woocommerce-restapi

A React WooCommerce Project Example With REST API
JavaScript
199
star
8

google-maps-in-react

📌 Google Maps in React: Autocomplete Location Search | Draggable Marker | Marker Infobox
JavaScript
168
star
9

react-workshop

⚒️ 🚧 This is a workshop for learning how to build React Applications
162
star
10

file-uploads-aws-react-node

📂 A react node and express js project to upload files on amazon web services ( AWS )
JavaScript
98
star
11

advanced-woocommerce-theme

🛍️ Advanced WooCommerce Theme
PHP
70
star
12

react-pwa-workbox-example

react-pwa-workbox-example
JavaScript
69
star
13

react-wordpress-theme

🎨 A React theme for WordPress, using Decoupled Architecture. Front end in React. Backend in WordPress.
CSS
67
star
14

frontity-contact-form-7

🔥 Contact Form 7 extension for Frontity theme.
JavaScript
66
star
15

aquila-features

Advanced WordPress Plugin Development
JavaScript
64
star
16

next-js-app

🌐 Next JS Application Demo
JavaScript
52
star
17

frontity-twentynineteen

🎨 A Frontity Twentynineteen theme Project
CSS
51
star
18

laravel-charts

📊 Create a chart in Laravel using Chart.js and AJAX
PHP
37
star
19

tailwind-wordpress-plugin-example

An example WordPress plugin for using Tailwind css in Gutenberg editor with webpack and sass
JavaScript
37
star
20

woocommerce-custom-pages

✅ Custom template and Pages for Woocommerce that can be used to customize your Woocommerce Product, Categories, Cart, Checkout and Myaccount Pages
PHP
35
star
21

rest-api-endpoints

🌾 WordPress REST API endpoints
PHP
34
star
22

google-maps-javascript-api

🔎Create Google maps for your site with google maps javascript api, address field, marker and info window
JavaScript
29
star
23

nextjs-wordpress-theme

🎨 A Next.js WordPress theme that uses React in the front-end and WordPress in the backend - decoupled
JavaScript
28
star
24

wordpress-docker-example

A WordPress setup with Docker, Composer, mysql and phpmyadmin
23
star
25

headless-wp-starter

🌀 A starter demo for WordPress Headless CMS
JavaScript
22
star
26

electra

Block Based Theme - Full Site Editing Tutorial
HTML
22
star
27

gutenberg-workshop

⚒️ A Gutenberg Workshop 🅱️
PHP
22
star
28

custom-blocks

📦 Custom Gutenberg Blocks
PHP
21
star
29

graphql-react-app

📊 A demo app for using GraphQl with React and Spacex API
JavaScript
21
star
30

graphql-workshop

⚒ 🚧 A GraphQL workshop to learn GraphQL implementations
JavaScript
20
star
31

acf-block-example

📦 ACF Blocks Example plugin
PHP
19
star
32

react-node-boilerplate

A React Js and Node Js boilerplate for building a new project. It uses create-react-app
JavaScript
19
star
33

wordpress-contributors

👥 This plugin allows you to add more than one author for the post in the Add New and Edit Post section of WordPress dashboard.
PHP
18
star
34

mern-boilerplate

A boilerplate for MERN APP ( Mongodb, Express, React, Node ) with Login, Registration with Facebook, Google and Recaptcha. Pre setup of mongodb
JavaScript
17
star
35

react-woocommerce-theme

🏬 A React WooCommerce Store Theme, built with WooCommerce REST API, Webpack, Babel, Node and Express
JavaScript
16
star
36

pwa-concepts

👷 A demo App PWA Concepts
HTML
16
star
37

more-menu-react

📇 A demo for display extra menu items dynamically in More menu, in React
JavaScript
15
star
38

react-hooks

⚓ A demo app for React Hooks
JavaScript
14
star
39

gatsby-with-wordpress-workshop

A Gatsby with WordPress workshop
JavaScript
14
star
40

javascript-workshop

🔥 JavaScript Beginner to Advanced Workshop
JavaScript
13
star
41

react-app-boilerplate

🔥 react-app-boilerplate
SCSS
13
star
42

javascript-concepts

🎓 A demo app for JavaScript Concepts
JavaScript
12
star
43

acf-guten-blocks

🔌 This plugin creates Gutenberg blocks using ACF
PHP
12
star
44

react-app

📦 A demo to set up React App with create-react-app, webpack and babel
JavaScript
11
star
45

ssr-react-app

⚡ A server-side-rendering-react-app demo
JavaScript
11
star
46

gutenberg-blocks-starter

A starter plugin to develop Gutenberg blocks.
JavaScript
11
star
47

remove-linkedin-connection

👤 Remove a LinkedIn Connection with a Single Click
JavaScript
10
star
48

gatsby-wp-themes

Gatsby WordPress Theme
JavaScript
10
star
49

nextjs-example

Nextjs Example
JavaScript
9
star
50

admin-menu-builder

A plugin that creates a menu in WordPress backend dashboard
PHP
9
star
51

imranhsayed

Bio
9
star
52

webpack-app

📦 A demo app for webpack app
JavaScript
9
star
53

my-gatsby-project

My Gatsby Test Project
JavaScript
9
star
54

redux-workshop

⚒ A Redux Workshop 🏂
9
star
55

react-beginners-course

react-beginners-course
JavaScript
8
star
56

gatsby-workshop

🛠️ A Gatsby Workshop
CSS
8
star
57

codeytek-blocks

Custom Gutenberg blocks for codeytek
JavaScript
8
star
58

instamojo-integration-nodejs

Instamojo Payment Gateway Integration Snippet using Node Js , React, Express and Mongo db
JavaScript
8
star
59

create-react-app-pwa-new

Create React App PWA
JavaScript
7
star
60

frontity-contact-form-7-test

📝 Frontity Contact Form Seven Feature
JavaScript
7
star
61

lazy-load

🌈 A WordPress theme to demonstrate lazy load feature
PHP
7
star
62

my-storybook

A demo project for storybook using create-react-app
JavaScript
7
star
63

ihs-forms

WordPress Forms with attachments
PHP
7
star
64

starter-block

Starter Block Plugin with wp-scripts package
JavaScript
7
star
65

react-mmenu

🎢 React mmenu
JavaScript
7
star
66

gatsby-app

A demo React application using gatsby
CSS
7
star
67

autoloaders-with-composer

⌛ Demo for autoloading with Composer
PHP
6
star
68

contact-form-7-endpoints

🔥 This plugin provides you different endpoints for Contact Form 7 registration using WordPress REST API
PHP
6
star
69

react-app-webpack

A demo project for react with webpack
JavaScript
6
star
70

redux-example

🌀 A redux example
JavaScript
6
star
71

CSS-Tricks

Useful links for CSS Tricks
6
star
72

cg-blocks

A custom gutenberg contact card block
JavaScript
6
star
73

ihs-geo-location

This plugin detects your location and makes certain classes available to you which you can apply to the div elements or use shortcodes in your theme to display the user's current locality, city, state, country and address.
PHP
6
star
74

todo

🔥 A React Native App
Objective-C
5
star
75

jest-test-app

Test Application using JEST
HTML
5
star
76

taxonomies-wp-content

wp-content folder containing plugin and custom templates for custom post type custom taxonomy and custom product page examples
PHP
5
star
77

wordpress-docker-wp-cli

An example of WordPress with Docker and WP-CLI setup
Shell
5
star
78

gatsby-experimental

👨‍🔬 Gastby WordPress site
JavaScript
5
star
79

tailwind-example

tailwind-example
JavaScript
5
star
80

shiprocket-pincode-check-woocommerce

The plugin checks if the woocommerce product can be delivered to your location using pincode. It uses Shiprocket Api to achieve this.
PHP
5
star
81

jest-for-react

A demo project for writing test for react using jest
JavaScript
4
star
82

todolist

A laravel Project for todolist
PHP
4
star
83

portfolio-app

A react application
JavaScript
4
star
84

babel-app

A repo for babel demo
JavaScript
4
star
85

laravel-auth

Custom Login and Registration database name in the .env file is laravel_auth, id root and password: empty
PHP
4
star
86

nextjs

Next js app
JavaScript
4
star
87

item-laravel-api

A laravel Project to perform CRUD request with REST API via ajax request. Front end will be available in itemmanager directory and itemapi is a laravel dir
PHP
4
star
88

pop-up-window

Create Modal Box/ Pop up window using JavaScript
CSS
4
star
89

basicwebsite

A basic laravel website with contact form
PHP
4
star
90

add-post-script-plugin

A custom WordPress plugin that adds custom fields below every Post/Page to allow user to add post/page specific styles and scripts
PHP
4
star
91

Publish-plugin-on-WordPress

🔌 How to Publish Your Plugin on WordPress and Update and tag a version
HTML
4
star
92

nextjs-wp-assets

A set of assets for nextjs-wp project
CSS
4
star
93

laravel-blogs

📄 Blog Posting CRUD functionality in Laravel with Bootstrap
PHP
4
star
94

node-playground

🌐 A demo app for node
JavaScript
4
star
95

express-app

⚡ A demo app for Express
JavaScript
4
star
96

wp-plugin-webpack-boilerplate

Boilerplate - WordPress Plugin With Webpack setup
JavaScript
3
star
97

twentyseventeen-child

Child Theme with Infinite Scroll Using Ajax request with WordPress REST API
JavaScript
3
star
98

gutenberg-block-scaffold-examples

An example of Gutenberg Block Scaffoldings
JavaScript
3
star
99

programming-in-java

Example programs in Java
Java
3
star
100

python-programming

Example projects for Python Programming
Python
3
star