Rilevare la larghezza dello schermo nelle funzioni

Question

Rilevare la larghezza dello schermo nelle funzioni

5 giu 2017, 11:38:47

Visualizzazioni: 14.5K

Voti: 1

Sto cercando un modo per aggiungere A prima del menu se siamo su desktop e aggiungere B se siamo su un dispositivo mobile.

Questo è il codice delle mie funzioni per A e B:

add_action( 'wp_head', 'A_function' );
function A_function() {
    //aggiungi A
}
add_filter( 'wp_nav_menu_items', 'B_function', 10, 2 );
function B_function() {
    //aggiungi B
}

So che devo inserire questi hook nel file functions.php ma non so come fare, so che possiamo usare wp_is_mobile().

Come posso ottenere questo risultato?

Yoona

45

mobile

Commenti

non è possibile farlo in modo affidabile lato server perché non sappiamo molto dello schermo del dispositivo. Questo rende anche impossibile fare caching e fallisce quando si hanno dispositivi che cambiano dimensione, ad esempio finestre del browser, telefoni pieghevoli, modalità schermo diviso, ecc. Usa invece le media query CSS per spostare gli elementi lato client

Tom J Nowell

16 gen 2023 15:01:19

Tutte le risposte alla domanda

Commenti

idea pessima, non è affidabile, rompe la cache, non è responsive e probabilmente ha altri attributi negativi

Mark Kaplun

5 giu 2017 12:32:37

@MarkKaplun Beh, non riesco a pensare a nessun altro metodo lato server per farlo, e non credo che potremo farlo via AJAX visto che i filtri vengono già applicati dopo il caricamento della pagina? Dobbiamo scegliere tra il male e il peggio (qui non si applica il termine "cattivo")

Johansson

5 giu 2017 12:36:36

Il codice PHP di WordPress viene eseguito lato server — non è e non può essere consapevole dello schermo del dispositivo del client.

wp_is_mobile() si basa sull'user agent sniffing, ovvero cerca di confrontare i dati forniti dal browser del client. Questa tecnica è considerata notoriamente inaffidabile e di utilità molto limitata.

Poiché non fornisci il contesto sullo scopo dei tuoi link, è difficile consigliare un approccio adatto. Le tecniche lato client, come le media query CSS, sono comunemente utilizzate per un rilevamento affidabile del contesto nel browser del client.

Rarst

100K

5 giu 2017 12:13:46

wp_is_mobile() non dovrebbe mai essere utilizzato. Al momento attuale, la sua esistenza è principalmente legata ad alcuni bug del browser che devono essere gestiti lato amministrativo.

Per qualsiasi cosa che necessiti di essere consapevole della dimensione fisica del dispositivo o della dimensione della finestra del browser, dovrebbe essere fatto con regole media in CSS e JavaScript.

Mark Kaplun

23.7K

5 giu 2017 12:38:13

Commenti

Penso che il problema sia che l'OP sta cercando di aggiungere contenuto HTML in base all'user agent, il che renderebbe il CSS obsoleto. Potrei solo pensare di inserire l'intero codice in un file JavaScript e gestire il problema lì.

Johansson

5 giu 2017 12:42:49

il modo corretto per farlo è semplicemente aggiungerlo sempre e disabilitarne la visualizzazione quando non necessario. Non c'è davvero altro modo... almeno non se vuoi essere responsive

Mark Kaplun

5 giu 2017 13:11:01

Johansson 15.4K · Accepted Answer · 2017-06-05T12:11:26Z

Secondo il codex, wp_is_mobile(); è una funzione booleana che restituisce true se l'utente sta visitando il sito da un dispositivo mobile, quindi quello che ti serve è:

if ( wp_is_mobile() ) {
    // Esegui questo solo per i visitatori da mobile
    add_filter( 'wp_nav_menu_items', 'B_function', 10, 2 ); function B_function(/* aggiungi B */ );
} else {
    // Se non siamo su mobile, esegui questo filtro
    add_action( 'wp_head', 'A_function' ); function A_function(/* aggiungi A */);
}

Johansson

15.4K

5 giu 2017 12:11:26