#WordPress: GoogleSearch in sidebar

Oggi condivido il mio script “GoogleSearch” con tanto di css e jquery, da inserire nella directory di lavoro del plugin include, e quindi inserire nella sidebar tramite un semplicissimo widget di testo 😉

Cosa sono gli mu-plugins, e sfruttarli per includere codice php all’interno di post/pagine e widget, lo abbiamo spiegato (vedi i link precedenti), e quindi non serve rispiegarlo, vero? 😛

Possiamo passare direttamente al codice da mettere via shortcode in un widget di testo, d’accordo?

<?php defined( 'ABSPATH' ) or exit; ?>
<style type="text/css">
.hidden_customsearch {
    display: none
}
button.changesearch {
    vertical-align: bottom;
    background: 0 0;
    padding: 0;
    color: #007acc;
    line-height: 18px;
    height: 18px
}
button.google-search-submit {
    padding: 3px!important;
    float: right
}
span.gsearch:before,
span.wpsearch:before,
span.gsearch:after, 
span.wpsearch:after {
    font-family: "dashicons";
    vertical-align: middle
}
span.gsearch:before {
    content: "\f462\00a0"
}
span.wpsearch:before {
    content: "\f324\00a0"
}
span.gsearch:after {
    content: "\f139"
}
span.wpsearch:after {
    content: "\f141"
}
.checkbox_sitesearch {
    vertical-align: -2px
}
</style>
<div class="custom_search_form">
    <button class="changesearch" title="Vai a Google Custom Search"><span class="gsearch">Google Search</span></button>
    <?php get_search_form(); ?>
</div>
<div class="hidden_customsearch custom_search_form">
    <button class="changesearch" title="Riutilizza WordPress Search"><span class="wpsearch">WordPress Search</span></button>
    <form role="search" method="get" action="https://www.google.com/search" target="_blank">
        <label>
            <span class="screen-reader-text">Cerca con Google ...</span><input type="search" name="q" placeholder="... Cerca con Google &#x1F50E;" value="" autocomplete="off" required>
        </label>
        <label>
            <input type="checkbox" class="checkbox_sitesearch" name="sitesearch" value="laltroweb.it"><small>Solo su: L'AltroWeb</small>
        </label>
        <button class="google-search-submit" type="submit">Cerca<span class="screen-reader-text">Cerca</span></button>
    </form>
</div>
<script defer>$jqn=jQuery.noConflict(),$jqn(".changesearch").on("click",function(){$jqn(".custom_search_form").each(function(){$jqn(this).hasClass("hidden_customsearch")?$jqn(this).removeClass("hidden_customsearch"):$jqn(this).addClass("hidden_customsearch")})});</script>

Quindi, semplicemente, /wp-admin/widgets.php

Creiamo un nuovo widget di testo e inseriamo

[php_include file='google_custom_search']

Il risultato potete apprezzarlo nella mia sidebar 🙂

Leave a Comment Cancel reply