#1. First, you need to edit Site Footer
and add a Search Block
#2. Use this code to Code Injection Footer to move Search under Header
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script> <script> $(document).ready(function(){ $('footer.sections .search-block').appendTo('header#header'); }); </script>
You will have
#3. Use this code to Custom CSS box
header#header + .search-block { position: relative; top: 97px; transition: all 0.3s; background-color: #fff; padding: 0px !important; } header#header.shrink + .search-block { transition: all 0.3s; transform: translateY(-300px); }
Result: