{"id":15648044,"url":"https://github.com/ryelle/wordpress-query-posts","last_synced_at":"2025-10-28T23:15:39.149Z","repository":{"id":57399127,"uuid":"71724537","full_name":"ryelle/wordpress-query-posts","owner":"ryelle","description":"A set of react \u0026 redux helpers for fetching posts from the WordPress REST API","archived":false,"fork":false,"pushed_at":"2019-08-04T12:29:23.000Z","size":614,"stargazers_count":42,"open_issues_count":10,"forks_count":7,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-04-26T06:09:28.350Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://npmjs.com/package/wordpress-query-posts","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ryelle.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2016-10-23T19:25:15.000Z","updated_at":"2023-12-19T17:39:31.000Z","dependencies_parsed_at":"2022-09-13T21:13:11.304Z","dependency_job_id":null,"html_url":"https://github.com/ryelle/wordpress-query-posts","commit_stats":null,"previous_names":[],"tags_count":5,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ryelle%2Fwordpress-query-posts","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ryelle%2Fwordpress-query-posts/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ryelle%2Fwordpress-query-posts/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ryelle%2Fwordpress-query-posts/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ryelle","download_url":"https://codeload.github.com/ryelle/wordpress-query-posts/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":251714957,"owners_count":21631809,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-10-03T12:22:57.846Z","updated_at":"2025-10-28T23:15:38.856Z","avatar_url":"https://github.com/ryelle.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"WordPress Query Posts\n=====================\n\nThis package contains a query component, along with redux state \u0026 selectors for posts pulled from a WordPress site. This uses the [`node-wpapi`](https://github.com/WP-API/node-wpapi) package to get your site's data via Query Components ([inspired by calypso](https://github.com/Automattic/wp-calypso/blob/master/docs/our-approach-to-data.md#query-components)). The Query Components call the API, which via actions set your site's data into the state.\n\nTo use any of these helpers, you'll need to set your Site URL in a global (`SiteSettings`), so that the API knows what site to connect to. For example:\n\n```js\nwindow.SiteSettings = {\n\tendpoint: 'url.com/path-to-wordpress',\n};\n```\n\nAs of version 1.1, the URL should _not_ include `/wp_json` – `wordpress-rest-api-oauth-1` adds that for us.\n\nQuery Posts\n===========\n\nQuery Posts is a React component used in managing the fetching of posts queries, or single posts by the post slug.\n\n## Usage\n\nUsed to request a single post, or list of posts, based on either a query object, or post slug.\n\nRender the component, passing in the `query` or a single `postSlug`. It does not accept any children, nor does it render any elements to the page. You can use it adjacent to other sibling components which make use of the fetched data made available through the global application state.\n\n```jsx\nimport React from 'react';\nimport QueryPosts from 'wordpress-query-posts';\nimport MyPostsListItem from './list-item';\n\nexport default function MyPostsList( { posts } ) {\n\treturn (\n\t\t\u003cdiv\u003e\n\t\t\t\u003cQueryPosts query={ { search: 'Themes' } } /\u003e\n\t\t\t{ posts.map( ( post ) =\u003e {\n\t\t\t\treturn (\n\t\t\t\t\t\u003cMyPostsListItem\n\t\t\t\t\t\tkey={ post.id }\n\t\t\t\t\t\tpost={ post } /\u003e\n\t\t\t\t);\n\t\t\t} }\n\t\t\u003c/div\u003e\n\t);\n}\n```\n\nor for a single post:\n\n```jsx\nimport React from 'react';\nimport QueryPosts from 'wordpress-query-posts';\nimport SinglePost from './single';\n\nexport default function MyPostsList( { post } ) {\n\treturn (\n\t\t\u003cdiv\u003e\n\t\t\t\u003cQueryPosts postSlug=\"local-development-for-wordcamp-websites\" /\u003e\n\t\t\t\u003cSinglePost post={ post } /\u003e\n\t\t\u003c/div\u003e\n\t);\n}\n```\n\n## Props\n\n### `query`\n\n\u003ctable\u003e\n\t\u003ctr\u003e\u003cth\u003eType\u003c/th\u003e\u003ctd\u003eObject\u003c/td\u003e\u003c/tr\u003e\n\t\u003ctr\u003e\u003cth\u003eRequired\u003c/th\u003e\u003ctd\u003eNo\u003c/td\u003e\u003c/tr\u003e\n\t\u003ctr\u003e\u003cth\u003eDefault\u003c/th\u003e\u003ctd\u003e\u003ccode\u003enull\u003c/code\u003e\u003c/td\u003e\u003c/tr\u003e\n\u003c/table\u003e\n\nThe query to be used in requesting posts.\n\n### `postSlug`\n\n\u003ctable\u003e\n\t\u003ctr\u003e\u003cth\u003eType\u003c/th\u003e\u003ctd\u003eString\u003c/td\u003e\u003c/tr\u003e\n\t\u003ctr\u003e\u003cth\u003eRequired\u003c/th\u003e\u003ctd\u003eNo\u003c/td\u003e\u003c/tr\u003e\n\t\u003ctr\u003e\u003cth\u003eDefault\u003c/th\u003e\u003ctd\u003e\u003ccode\u003enull\u003c/code\u003e\u003c/td\u003e\u003c/tr\u003e\n\u003c/table\u003e\n\nThe post slug of the post to request.\n\nPost Selectors\n==============\n\nYou can import these into your project by grabbing them from the `selectors` file:\n\n```jsx\nimport { getPost, isRequestingPost } from 'wordpress-query-posts/lib/selectors';\n```\n\n#### `getPost( state, globalId )`\n\n#### `getPostsForQuery( state, query )`\n\n#### `isRequestingPostsForQuery( state, query )`\n\n#### `getTotalPagesForQuery( state, query )`\n\n#### `isRequestingPost( state, postSlug )`\n\n#### `getPostIdFromSlug( state, slug )`\n\nPost State\n==========\n\nIf you need access to the reducers, action types, or action creators, you can import these from the `state` file. For example, to use this in your global redux state, mix it into your reducer tree like this:\n\n```jsx\nimport posts from 'wordpress-query-posts/lib/state';\n\nlet reducer = combineReducers( { ...otherReducers, posts } );\n```\n\nIf you need to call an action (the query component should take care of this most of the time), you can pull the action out specifically:\n\n```jsx\nimport { requestPost } from 'wordpress-query-posts/lib/state';\n```\n\n[View the file itself](src/state.js) to see what else is available.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fryelle%2Fwordpress-query-posts","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fryelle%2Fwordpress-query-posts","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fryelle%2Fwordpress-query-posts/lists"}