Un utente ha chiesto informazioni su Ivory Search - WordPress Search Plugin di Wordpress

Digita nascosto sul telefono cellulare (utilizzando il modulo a discesa)

Un utente ha chiesto 👇

La casella di ricerca funziona alla grande sul desktop, ma su un telefono cellulare la digitazione è nascosta dalla tastiera, lo stesso problema di questo post del forum. Ma sto usando un menu a discesa, non un menu a larghezza intera, e la soluzione in quell’altro post del forum ha creato un menu a larghezza intera. C’è un modo per risolvere questo problema utilizzando un menu a discesa?

Questo non ha nulla a che fare con esso, ma ho anche una seconda domanda: come faccio a spostare l’icona di ricerca in una posizione leggermente inferiore sul desktop, in modo che sia allineata con le altre voci del mio menu? Al momento, è di circa 5-10 px più alto degli altri elementi e sarebbe migliore se fosse più basso.

Grazie!

Autore del plugin

(@ vinod-dalvi)

1 anno, 2 mesi fa

Spero che tu stia bene oggi e grazie per la tua domanda.

Puoi risolvere entrambi aggiungendo il codice CSS di seguito nell’opzione CSS personalizzato delle impostazioni del plug-in Ivory Search nel percorso Ivory Ivory -> Impostazioni -> Impostazioni

@media screen and (max-width: 768px){
.is-menu.dropdown form {
    top: 9px;
    right: auto;
    left: 18px;
    }
}

.main-navigation li.is-menu a {
    line-height: 8px;
    padding-top: 14px;
}

I migliori reagenti,

Lanciatore di thread

(@achieve)

1 anno, 2 mesi fa

Ciao Vinod,

Molte grazie per questa rapida risposta e aiuto. C’è ancora un problema: la posizione è fissa, ma la digitazione è ancora nascosta sul dispositivo mobile.

Ecco cosa ho attualmente nel CSS personalizzato:

li.is-menu path {
    fill: #fff;
}
@media screen and (max-width: 768px){
.is-menu.dropdown form {
display: block !important;
    position: static;
    top: 9px;
    right: auto;
    left: 18px;
    }
}

.main-navigation li.is-menu a {
    line-height: 8px;
    padding-top: 14px;
}

La prima parte (li.is-menu path {fill: #fff;}) è rendere vuota l’icona.

Vedi, ho inserito altre due righe nel tuo codice suggerito originale:

display: block !important;
    position: static;

Questo perché quando ho raggiunto quelle linee, l’icona funzionava perfettamente sul desktop e sul tablet, ma sul telefono cellulare non faceva affatto clic. Quando rimetto queste due righe, è possibile fare clic di nuovo … ma la digitazione è nascosta dal popup della tastiera.

Quindi sto ancora cercando una soluzione a questo problema. Fammi sapere cosa fare; Grazie ancora!

Autore del plugin

(@ vinod-dalvi)

1 anno, 2 mesi fa

Prova a modificare il codice CSS condiviso sopra come di seguito.

li.is-menu path {
    fill: #fff;
}

@media screen and (max-width: 768px){
    .mean-container .mean-nav ul li.is-menu > a {
        display: none;
    }
.is-menu.dropdown form {
    display: block !important;
    position: static !important;
    top: 9px !important;
    right: auto !important;
    left: 18px;
    }
}

.main-navigation li.is-menu a {
    line-height: 8px;
    padding-top: 14px;
}

Lanciatore di thread

(@achieve)

1 anno, 2 mesi fa

Ciao Vinod,

Hmm, c’è ancora un problema sul telefono cellulare. Con il nuovo codice, l’icona di ricerca non è più visibile – solo la casella di ricerca – e quando faccio clic sulla casella di ricerca per digitarla, accade la stessa cosa di prima: la tastiera si apre e sfoca la casella, quindi non posso guarda cosa sto digitando. Altri suggerimenti?

Grazie,
Katie

Autore del plugin

(@ vinod-dalvi)

1 anno, 2 mesi fa

Il tuo problema con il tema sembra essere dovuto ad altri temi che scorrono il menu mobile con una barra di scorrimento della pagina come mostrato nel sito sottostante.

https://websitedemos.net/organic-shop-02/

Si prega di contattare l’autore del tema per segnalarlo e risolverlo.

Was this helpful?

0 / 0

Lascia un commento 0

Your email address will not be published. Required fields are marked *