Documentation  /  Developers

Developers

Hooks, JavaScript events and CSS variables to extend MagicKit.

PHP filters

FilterArgumentsUse
magickit/query_args$args, $settings, $widgetWP_Query arguments of post widgets (Post Grid, Post List…).
magickit/woo/query_args$args, $settings, $widgetProduct query of WooCommerce widgets.
magickit_pro/post_grid/query_args$args, $settings, $widgetSmart Post Grid query (including AJAX filtering and paging).
magickit_pro/search/query_args$args, $configLive Search and Doc Search query.
magickit/modules/registry$modulesAdd, change or remove widgets and extensions.
magickit/category_prefix$prefixThe “MagicKit” prefix of the Elementor panel categories.
magickit/is_pro_active$activeWhether Pro features are available.
magickit/upgrade_url$urlTarget of the “Get Pro” links.
magickit/admin/menu_title, magickit/admin/brand_name$titleBranding of the dashboard.
magickit/admin/tabs$tabsAdd your own dashboard tab.

PHP actions

ActionArgumentsWhen
magickit/loaded–MagicKit Lite has booted.
magickit_pro/form/submitted$values, $settingsA Magic Form was submitted and validated.

Example: exclude a category from post widgets

functions.php
add_filter( 'magickit/query_args', function ( $args, $settings, $widget ) {
	$args['category__not_in'] = array( 12 ); // Category ID to hide.
	return $args;
}, 10, 3 );

Example: send Magic Form data to your CRM

functions.php
add_action( 'magickit_pro/form/submitted', function ( $values, $settings ) {
	wp_remote_post( 'https://crm.example.com/api/leads', array(
		'body' => array(
			'email' => isset( $values['email'] ) ? $values['email'] : '',
			'name'  => isset( $values['name'] ) ? $values['name'] : '',
		),
	) );
}, 10, 2 );

JavaScript events

When a Magic Form, Mailchimp, login or register form succeeds, MagicKit fires the DOM event magickit:form-success on the form. Magic Form also triggers the jQuery event magickit/form/success on document.

JavaScript
document.addEventListener( 'magickit:form-success', function ( event ) {
	// event.target is the form, event.detail the server response.
	console.log( 'Form sent', event.target, event.detail );
} );

CSS variables

The Style Kit is output as CSS variables on :root. Use them in your own CSS to stay on brand:

--mk-primary, --mk-secondary, --mk-dark, --mk-text, --mk-surface, --mk-soft, --mk-border, --mk-radius, --mk-btn-radius, --mk-shadow, --mk-speed.

CSS
.my-badge {
	background: var(--mk-primary);
	border-radius: var(--mk-btn-radius);
	box-shadow: var(--mk-shadow);
	transition: transform var(--mk-speed);
}

Body classes

The <body> element gets mk-motion-soften, mk-motion-respect or mk-motion-ignore according to the Style Kit motion setting, so your own animations can follow the same rule.

AI abilities and MCP

MagicKit Pro registers its AI tools with the WordPress Abilities API (category magickit): magickit/list-pages, magickit/get-page, magickit/list-widgets, magickit/get-widget, magickit/get-style-kit, magickit/create-page, magickit/add-element, magickit/update-element, magickit/move-element, magickit/delete-element, magickit/list-changes and magickit/undo-change.

  • Add your own tools on the magickit/ai/register_abilities action; they appear in the editor assistant and for connected AI apps.
  • Adjust the assistant with magickit/ai/system_prompt, magickit/ai/preferred_models and magickit/ai/timeout; control exposure with magickit/ai/expose_abilities.
  • The MCP server is at /wp-json/magickit/v1/mcp with OAuth 2.1 sign-in. Claude Code: claude mcp add --transport http magickit https://your-site.com/wp-json/magickit/v1/mcp

Full guide: AI & MCP.

Still stuck?

Send us a support request or email help@magickit.pro. Include your WordPress, Elementor and MagicKit versions.

© 2026 MagicKit by BwCreative. All rights reserved. Elementor is a trademark of Elementor Ltd. MagicKit is an independent product and is not affiliated with Elementor.