ACF Options Pages

Overview

ACF Options Pages give you a centralized place in the WordPress admin to manage global site settings -- things like your logo, social media links, footer text, or any data that appears across multiple pages. In Flowmo, the Options Page is created automatically as the "default" collection in the Page Parts tab. When you export your project, Flowmo generates a structured set of ACF options pages in your WordPress admin under Theme Settings.

Unlike page-specific collections that are tied to a single template, options page fields are available site-wide. This makes them perfect for header content, footer content, and any global elements that repeat across your site.

Prerequisites

• A Flowmo project with CMS mode enabled.
• The Advanced Custom Fields (ACF) Pro plugin installed on your WordPress site (required for options pages).
• Familiarity with Flowmo's CMS fields and collections (see ACF Field Types and ACF Field Groups).

How It Works

Flowmo's options page system has two sides:

1. In the Flowmo designer -- You add fields and repeaters to the Options Page collection in the Page Parts tab. These fields get connected to canvas elements just like any other CMS field.

1. In WordPress -- On export, Flowmo generates a parent menu item called Theme Settings with three sub-pages:

• Main Options (slug: main-options) -- Where your default collection fields appear.
• Header Settings (slug: header-settings) -- For header-related options.
• Footer Settings (slug: footer-settings) -- For footer-related options.

The default collection (marked with isDefault: true) is automatically routed to the main-options page via ACF location rules. This means any fields you add to the Options Page collection in Flowmo will appear under Theme Settings > Main Options in your WordPress admin.

Step-by-Step: Setting Up Options Page Fields

1. Open the Page Parts Tab

In the CMS panel on the right sidebar, navigate to the Page Parts tab. This tab manages your header elements, footer elements, and the Options Page.

2. Open the Options Page Section

Scroll down past the Header and Footer sections. You will see an Options Page section with an Open Options Page button. Click it to expand the options page editor.

3. Add Fields

The Options Page editor has two sections: Fields and Repeaters.

To add a field:

1. Click Add Field at the bottom of the Fields section.
2. Enter a field name (e.g., site_logo, phone_number, copyright_text).
3. Choose a field type from: text, textarea, image, url, number, date, boolean, or wysiwyg.
4. Press Enter or click Add.

Your new field appears in the Fields list immediately.

4. Add Repeaters

For repeating data (like a list of social media links or partner logos), add a repeater:

1. Click Add Repeater at the bottom of the Repeaters section.
2. Enter a repeater name (e.g., social_links, partner_logos).
3. Press Enter or click Add.
4. Click the repeater row to drill into it.
5. Inside the repeater, add sub-fields using the same Add Field flow.

5. Connect Elements to Fields

To bind your design elements to options page fields:

1. Select one or more elements on the canvas.
2. In the Options Page editor, click Attach Selected Elements on the target field.
3. The connected element count appears as a badge on the field.

To remove a connected element, expand the field and click the X button next to the element name.

6. Edit or Delete Fields

• Edit a field: Click the field to expand its edit controls. You can change the name, type, required status, placeholder, and default value.
• Delete a field: Click the trash icon that appears on hover.
• Delete a repeater: Click the trash icon next to the repeater name in the list.

7. Navigate Nested Repeaters

If you have repeaters inside repeaters, use the breadcrumb navigation at the top:

• Click a repeater to drill into its sub-fields.
• Click the back arrow or parent name (e.g., "Options Page") to go up one level.

8. Hide the Options Page Editor

Click Hide in the top-right corner of the Options Page section to collapse it. Your data is preserved -- you can reopen it at any time.

What Gets Exported

When you export your project to WordPress, the options page generates the following ACF JSON structures:

Options Pages (Menu Structure)

Page	Menu Slug	Parent	Purpose
Theme Settings	theme-general-settings	Top-level menu	Parent container (redirects to first sub-page)
Main Options	main-options	theme-general-settings	Your default collection fields
Header Settings	header-settings	theme-general-settings	Header-related options
Footer Settings	footer-settings	theme-general-settings	Footer-related options

All options pages use the edit_posts capability and store data using WordPress options storage.

Field Group Location Rules

Your default collection's field group is assigned with the location rule:

• Parameter: options_page
• Operator: ==
• Value: main-options

This means the fields appear when you navigate to Theme Settings > Main Options in the WordPress admin.

Tips

• Use descriptive field names. Since options page fields are global, clear names like footer_copyright_text are easier to manage than generic names like text_1.
• Group related fields into repeaters. For example, create a social_links repeater with platform_name, profile_url, and icon sub-fields instead of individual fields for each social network.
• The Options Page is created automatically. You do not need to manually create it -- Flowmo initializes it with id: 'options' and isDefault: true the first time you open the Page Parts tab.
• Options page fields are site-wide. Any template in your WordPress theme can access these values using get_field('field_name', 'option') in PHP.
• Default values are pulled from the canvas. When you connect a canvas element to a field, Flowmo extracts the element's current text, image URL, or link href as the field's default value in the ACF export.

Common Issues

Problem	Solution
Options page fields are not showing in WordPress	Make sure ACF Pro is installed and activated. Options pages are an ACF Pro feature and are not available in the free version.
Fields appear but have no data	You need to enter values in Theme Settings > Main Options in the WordPress admin after importing the ACF JSON. Default values from Flowmo are exported, but you may need to save the options page once.
"Theme Settings" menu is missing	Verify that the ACF JSON was imported correctly. Go to ACF > Tools > Import and re-import the generated JSON file.
Changes to options page fields are not reflected in the export	Make sure you are editing the Options Page collection in the Page Parts tab (not a regular page collection). Only the default collection routes to the options page.
PHP memory errors during ACF import	Flowmo automatically cleans empty values from the ACF JSON to reduce payload size. If you still encounter issues, check your WordPress server's PHP memory limit (memory_limit in php.ini).
Duplicate field names causing issues	Flowmo sanitizes field names to be valid PHP variable names (lowercase, underscores only) and automatically deduplicates names within the same group by appending a numeric suffix.

Related Articles

• ACF Field Types
• ACF Field Groups
• ACF Repeater Fields
• Visual CMS Editor
• WordPress Page Types
• Custom Post Types