Meta tag viewport en WordPress

Question

Meta tag viewport en WordPress

24 may 2017, 05:34:47

Vistas: 17.4K

Votos: 3

He creado mi propio tema de WordPress desde cero y no uso un encabezado ni un pie de página (por lo que no hay archivos header.php o footer.php presentes). Todo el contenido importante está directamente en el archivo index.php.

Así que me preguntaba dónde puedo colocar mis meta tags. Específicamente este meta tag:

<meta name="viewport" content="width=device-width, initial-scale=1.0"/>

Actualmente estoy haciendo mi tema responsive y hasta ahora, todas mis media queries de CSS no están funcionando.

¿Puedo simplemente colocarlo en mi archivo index.php o debo configurar una función en el archivo functions.php?

¡Gracias por cualquier ayuda!

eastwind

45

desarrollo de temas responsive

Todas las respuestas a la pregunta

Comentarios

Ahh sí, también me preguntaba si esto era apropiado para el hilo, pero he buscado en otros lugares y no encontré absolutamente nada. También me di cuenta de que el formato de algunas de mis consultas de medios CSS estaba mal, por eso no funcionaba. ¡Gracias por la ayuda!

eastwind

25 may 2017 05:56:20

Prueba esto en functions.php

add_action( 'wp_head', 'add_viewport_meta_tag' , '1' );

function add_viewport_meta_tag() {
    echo '<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">';
}

Muddasir Abbas

201

16 feb 2019 15:47:51

Comentarios

Está bien si tu tema no tiene la etiqueta "meta viewport" configurada en el /header.php. De lo contrario, se duplicará y puede que no funcione.

gtamborero

8 mar 2022 17:03:57

@gtamborero podemos eliminar la meta etiqueta previa con esto: remove_action('wp_head', '_block_template_viewport_meta_tag', 0); - para temas de bloques con FSE

Iggy

24 ene 2023 14:07:42

LWS-Mo 1.59K · Accepted Answer · 2017-05-24T12:38:10Z

La etiqueta meta debe insertarse en la sección <head> de un sitio web. Independientemente de si estás usando un header.php y footer.php o no, deberías tener una sección <head> en tu documento.

Por ejemplo, el código en tu documento debería ser algo así:

<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
<meta charset="<?php bloginfo( 'charset' ); ?>">
<meta name="viewport" content="width=device-width, initial-scale=1">

También asegúrate de usar <?php wp_head(); ?> (antes de cerrar la sección </head>) y <?php wp_footer(); ?> (antes de cerrar la sección </body>) en tu tema, ya que casi todos los plugins dependen de estos. Estos códigos son predeterminados en los archivos header.php y footer.php.

Supongo que esto no es realmente una pregunta sobre WP, parece más sobre la etiqueta meta y la sección.

LWS-Mo

1.59K

24 may 2017 12:38:10