I asked this question before and the solution worked at that time when I asked! However it is not working anymore for some odd reason. I was hesitant to 'ask' the question again but I can't seem to find a solution. So what I am asking now is how to properly add css to a website using the functions.php. enter image description here

Here is my functions.php code to add the css:

<?php 
    function fearnothing_script_enqueue(){
        wp_enqueue_style('customstyle',  get_template_directory_uri().'/css/fearnothing.css',array(), '1.1.1', 'all');


    }

    add_action('wp_enqueue_scripts', 'wp_enqueue_style');

Here is my fearnothing.css (i've been working on my website offline and the css works properly there so I don't know what the issue is with my functions.php file not adding css to my website):

html,
body {
    margin: 0;
    color: #91f213;
    background: black;
    font: sans-serif;
    cursor: pointer;
}

body{
    padding: 20px;
}
.video-container {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 100%;
    height: 100%; 
    overflow: hidden;
}
.video-container video {
    /* Make video to at least 100% wide and tall */
    min-width: 100%; 
    min-height: 100%; 

    /* Setting width & height to auto prevents the browser from stretching or squishing the video */
    width: auto;
    height: auto;

    /* Center the video */
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

header.php

<!DOCTYPE html>
<html>
<head>
    <title>lonely spaceship</title>
    <?php wp_head(); ?>
</head>
<!-- <div class="video-container">
        <video autoplay="true" muted="true" loop="true">
            <source src="wp-content/themes/fearnothing/earth.mp4" type="video/mp4" >
        </video> -->
</div>
<body>
    <p> This is a test text</p>

index.php

<?php get_header(); ?>

<p>Test index text</p>


<?php get_footer(); ?>

footer.php

        <footer>
            <p></p>
        </footer>
        <?php wp_footer(); ?>
    </body>
</html>
  • Does your theme have wp_head() in the header? – Jacob Peattie Nov 28 at 12:12
  • Yes, <?php wp_head(); ?> – peter-cs Nov 28 at 12:13
  • please check get_template_directory_uri(). path working or not – vikrant zilpe Nov 28 at 12:15
  • jacob is right answer please check – vikrant zilpe Nov 28 at 12:18
  • Is this a child theme? – Tom J Nowell Nov 28 at 12:20
up vote 5 down vote accepted

Your add_action() is incorrect:

add_action('wp_enqueue_scripts', 'wp_enqueue_style');

The 2nd argument is supposed to be the function that you enqueue your stylesheet in. In you case that's fearnothing_script_enqueue():

add_action( 'wp_enqueue_scripts', 'fearnothing_script_enqueue' );
  • jacob is right anser – vikrant zilpe Nov 28 at 12:17
  • I feel so embarrassed, I'm currently using sublime to code my website it would have been better I could debug it. Any suggestions for coding websites? – peter-cs Nov 28 at 12:19
  • 1
    I use SublimeText myself, the editor is fine for WP development, I doubt even PHPStorm would have caught this error, but reading the docs would. If this is the correct answer you should mark it as accepted by clicking the tick under the vote counter and turning it green – Tom J Nowell Nov 28 at 12:21
  • please add this code – vikrant zilpe Nov 28 at 12:21

Your Answer

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

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