Create a Custom Slash Command for Init Live Search with Just 3 Snippets

Want to extend Init Live Search with your own search commands like /random_post, /featured_post, or anything else you can imagine? Since version 1.6.7, you can do exactly that — directly from your theme, with just three simple code snippets. No plugin edits, no custom UI required.

Create a Custom Slash Command for Init Live Search with Just 3 Snippets

Introduction

Starting from Init Live Search 1.6.7, you can define custom slash commands directly from your theme or plugin without modifying the core plugin code. The UI will handle everything — input, display, rendering — as long as your backend provides the expected data.

In this tutorial, we’ll create a new command called /random_post to show a random list of published posts.

Step 1: Customize the query result

First, use the init_plugin_suite_live_search_query_args filter to customize the query when the user types your command:

add_filter('init_plugin_suite_live_search_query_args', function ($args, $mode, $request) {
    if ($mode === 'recent') {
        $term = sanitize_text_field($request->get_param('term') ?? '');

        if ($term === '/random_post') {
            $args['orderby'] = 'rand';
            $args['post_status'] = 'publish';
        }
    }

    return $args;
}, 10, 3);

Here we’re reusing the existing /recent endpoint and injecting custom behavior when the term is /random_post.

Step 2: Register the command label for autocomplete

To make your command show up in the autocomplete dropdown, register its label via this filter:

add_filter('init_plugin_suite_live_search_commands', function ($commands) {
    $commands['random_post'] = __('Show random posts as a list', 'init-live-search');
    return $commands;
});

With this in place, typing /ran in the search input will suggest /random_post automatically.

Step 3: Hook into JS to handle the command

Finally, hook into the ils:search-started event to handle the command when typed manually. This snippet can be added to your theme’s JS:

window.addEventListener('ils:search-started', (e) => {
    const term = (e.detail?.term || '').trim();
    if (term !== '/random_post') return;

    const endpoint = InitPluginSuiteLiveSearch.api.replace('/search', '/recent') + '?term=/random_post';

    window.ilsHelpers.showLoading();

    fetch(endpoint)
        .then(res => {
            if (!res.ok) throw new Error();
            return res.json();
        })
        .then(data => {
            if (!Array.isArray(data) || data.length === 0) {
                window.ilsHelpers.showMessage(InitPluginSuiteLiveSearch.i18n.no_results);
                return;
            }

            window.ilsHelpers.setCommand('recent', 'term', '/random_post');
            window.ilsHelpers.renderResults(data);
        })
        .catch(() => {
            window.ilsHelpers.showMessage(InitPluginSuiteLiveSearch.i18n.error);
        });
});

This script leverages the full power of the plugin: favorites, thumbnails, excerpts, category filters, infinite scroll — all work out of the box. No need to write any custom HTML or CSS.

Conclusion

With just three snippets, you’ve created a fully functional custom slash command in Init Live Search. The UI handles everything automatically, and your logic controls what data gets displayed.

From here, the possibilities are endless: /featured_post, /most_commented, /today — whatever your use case requires. Init Live Search 1.6.7 puts that power in your hands.

Comments


1 comments
  • Admin

    05/06/2025 lúc 16:09

    You can try the /random_post slash command right here on this page 👌

Web-Based Tools

Press Ctrl + \ on desktop, or swipe left anywhere on mobile.

Login