JoomFAQs - Custom Fields

Joomla's custom fields system lets you attach additional structured data to your FAQ questions -- things like difficulty level, related products, review dates, or any other metadata that does not fit neatly into the standard question-and-answer format. JoomFAQs integrates with this system out of the box, so any custom fields you create for the com_joomfaqs context automatically appear alongside your FAQ answers on the frontend.

This guide explains how to create custom fields, configure their display, and put them to practical use.

---

How Custom Fields Work with JoomFAQs

Joomla 4 includes a built-in custom fields engine (found under Content > Fields in the administrator). Components can opt in to this system, and JoomFAQs does so. That means:

• You can create fields scoped to JoomFAQs questions, completely independent of fields you might use for articles, contacts, or other components.
• Fields appear in the question editing form in the backend, where administrators can fill in values.
• Field values are rendered on the frontend inside the accordion answer panel, either above or below the answer text depending on the view.
• You can organize fields into field groups for logical grouping. Each group gets its own heading in the frontend output.
• Joomla's ACL controls who can create, edit, and manage fields and field groups.

JoomFAQs supports two layout modes for displaying custom field values:

Layout	Description
Default	Fields are rendered as an unordered list (<ul>) with each field shown as a list item. The field label appears in bold followed by its value. This layout blends naturally into the accordion body content.
Table	Fields are rendered in a two-column HTML table. Labels appear in the left column on a light background (25% width) and values appear in the right column. This layout works well when you have several fields and want a structured, spreadsheet-like presentation.

---

Creating Custom Fields for FAQ Questions

Follow these steps to create a new custom field that will appear on your FAQ questions.

Step 1: Open the Fields Manager for JoomFAQs

1. Log in to the Joomla administrator panel.
2. Navigate to Content > Fields from the top menu.
3. In the Fields manager, look at the left sidebar or the filter dropdown and select the context JoomFaqs (sometimes displayed as com_joomfaqs). This ensures you are creating a field scoped to FAQ questions rather than to articles or another component.

Alternatively, when you are editing a question in the JoomFAQs backend, you will see a Fields tab. Clicking the link to manage fields from there will also take you to the correct context.

Step 2: Create a New Field

1. Click the New button in the toolbar.
2. Fill in the following required information:

Setting	What to enter
Title	A descriptive name for the field (e.g., "Difficulty Level"). This is what administrators see in the editing form and what visitors see as the field label on the frontend.
Type	Choose the field type that best matches the kind of data you want to capture. See Supported Field Types below.
Field Group	Optionally assign the field to a group. If no groups exist yet, you can create one under Content > Field Groups (filtered to the JoomFaqs context).

1. Configure any type-specific options that appear below the main fields (for example, list options for a List field, or min/max values for a Number field).
2. Switch to the Options tab to configure display behavior:

Option	Description
Show Label	Whether to display the field label alongside the value on the frontend. Default is Yes.
Label Render Class	An optional CSS class applied to the label element, useful for custom styling.
Render Class	An optional CSS class applied to the value element.
Automatic Display	Controls where the field value is rendered automatically. For JoomFAQs, the recommended setting is to leave this at its default and let the component handle rendering.

1. Click Save & Close.

Step 3: Assign Values to Questions

1. Go to Components > JoomFAQs > Questions.
2. Open any question for editing.
3. Click the Fields tab in the question editing form.
4. Fill in the value for your new custom field.
5. Save the question.

The field value will now appear on the frontend wherever that question is displayed.

---

Supported Field Types

JoomFAQs supports all standard Joomla custom field types. The most commonly useful ones for FAQ content include:

Field Type	Best For	Example Use
Text	Short single-line values	Product name, version number
Textarea	Multi-line text	Additional notes, disclaimers
List	Predefined single-select options	Difficulty level (Beginner, Intermediate, Advanced)
Checkboxes	Multiple selections from a set of options	Applicable product editions
Radio	A single choice from a small set	Yes/No flags, priority levels
Integer	Numeric values within a range	Rating (1-5), step count
Calendar	Date values	Last reviewed date, effective date
URL	Web links	Related documentation links, product pages
Editor	Rich text with formatting	Extended explanations, formatted notes
Media	Images from the media library	Diagrams, screenshots
Color	Color values	Category color coding
User	A reference to a Joomla user	Subject matter expert, reviewer
SQL	Values from a custom database query	Dynamic lookups
Subform	Repeatable groups of sub-fields	Multiple related items
Image List	Selection from images in a folder	Icon selection
Number	Decimal numbers	Scores, measurements
Note	Display-only informational text in the edit form	Instructions for editors (not shown on frontend)

You can also install third-party custom field type plugins to extend this list further.

---

Layout Options: Default vs. Table

JoomFAQs offers two built-in layouts for rendering custom fields on the frontend. The choice is a global setting that applies to all FAQ views.

Default Layout

The Default layout renders each field as a list item inside an unordered list:

Group Title (if set)
  * Field Label : Field Value
  * Field Label : Field Value

Each field is displayed on its own line. Labels appear in bold when the "Show Label" option is enabled on the field. This layout has minimal visual weight and integrates smoothly with the rest of the answer content.

• Fields with empty values are automatically hidden.
• Field groups that contain only empty fields are hidden entirely.
• CSS classes customFieldLabel and customFieldValue are applied to the label and value elements, making targeted styling straightforward.

Table Layout

The Table layout renders all fields in a structured HTML table:

| Group Title (spans both columns)           |
|--------------------------------------------|
| Field Label (25% width) | Field Value      |
| Field Label             | Field Value      |

The label column has a light background (bg-light) for visual distinction. This layout is especially effective when your questions have many custom fields, as it keeps the data organized and easy to scan.

• The same hide-when-empty rules apply: empty fields and empty groups are not rendered.
• The same CSS classes (customFieldLabel, customFieldValue) are available for styling.

Configuring the Layout

To set the custom fields layout:

1. Go to Components > JoomFAQs and click Options in the toolbar.
2. In the Template tab, find the Custom Fields Layout setting.
3. Select either Default or Table.
4. Click Save & Close.

This setting affects both the category view (where questions are shown in an accordion) and the single question detail view.

Note: In the category view, the layout is controlled by the customfield_layout parameter. In the single question view, the parameter is named channel_field_layout (a legacy naming convention). Both respond to the same global configuration setting.

---

How Custom Fields Appear in Frontend Views

Category View (Accordion)

In the category accordion view, custom fields are rendered above the answer text, inside each accordion panel body. When a visitor expands a question, they see:

1. Author and date information bar (if enabled)
2. Custom field values (in the selected layout)
3. The answer content

This placement ensures that metadata is visible immediately without scrolling past the answer.

Single Question View

In the single question detail view, custom fields are rendered after the answer text. The display order is:

1. Author and date information bar (if enabled)
2. The answer content
3. Custom field values (in the selected layout)

Field Groups in Both Views

If you have organized your fields into groups, the group title appears as an <h4> heading above the fields in that group. This helps visitors understand the context of related fields at a glance.

If a group title is empty (ungrouped fields), no heading is shown and the fields are rendered directly.

---

Configuring Custom Field Display Settings

Beyond the global layout choice, you have several per-field options that control how individual fields appear.

Per-Field Options

These settings are configured when creating or editing a field (under Content > Fields, in the JoomFaqs context):

Option	Where to Find	Effect
Show Label	Field > Options tab	When set to Yes, the field label is displayed alongside the value. When No, only the value is shown.
Label Render Class	Field > Options tab	A CSS class added to the <strong> label element, letting you style specific field labels differently.
Render Class	Field > Options tab	A CSS class added to the <span> value element, letting you style specific field values differently.
Published	Field > main settings	Only published fields are shown on the frontend. Unpublish a field to temporarily hide it from all views.
Access	Field > main settings	Controls which user access levels can see the field. Use this to show certain fields only to registered users or specific groups.

Per-Field-Group Options

Field groups also have access and publishing controls. If a field group is unpublished or restricted, all fields in that group inherit those restrictions.

Permissions

Custom field and field group permissions are managed through the JoomFAQs Permissions tab (Components > JoomFAQs > Options > Permissions). The relevant ACL actions include:

Action	Scope	Description
Edit Custom Field Value	Component	Controls which user groups can edit custom field values on FAQ questions.
Create	Field Group	Controls which user groups can create new field groups.
Edit	Field Group / Field	Controls which user groups can edit field group or field definitions.
Edit State	Field Group / Field	Controls which user groups can publish or unpublish field groups or fields.
Delete	Field Group / Field	Controls which user groups can delete field groups or fields.

---

Use Case Examples

The following examples walk through creating practical custom fields for real-world FAQ scenarios.

Example 1: Adding a "Difficulty Level" Field

Suppose you run a technical knowledge base and want each question tagged with how advanced it is.

1. Go to Content > Fields and filter to the JoomFaqs context.
2. Click New.
3. Set the following:
   • Title: Difficulty Level
   • Type: List
4. In the field options area, add three list values:
   • Beginner
   • Intermediate
   • Advanced
5. Optionally set a default value (e.g., "Beginner").
6. In the Options tab, set Show Label to Yes.
7. Save & Close.

Now when editing any FAQ question, you will see a "Difficulty Level" dropdown in the Fields tab. On the frontend, visitors see something like:

Difficulty Level : Intermediate

Styling tip: Set the Render Class on the field to a custom CSS class like difficulty-badge, then add CSS rules in your template or in the JoomFAQs Custom CSS setting to style the value as a colored badge.

Example 2: Adding a "Related Product" Field

If your FAQ covers multiple products and you want to indicate which product each question applies to:

1. Go to Content > Fields (JoomFaqs context) and click New.
2. Set the following:
   • Title: Related Product
   • Type: Text (or List if you have a fixed product catalog)
3. If using a List type, add your product names as options.
4. In the Options tab:
   • Set Show Label to Yes.
   • Set Render Class to related-product for styling purposes.
5. Save & Close.

For a more advanced setup, consider using the URL field type instead. This lets you link directly to the product page:

1. Create the field with Type: URL.
2. When editing a question, enter the full product page URL.
3. On the frontend, the value is rendered as a clickable link.

Example 3: Adding a "Last Reviewed" Date Field

For FAQ sections where accuracy matters (compliance, medical, legal), tracking when each answer was last reviewed is valuable:

1. Go to Content > Fields (JoomFaqs context) and click New.
2. Set the following:
   • Title: Last Reviewed
   • Type: Calendar
3. Configure the calendar options:
   • Set a date format that matches your site (e.g., Y-m-d or d/m/Y).
   • Leave the default value empty so editors must actively set it.
4. In the Options tab, set Show Label to Yes.
5. Save & Close.

When editing a question, the Fields tab will show a calendar date picker for "Last Reviewed." On the frontend, visitors see:

Last Reviewed : 2026-01-15

Organizational tip: Create a field group called "Content Maintenance" and assign both a "Last Reviewed" date field and a "Reviewed By" user field to it. This groups the maintenance metadata under a clear heading on the frontend.

---

Best Practices

Keep the number of fields manageable. Custom fields are powerful, but too many fields per question can clutter the frontend display and make the editing experience tedious. Aim for 3-5 fields per question at most. If you need more, organize them into logical field groups.

Use field groups for organization. When you have related fields, group them together. The group title appears as a heading on the frontend, giving visitors context. For example, group "Last Reviewed" and "Reviewed By" under a "Content Maintenance" group.

Choose the right field type. Use List or Radio fields instead of free-text fields when the set of valid values is known and limited. This ensures consistency across your FAQ content and makes filtering easier.

Use the Table layout for data-heavy FAQs. If your questions have more than two or three custom fields, the Table layout provides a cleaner, more structured presentation than the Default list layout.

Use the Default layout for minimal metadata. If you only have one or two fields (like a difficulty level or a product tag), the Default list layout integrates more naturally with the answer content.

Set appropriate access levels. Not all custom fields need to be visible to every visitor. Use the field's Access setting to restrict sensitive metadata to registered users or specific groups.

Leave the field value empty when it does not apply. JoomFAQs automatically hides fields with empty values, so you do not need to worry about blank entries cluttering the display. Not every question needs every field filled in.

Use Label Render Class and Render Class for styling. Rather than adding custom CSS that targets all field labels or values globally, assign specific CSS classes to individual fields. This gives you precise control over each field's appearance.

Test with both layouts before committing. Switch between Default and Table in the component configuration to see which one looks better with your specific set of fields and your template. The right choice depends on the number of fields and your site's visual style.