How to move the Random in the menu bar to the front of the Search

[scmaybee]

As the Search box will be extend when actived, I want the Random could be in a fixed position.

 

[Anomaly]

You'll find the relevant file in app/themes/Peafowl/header.php (Make sure you edit this for every theme you want to be active, because it's a per-theme edit.)

You're looking to cut this bit

<?php if (CHV\getSetting('website_random')) {
                                    ?>
                            <li id="top-bar-random" data-nav="random" class="top-btn-el">
                                <a href="<?php echo G\get_base_url('?random'); ?>"><span class="top-btn-text"><span class="icon icon-shuffle"></span><span class="btn-text phone-hide phablet-hide"><?php _se('Random'); ?></span></span></a>
                            </li>
                        <?php
                                } ?>

and paste it after this bit

<?php if (is_content_manager()) { ?>
                        <li id="top-bar-moderate" data-nav="moderate" class="top-btn-el<?php if (in_array(G\get_route_name(), ['moderate'])) {
                                    ?> current<?php
                                } ?>"">
                            <a href="<?php echo G\get_base_url('moderate'); ?>"><span class="top-btn-text"><span class="icon icon-download2"></span><span class="btn-text phone-hide phablet-hide"><?php _se('Moderate'); ?></span></span></a>
                        </li>
                        <?php } ?>

such that this

[CODE highlight="29-35"] <?php if (is_content_manager()) { ?>
<li id="top-bar-moderate" data-nav="moderate" class="top-btn-el<?php if (in_array(G\get_route_name(), ['moderate'])) {
?> current<?php
} ?>"">
<a href="<?php echo G\get_base_url('moderate'); ?>"><span class="top-btn-text"><span class="icon icon-download2"></span><span class="btn-text phone-hide phablet-hide"><?php _se('Moderate'); ?></span></span></a>
</li>
<?php } ?>

<?php if (is_search_enabled()) {
?>
<li data-action="top-bar-search" data-nav="search" class="phone-hide pop-btn">
<span class="top-btn-text"><span class="icon icon-search"></span><span class="btn-text phone-hide phablet-hide"><?php _se('Search'); ?></span></span>
</li>
<li data-action="top-bar-search-input" class="top-bar-search-input phone-hide pop-btn pop-keep-click hidden">
<div class="input-search">
<form action="<?php echo G\get_base_url('search/images'); ?>/" method="get">
<input class="search" type="text" placeholder="<?php _se('Search'); ?>" autocomplete="off" spellcheck="false" name="q">
</form>
<span class="icon-search"></span><span class="icon close icon-close" data-action="clear-search" title="<?php _se('Close'); ?>"></span><span class="icon settings icon-triangle-down" data-modal="form" data-target="advanced-search" title="<?php _se('Advanced Search'); ?>"></span>
</div>
</li>
<div class="hidden" data-modal="advanced-search">
<span class="modal-box-title"><?php _se('Advanced Search'); ?></span>
<?php G\Render\include_theme_file('snippets/form_advanced_search'); ?>
</div>
<?php
} ?>

<?php if (CHV\getSetting('website_random')) {
?>
<li id="top-bar-random" data-nav="random" class="top-btn-el">
<a href="<?php echo G\get_base_url('?random'); ?>"><span class="top-btn-text"><span class="icon icon-shuffle"></span><span class="btn-text phone-hide phablet-hide"><?php _se('Random'); ?></span></span></a>
</li>
<?php
} ?>[/CODE]

becomes this

[CODE highlight="9-15"]<?php if (is_content_manager()) { ?>
<li id="top-bar-moderate" data-nav="moderate" class="top-btn-el<?php if (in_array(G\get_route_name(), ['moderate'])) {
?> current<?php
} ?>"">
<a href="<?php echo G\get_base_url('moderate'); ?>"><span class="top-btn-text"><span class="icon icon-download2"></span><span class="btn-text phone-hide phablet-hide"><?php _se('Moderate'); ?></span></span></a>
</li>
<?php } ?>

<?php if (CHV\getSetting('website_random')) {
?>
<li id="top-bar-random" data-nav="random" class="top-btn-el">
<a href="<?php echo G\get_base_url('?random'); ?>"><span class="top-btn-text"><span class="icon icon-shuffle"></span><span class="btn-text phone-hide phablet-hide"><?php _se('Random'); ?></span></span></a>
</li>
<?php
} ?>

<?php if (is_search_enabled()) {
?>
<li data-action="top-bar-search" data-nav="search" class="phone-hide pop-btn">
<span class="top-btn-text"><span class="icon icon-search"></span><span class="btn-text phone-hide phablet-hide"><?php _se('Search'); ?></span></span>
</li>
<li data-action="top-bar-search-input" class="top-bar-search-input phone-hide pop-btn pop-keep-click hidden">
<div class="input-search">
<form action="<?php echo G\get_base_url('search/images'); ?>/" method="get">
<input class="search" type="text" placeholder="<?php _se('Search'); ?>" autocomplete="off" spellcheck="false" name="q">
</form>
<span class="icon-search"></span><span class="icon close icon-close" data-action="clear-search" title="<?php _se('Close'); ?>"></span><span class="icon settings icon-triangle-down" data-modal="form" data-target="advanced-search" title="<?php _se('Advanced Search'); ?>"></span>
</div>
</li>
<div class="hidden" data-modal="advanced-search">
<span class="modal-box-title"><?php _se('Advanced Search'); ?></span>
<?php G\Render\include_theme_file('snippets/form_advanced_search'); ?>
</div>
<?php
} ?>[/CODE]

Remember that you'll have to redo this when you update Chevereto (as far as my searching could find, I don't think there's a way to override header; if someone knows a way please correct me!) if you use the default Peafowl theme and will need to manually keep custom themes updated by comparing files from the new Peafowl to the old customizations, lest everything go wonky and you potentially miss out on new features.

 

[Anomaly]

Can't edit my post, but I have returned to say that I figured out that you can, in fact, override the header. I'm a bit daft and forgot that you can put things in the overrides folder directly not only within folders. So, the proper steps would be to make a copy of app/themes/Peafowl/header.php and place that copy in app/themes/Peafowl/overrides folder. Then, edit that copy (the file now at app/themes/Peafowl/overrides/header.php) as instructed above. You, of course, will have to maintain checking for changes after updating Chevereto - as per the usual with all overrides and custom themes.