Attributes Manager

Fields (also called Attributes) are the editable options that appear in the Gutenberg Editor sidebar when someone uses your block.

For example, if you create a “Testimonial” block, you might want these fields:

• Author name (text field)
• Quote text (textarea)
• Show photo (on/off toggle)
• Star rating (slider from 1-5)

When users insert your block into a page, they’ll see these fields in the sidebar and can edit them. The values they enter are automatically saved and available in your block’s PHP render code.

The Attributes Manager is where you create these fields using a simple visual interface – no JSON editing required.

How It Works

1. Open the Attributes tab in the FanCoolo editor
2. Click “+ Add attribute” to create a new field
3. Choose the Type (Text, Number, Toggle, etc.) from dropdown
4. Enter the Attribute name (e.g., “authorName”, “quoteText”, “showPhoto”)
5. FanCoolo automatically generates block.json with your attributes
6. Your block appears in Gutenberg with these fields in the sidebar
7. Users edit the fields → WordPress saves the data
8. Your PHP code accesses the data via $attributes
9. Copy the PHP example shown below each attribute to use it in your code

Adding an Attribute

1. Click “+ Add attribute” button
2. Select Type from dropdown
3. Enter Attribute name (use camelCase like “authorName”)
4. For Select/Radio: Click “+ Add Option” to add choices
5. For Range: Set Max value
6. Copy the PHP code example shown below the attribute
7. Paste it into your PHP render code to use the field

Using Fields in Your Code

Step 1: Create Field in Attributes Manager

In FanCoolo, add a “Text” attribute named “Author name”. Fields names will be converted to “camelCase” that is a standard for php variables and functions.

Once you type them name you will automatically get php example that you can copy paste to the “Content tab”

Step 2: Copy the PHP Example

Below each attribute, you’ll see a PHP code example like:

Step 3: Paste in Your Render Code

Use it in your block’s PHP template:

You can also type $att in the Content editor and pick the attribute from the suggestions ($attributes:authorName). FanCoolo inserts the same code example for you.

Attribute Variables

When you save the block, FanCoolo creates a PHP variable for every attribute, so you can write $author_name instead of $attributes['authorName']. The variable name is the attribute name in snake_case: authorName becomes $author_name. A digit followed by a capital letter does not split: cta2Label becomes $cta2label.

<p class="author"><?php echo esc_html($author_name); ?></p>

If the attribute has no value, the variable holds its default: the default you set, 0 for number and range, true or false for toggle and checkbox, an empty list for image, file, link, relationship, post types and taxonomies, and an empty string otherwise.

Some names are reserved because WordPress or FanCoolo already uses them in templates, for example content, block and post_id. A reserved attribute gets no variable, and the Attributes tab shows a warning on the field. Use $attributes['name'] for it, or rename the attribute. Names that cannot be a PHP variable, such as 2col, get no variable either.

$attributes keeps working, and your own $x = $attributes['x'] ?? '' lines still work, because they run after the generated ones. Symbols get the same variables from $symbol_attrs.

Available Field Types

Type	Gutenberg UI	Best For	Example
**Text**	Text input	Short text	Author name, title, label
**Textarea**	Multi-line box	Long text	Quote, description, content
**Number**	Number spinner	Numbers	Count, width, quantity
**Range**	Slider	Numbers with limits	Rating (1-5), opacity (0-100)
**Date**	Date picker	Dates	Event date, deadline
**Image**	Media button	Images	Author photo, background
**Link**	URL input	URLs	Button link, website URL
**Color**	Color picker	Colors	Background, text color
**Select**	Dropdown	Single choice from list	Size (S/M/L), alignment
**Toggle**	On/off switch	Enable/disable	Show author, enable feature
**Checkbox**	Checkbox	True/false	Accept terms, featured
**Radio**	Radio buttons	Single choice (visual)	Layout style, theme

Deleting an Attribute That Is Still Used

When you delete an attribute, FanCoolo first checks your saved templates for places that still use it. If it finds any, a confirmation opens with the title Still in use. It lists the lines in this block or symbol that read the attribute, and the symbol tags in other blocks and symbols that pass it. Unsaved edits in the editor are not part of this check.

Choose Delete anyway to go ahead, or Cancel to keep the attribute. Nothing is removed from your templates automatically.

A template that still reads the deleted variable, for example $label, does not raise a PHP "Undefined variable" warning. The generated attributes file sets it to null, and the Content editor marks those lines with a warning, so you can update or remove them.