search.phtml

<?php
/**
 * Copyright © Magefan (support@magefan.com). All rights reserved.
 * Please visit Magefan.com for license details (https://magefan.com/end-user-license-agreement).
 *
 * Glory to Ukraine! Glory to the heroes!
 */
?>
<?php
/**
 * Blog sidebar search form template
 *
 * @var $block \Magefan\Blog\Block\Sidebar\Search
 * @var $mfSecureRenderer \Magefan\Community\Api\SecureHtmlRendererInterface
 */
?>

<div class="widget block blog-search" data-bind="scope: 'blog-search'">
    <div class="block-content">
        <form class="form" id="blog_search_mini_form"
              action="<?= $block->escapeUrl($block->getFormUrl()) ?>"
              method="get">
            <div class="field search">
                <label class="label" for="blog_search">
                    <span><?= $block->escapeHtml(__('Search')) ?></span>
                </label>
                <div class="control mfsearch">
                    <input id="blog_search"
                           type="text"
                           name="q"
                           value="<?= $block->escapeHtml($block->getQuery()) ?>"
                           placeholder="<?= $block->escapeHtml(__('Search posts here...')) ?>"
                           class="input-text"
                           maxlength="128" role="combobox"
                           aria-haspopup="false"
                           aria-autocomplete="both"
                           autocomplete="off">
                    <?= $block->getChildHtml('form_additional') ?>
                </div>
            </div>
            <div class="actions">
                <button type="submit"
                        title="<?= $block->escapeHtml(__('Search')) ?>"
                        class="action search">
                    <span><?= $block->escapeHtml(__('Search')) ?></span>
                </button>
            </div>

        </form>
    </div>
</div>

<?php $script = "
    document.addEventListener('DOMContentLoaded', function() {
        var form = document.getElementById('blog_search_mini_form');
        form.addEventListener('submit', function(event) {
            event.preventDefault();
            var bs = document.getElementById('blog_search');
            var value = bs.value;
            if (value) {
                bs.remove();
                var a = form.action;
                form.action = a + ( ('/' != a.charAt(a.length - 1)) ? '/' : '' ) + encodeURI(value) + '/';
            }
            form.submit()
        });
    });
"; ?>
<?= /* @noEscape */ $mfSecureRenderer->renderTag('script', [], $script, false) ?>