Pawan Kumawat

Request A Quote

Pawan Kumawat

Request A Quote

How to add ACF options pages and options sub page

To add Advanced Custom Fields (ACF) options pages and options sub-pages, you’ll need to have ACF Pro installed and activated on your WordPress site. ACF Pro allows you to create custom options pages where you can add settings, fields, and other configuration data.

Here’s how to add an ACF options page and a sub-page:

1. Install ACF Pro:

First, ensure that you have ACF Pro installed on your WordPress site. You can purchase ACF Pro from the ACF website (https://www.advancedcustomfields.com/pro/) and then install and activate it like any other WordPress plugin.

2. Create an Options Page:

To create an options page, go to “Custom Fields” > “Add New” in your WordPress dashboard. You’ll see a new ACF field group editor.

Set the “Location” to “Options Page” by selecting “Options Page” from the “Rule Type” dropdown. This ensures that the field group will be used for the options page.

Under the “Location” section, click on the “+ Add Rule” button. In the rule settings, select “Options Page” in the “Page” dropdown. This will set the field group to display on the options page.

In the “Field” section, add the fields you want to display on the options page. These can be text fields, image fields, select fields, etc.

Save the field group, and now you’ve created an ACF options page.

3. Create a Sub-Page (Sub-Menu):

To create an options sub-page (sub-menu) under the main options page, follow these steps:

Go to “Custom Fields” > “Add New” in your WordPress dashboard to create a new ACF field group.

Set the “Location” to “Options Page” by selecting “Options Page” from the “Rule Type” dropdown.

Under the “Location” section, click on the “+ Add Rule” button. In the rule settings, select “Options Page” in the “Page” dropdown, and choose the main options page you created earlier as the parent.

Add the fields you want to display on the sub-page, just like you did for the main options page.

Save the field group, and now you’ve created an ACF options sub-page.

4. Display the Options Pages and Sub-Page:

To display the options pages and sub-pages, use the `acf_add_options_page` function and the `acf_add_options_sub_page` function in your theme’s `functions.php` file or a custom plugin file.

Here’s an example of how to display the options pages and sub-page:

// Display the main options page
if( function_exists('acf_add_options_page') ) {
    acf_add_options_page(array(
        'page_title' => 'Theme Options',
        'menu_title' => 'Theme Options',
        'menu_slug' => 'theme-options',
        'capability' => 'edit_posts',
        'redirect' => false
    ));
}

// Display the sub-page under the main options page
if( function_exists('acf_add_options_sub_page') ) {
    acf_add_options_sub_page(array(
        'page_title' => 'Sub Page',
        'menu_title' => 'Sub Page',
        'parent_slug' => 'theme-options',
    ));
}

In this example, we used the `acf_add_options_page` function to create the main options page with the slug “theme-options” and title “Theme Options.” Then, we used the `acf_add_options_sub_page` function to create a sub-page with the title “Sub Page” and set it as a child of the main options page.

You can customize the page titles, menu titles, slugs, and other settings as needed.

That’s it! Now you have an ACF options page and a sub-page where you can add settings and configuration data for your WordPress theme.
Categories

Related Blogs

How to add custom style and script in wordpress

`wp_enqueue_scripts` is a crucial action hook in WordPress that allows you to enqueue or register scripts and stylesheets properly. It is commonly used by theme and plugin developers to load necessary CSS and JavaScript files onto the front-end of a WordPress website.

WooCommerce: Check if Product Category is in the Cart

To check if a specific product category is in the cart during the `woocommerce_before_cart` action hook, you can use a similar approach as in the previous answer. However, in this case, you need to use the `woocommerce_before_cart_contents` action hook, which fires before the cart items are displayed on the cart page. Here’s how you can achieve this:

Copyright © 2024 Pawan Kumawat