2

I made my very own WordPress theme from scratch and I don't use a header nor a footer for it (so no header.php or footer.php files present). All of the important content is directly in the index.php file.

So I was wondering where I can put my meta tags in. Specifically this meta tag, 

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

I'm currently making my theme responsive and so far, all my css media queries are not working at all.

Can I just put it in my index.php file or do I have to set up a function in the functions.php file?

Thanks for any help!

Improve this question

2 Answers 2

Reset to default
3

The meta tag should get inserted in the <head> section of a website. Regardless if you are using a header.php and footer.php or not, you should have a <head> section in your document.

For example the code in your document should be something like:

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

Also make sure you are using <?php wp_head(); ?> (before closing </head> section) and <?php wp_footer(); ?> (before closing </body> section) in your theme, as nearly all plugins depend on these. As this codes are default in the header.php and footer.php files.

I guess that is no real WP question it just seems about the meta tag and section.

Improve this answer
1
  • Ahh yes, I was also wondering if this was appropriate for the thread but I've searched else where and found absolutely nothing. I've also realised that the formatting of some of my css media queries were off that's why it wasn't working. Thanks for the help!
    – eastwind
    Commented May 25, 2017 at 2:56
3

Try this in 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">';
}
Improve this answer
2
  • 1
    This is Ok if your theme doesn't have the "meta viewport" set on the /header.php. Otherwise it will be duplicated and may not work.
    – gtamborero
    Commented Mar 8, 2022 at 15:03
  • 2
    @gtamborero we can remove the prev meta tag with this: remove_action('wp_head', '_block_template_viewport_meta_tag', 0); - for block themes with FSE
    – Iggy
    Commented Jan 24, 2023 at 12:07

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.