Trang tùy chọn ACF REST API

Đừng bận tâm với phía trước. tiểu bang. nguồn. Đây là phiên bản sửa đổi của chủ đề cũ hoạt động

chỉ mục của bạn. js sẽ trông như thế này

import Theme from "./components";
import image from "@frontity/html2react/processors/image";
import iframe from "@frontity/html2react/processors/iframe";

    // Custom handler for ACF options
    const acfOptionsHandler = {
      pattern: "acf-settings",
      func: async ({ route, state, libraries }) => {
        // 1. Get ACF option page from REST API.
        const response = await libraries.source.api.get({
          endpoint: `/acf/v3/options/options`
        });
        const option = await response.json();

        // 2. Add data to `source`.
        const data = state.source.get(route);
        Object.assign(data, { ...option, isAcfOptionsPage: true });
      }
    };

    const marsTheme = {
      name: "ThemeName",
      roots: {
        /**
         *  In Frontity, any package can add React components to the site.
         *  We use roots for that, scoped to the `theme` namespace.
         */
        theme: Theme,
      },
      state: {
        /**
         * State is where the packages store their default settings and other
         * relevant state. It is scoped to the `theme` namespace.
         */
        theme: {
          menu: [],
          isMobileMenuOpen: false,
          featured: {
            showOnList: false,
            showOnPost: false,
          },
        },
      },
      /**
       * Actions are functions that modify the state or deal with other parts of
       * Frontity like libraries.
       */
      actions: {
        theme: {
          beforeSSR: async ({ state, actions }) => {
            await Promise.all([
              actions.source.fetch("acf-settings"),
            ]);
          },
          toggleMobileMenu: ({ state }) => {
            state.theme.isMobileMenuOpen = !state.theme.isMobileMenuOpen;
          },
          closeMobileMenu: ({ state }) => {
            state.theme.isMobileMenuOpen = false;
          },
        },
      },
      libraries: {
        html2react: {
          /**
           * Add a processor to `html2react` so it processes the `<img>` tags
           * inside the content HTML. You can add your own processors too
           */
          processors: [image, iframe],
        },
        source: {
        handlers: [acfOptionsHandler]
        }
      },
    };

    export default marsTheme;

Sau đó, bạn có thể yêu cầu Cài đặt ACF như thế này

const Root = ( {state} ) => {
  const options = state.source.get("acf-settings");
  console.log(options);
  ...

Hiển thị Điểm cuối trường tùy chỉnh nâng cao trong WordPress REST API

https. //wordpress. org/plugins/acf-to-rest-api/

1. Sao chép thư mục acf-to-rest-api vào thư mục wp-content/plugins của bạn
2. Kích hoạt plugin ACF to REST API qua trang quản trị plugin

Ví dụ cơ bản về cách sử dụng các bộ lọc, trong trường hợp này tôi sẽ đặt quyền mới để nhận các trường

add_filter( 'acf/rest_api/item_permissions/get', function( $permission ) {
  return current_user_can( 'edit_posts' );
} );

Xem bên dưới cách chọn Phiên bản API yêu cầu

1. Mở trang plugin;
2. Nhấp vào liên kết cài đặt dưới tên pluing ( ACF to REST API );
3. Chọn phiên bản của bạn trong phiên ACF to REST API;
4. Nhấp vào nút Lưu thay đổi

Cách khác là xác định hằng số

define( 'ACF_TO_REST_API_REQUEST_VERSION', 2 );

define( 'ACF_TO_REST_API_REQUEST_VERSION', 2 );

define( 'ACF_TO_REST_API_REQUEST_VERSION', 2 );

Trong phiên bản này, có thể định cấu hình các tùy chọn trường thông qua quản trị viên

Các tùy chọn được bật bằng các bộ lọc bên dưới, theo mặc định, các tùy chọn này bị tắt

// Enable the option show in rest
add_filter( 'acf/rest_api/field_settings/show_in_rest', '__return_true' );

// Enable the option edit in rest
add_filter( 'acf/rest_api/field_settings/edit_in_rest', '__return_true' );

Sau khi bạn kích hoạt các bộ lọc, tất cả các trường của bạn sẽ hiển thị các tùy chọn này.

Các trường phải được gửi vào khóa

define( 'ACF_TO_REST_API_REQUEST_VERSION', 2 );

Hoạt động. http. //localhost/wp-json/acf/v3/posts/1

________số 8_______

Hoạt động. http. //localhost/wp-json/wp/v2/posts/1

<form action="http://localhost/wp-json/wp/v2/posts/1" method="POST">
  <?php 
    // https://developer.wordpress.org/rest-api/using-the-rest-api/authentication/
    wp_nonce_field( 'wp_rest' ); 
  ?>
  <label>Title: <input type="text" name="title"></label>
  <h3>ACF</h3>
  <label>Site: <input type="text" name="fields[site]"></label>
  <button type="submit">Save</button>
</form>

Sử dụng bộ lọc

define( 'ACF_TO_REST_API_REQUEST_VERSION', 2 );

define( 'ACF_TO_REST_API_REQUEST_VERSION', 2 );

add_filter( 'acf/rest_api/key', function( $key, $request, $type ) {
  return 'acf_fields';
}, 10, 3 );

Bây giờ, các trường sẽ được gửi vào khóa

define( 'ACF_TO_REST_API_REQUEST_VERSION', 2 );

<form action="http://localhost/wp-json/acf/v3/posts/1" method="POST">
  <?php 
    // https://developer.wordpress.org/rest-api/using-the-rest-api/authentication/
    wp_nonce_field( 'wp_rest' ); 
  ?>
  <label>Site: <input type="text" name="acf_fields[site]"></label>
  <button type="submit">Save</button>
</form>

Chủ đề mẫu để chỉnh sửa Trường ACF

https. //github. com/airesvsg/acf-to-rest-api-example

Những việc cần làm

https. //github. com/airesvsg/to-do-list-acf-to-rest-api

https. //github. com/airesvsg/acf-to-rest-api-recursive

Thêm chi tiết

• Vấn đề

  • #109
  • #223
  • #9

• Yêu cầu kéo

  • #95

Kích hoạt bộ nhớ đệm cho WordPress REST API và tăng tốc độ ứng dụng của bạn

https. //github. com/airesvsg/wp-rest-api-cache