Wing Services List

Wing Services List is a WordPress block plugin that lets editors build and maintain a services list directly in the Gutenberg editor. Each service can include a title, short description, visual image or fallback label, optional link, and featured styling.

Installation

1. Copy or clone this repository into wp-content/plugins/wing-services-list/.
2. From the plugin directory, run npm install if dependencies are not installed.
3. Run npm run build to generate production assets.
4. Activate Wing Services List in the WordPress Plugins screen.

How to Test

1. Open a post or page in the block editor.
2. Insert the Wing Services List block.
3. Edit the heading, intro, service titles, descriptions, visuals, links, and featured state.
4. Add, remove, and reorder service items.
5. Save the post and confirm the front end renders the same services list.
6. Switch between card and list layouts, then check the block on desktop and mobile widths.

Implementation Choice

This is a Gutenberg block plugin using block.json, @wordpress/scripts, scoped block styles, and server-side rendering in PHP. Gutenberg was chosen over an Elementor widget because it works with WordPress core, is easier to test in a clean install, and avoids third-party page-builder dependencies.

Completed Features

• Single custom block: northwing/wing-services-list.
• Editable default service items.
• Add, remove, and reorder controls.
• Media library image selection with editable alt text.
• Fallback visual text when no image is selected.
• Optional heading, intro, service links, featured state, card/list layout, columns, visual shape, theme, and accent color controls.
• Responsive card and list layouts.
• Server-rendered front-end markup with escaped PHP output.
• Scoped editor and front-end CSS.

Outstanding Improvements

• Add automated editor/front-end browser tests.
• Add drag-and-drop reordering.
• Add optional link target and rel controls.
• Add richer image focal point or size controls if needed.