Ghost Kit Pro adds motion and design controls to the WordPress block editor. Select a block already on a page and configure its effects or extensions in the block options. Effects are available on core blocks such as Paragraph, Heading, Image, Cover, Group, Columns, Buttons and Query Loop, as well as Ghost Kit blocks. A block from another extension can opt in by declaring supports.ghostkit in its block.json file.

Choose what triggers an effect

Reveal animations execute as a block comes into view. Adjust the starting offset, opacity, scale and rotation, then use the Pro replay options and custom viewport settings to control when the reveal runs. Pro also adds 3D rotation.

Scroll effects tie a block’s position, scale, rotation or opacity to the page’s scroll position. This supports parallax sections and scroll-driven reveals. Mouse effects move, tilt, scale or rotate a block as the pointer moves over it, with separate hover and press states. Loop animations run continuously for motion such as rotating badges, floating shapes or drifting backgrounds.

Per-block CSS transforms and transitions can also use a hover state.

Adjust layout across screen sizes

Use the extensions panel for positioning and presentation controls in the editor. Set a block to absolute or fixed positioning, with offsets for each screen size. Adjust padding and margin by screen size, add borders, corner radius or shadows, and set a separate hover state. Hide blocks at selected screen sizes, or translate, scale, rotate and skew them with optional hover settings.

Custom CSS and JavaScript can be added per page or website wide, with syntax highlighting in the admin. Ghost Kit Pro also adds custom block attributes and custom responsive breakpoints.

Add blocks, formats and styling options

Pro includes the Marquee, Code Highlight, Interactive Links, Magnifying Image, Image Scroller, Circle Button and Toggle Content blocks. Its text formats include Animated Text, Stroke, Spoiler and Tooltip.

Design options include additional icon packs, Adobe Fonts, custom font files and gradients for buttons, backgrounds, icons and badges. The Shape Divider block also gets extra shapes. Ghost Kit includes a WPML compatibility layer, and its blocks are translation ready.

Configure and reuse settings

1. Open a page in the standard block editor or Site Editor.
2. Select a core, Ghost Kit or compatible block.
3. Open Effects or the relevant extension settings and choose the options you need.
4. Preview and save or publish the page.

Use the Ghost Kit menu in the block toolbar to copy extensions from one block and paste them onto another. Effects check prefers-reduced-motion: reduce and skip animation for users who have disabled motion in their operating system. The effects script loads only on pages that use an effect.