Using Livewire with WordPress

With the release of Acorn v4 came the final implementations needed for Livewire support alongside your Acorn-powered WordPress themes and plugins.

This can be done by manually inserting them inside of app.blade.php or by rendering them inside of WordPress hooks using the Blade facade.

For this example, we will create a simple searchable Post List component. Start by generating the component using Acorn's CLI:

Inside of app/Livewire/PostList.php, we can create a $query property to hold our search term and perform a simple get_posts() with the query if it is not empty:

In resources/views/livewire/post-list.blade.php, we can add some simple markup consisting of an <input> for the search $query and a loop of any found posts:

This is a WordPress site, but the Roots docs are powered by Acorn & Laravel routes instead of from a WordPress post type or page. If you’re interested in the ability create WordPress virtual pages powered by Laravel routes in a routes/web.php file, you might like Radicle.

Help us continue to build and maintain our open source projects. We’re a small team of independent developers and every little bit helps.

Leave a Comment