Inline notifications (Pro) embed inside your page content instead of floating over the viewport. Timing, behavior, content source, and tracking work the same as toast, popup, and top bar notifications. Only delivery changes.
Enable Inline display type
- Open a notification in the editor.
- Go to Appearance.
- Set Display type to Inline (in content).
- Configure the Where section.
Placement modes
Shortcode (default)
Copy the shortcode from the Where section:
[notifal-onpage-notification id="123"]Paste it into a post, page, reusable block, or builder shortcode block. Replace 123 with your notification ID.
Automatic placement
Choose Automatic placement, then either:
- Pick a location from the dropdown (each option shows a readable label and the WordPress hook name), or
- Click Choose visually to open a wireframe modal and click a zone on a simulated page (Product, Thank you, Single post, or Archive/Blog).
Other hook: Select Other hook at the bottom of the list to enter any custom WordPress action hook name.
Hook priority: Set priority for every automatic placement (not only custom hooks). Default is 10.
Cart and checkout placements remain in the dropdown when WooCommerce is active; they are not shown in the visual wireframes yet.
Notifal injects a mount container at the selected hook on matching pages.
How it works on the frontend
- PHP outputs
<div class="notifal-inline-notification-mount" data-notifal-notification-id="ID">. - Notifal loads frontend assets when a shortcode, hook placement, or preview requires it.
- The notification renderer inserts the notification inside the mount container.
- Inline notifications are excluded from the global floating auto-injection pipeline.
List table shortcode copy
On OnPage Notifications, the Display type column shows Inline with a clipboard icon. Hover for the shortcode tooltip and click to copy.