19 Days To Learn WordPress Day 3 : Enqueuing CSS & JS

Day 3 of my 19 Day challenge to learn WordPress, this is not a tutorial – this is a documentation of all the resources that I used and issues I have encountered in my learning process. A huge thanks to Mr. Digital as I will refer to his Youtube videos as my learning material in this process. If you have not liked or subscribed on his page please feel free to do so.

Takeaways on this Video

  1. front-page.php – default php file for your home page
  2. header.php – this contains the header section of your theme – which allows you to modify your menu and provides a consistent look and feel of your header area as this will be later called on the front-page.php.
  3. footer.php – it is very similar to the header but this time you have your footer elements, you know what I mean.
  4. <?php get_ header();?> – invoke all elements of your header.php usually marks the beginning of your front-page.php.
  5. <?php get_footer();?> – very similar to <?php get_header();?>
  6. <?php wp_head();?> – injects wordpress function.php on our head – insert right after title tag.
  7. <?php wp_footer();?> – same as wp_header. insert before closing body tag.
  8. hook – i guess hooks CSS to wp_head() or wp_footer.
  9. wp_register_style( string $handle, string|bool $src, string[] $deps = array(), string|bool|null $ver = false, string $media = ‘all’ ) – source: developer.wordpress.org
  10. get_template_directory_uri() – gets the root path of wordpress installation
  11. wp_enqueue_style( string $handle, string $src = ”, string[] $deps = array(), string|bool|null $ver = false, string $media = ‘all’ ) – source: developer.wordpress.org
  12. add_action( string $tag, callable $function_to_add, int $priority = 10, int $accepted_args = 1 )- source: developer.wordpress.org

Challenges

  1. 35px top margin/space showing up on the top of my front end. This usually happens when you did not insert the <?php wp_footer();?> on the footer.php. Either you insert the <?php wp_footer();?> before the closing body tag on your footer.php or uncheck Show Toolbar when viewing site on your profile settings.

Error Messages

Leave a Reply

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