Link Bootstrap and Style.css to WordPress Theme through functions.php

In this article, we will learn about how to link bootstrap and style.css to WordPress theme through function.php. You can also link your .css and .js files in the header but this is a bad idea. Actually, the most usable and preferable way to link this files is using function.php. This is a very simple way to link your file with funciton.php.

First Create new functions.php file in the WordPress theme root folder. Make sure the name is exactly same otherwise WordPress file hierarchy not recognize this file and ignore it.

After you create functions.php file. Now we want to create a function that registers style and javascript files if source provided.

Before we create functions in the functions.php file we need to create a Style.css file. So Create a Style.css file in the WordPress theme root folder. If you place a Style.css file in other folder or any other folder destination you did not saw your theme in the WordPress appearance.

Now, If you want to Extract bootstrap files in the WordPress folder then you can do. But we are using bootstrap CDN to access bootstrap classes. Using CDN you do not want to download or extract bootstrap files in your theme directory. You are free to use any of this method.

Now create a function in functions.php file.

You are free to use any name for this function.

So now just register Style.css and Bootstrap CSS file.

After you link CSS files if you need to link Js files also. So we will link js files using  wp_enqueue_script()  Function.

At the last, We need to call this function. So WordPress has a special function called  add_action() . This function will call custom_stylesheet() our  function.

Now you have successfully link bootstrap and style.css to WordPress theme. If you want you can link more files but this will increase page load time. So link only those files which are necessary.

In the previous article, we learn about creating a custom header and footer read this article.

In the next article, we will style header navigation and footer navigation menu.