manifest / content / service-accordion

Custom Services Accordion

Adds a [services_accordion] shortcode using ACF Pro Repeater fields.

★ 0stars

0forks

Install

No release zip yet. The repository archive installs, but the folder name will carry the branch suffix and updates will not flow:

wp plugin install https://github.com/rolyestemonio/service-accordion/archive/refs/heads/main.zip

A lightweight, responsive WordPress plugin that implements a beautiful services accordion using Advanced Custom Fields (ACF) Pro Repeater fields.

Clean UI: Beautiful, modern accordion design with smooth open/close animations.
ACF Native: All custom fields (Repeater, Text, WYSIWYG, Image) are natively bundled directly in the plugin via PHP. No need to manually import JSON field groups.
Deep Linking: Each accordion item automatically generates a unique ID based on its title. Opening an item dynamically updates the URL hash (e.g., yoursite.com/services/#my-service) for easy sharing.
Auto-Scroll: If a user loads the page with a specific hash in the URL, the accordion will automatically open that item and smoothly scroll to it.
Responsive: Fully optimized for mobile and tablet views.

WordPress 5.0+
Advanced Custom Fields (ACF) Pro (Required for the Repeater field functionality)

Download the plugin folder or clone this repository.
Upload the services-accordion directory to your WordPress site's /wp-content/plugins/ directory.
Go to the Plugins menu in WordPress and activate "Custom Services Accordion".
Ensure ACF Pro is also installed and activated.

By default, the ACF fields are configured to appear on a specific page ID (e.g., your Services page). If you need it to appear on different pages, edit the 'location' array in acf/fields.php to match your desired Page ID or Post Type.
Go to your target page in the WordPress admin. You will see a new "Services Accordion" meta box containing a repeater field.
Click "Add Service" to create a new accordion tab. Fill in the Heading, Content, and optionally upload an Image.
Save or Update the page.
Place the following shortcode anywhere in the page's content area (or in your page builder) to render the accordion:
```
[services_accordion]
```

This plugin uses a structured, production-ready architecture:

services-accordion.php: Main plugin file (registers shortcode and conditionally enqueues assets).
assets/css/services-accordion.css: All styling.
assets/js/services-accordion.js: Frontend interaction logic.
acf/fields.php: Native PHP registration of the ACF field group.

Author: Roly Version: 1.1