CODEWITHSUNDEEP
phphtmlcsswordpress
Samuël
Samuël

Reputation: 165

How to link to CSS properly in WordPress header.php?

I have been trying to create a WordPress theme but linking to style.css within header.php doesn't seems to work, the header just doesn't appear. Used more than 30 codes even the ones provided by WordPress and people with similar errors but it seems like the solutions are outdated.

<link href="<?php bloginfo('stylesheet_url'); ?>" rel = "stylesheet">

This is my PHP script

<!DOCTYPE html>
<html>

<head>
    <title>Welcome</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link href="<?php bloginfo('stylesheet_url'); ?>" rel="stylesheet">
</head>

<body>
    <div class="navbar navbar-default navbar-static-top">
        <div class="container"> <a href="#" class="navbar-brand">Logo</a>

            <button class="navbar-toggle" data-toggle="collapse" data-target=".navHeaderCollapse"> <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <div class="collapse navbar-collapse navHeaderCollapse">
                <ul class="nav navbar-nav navbar-right">
                    <li class="active"><a href="#">Home</a>
                    </li>
                    <li><a href="#">Contact</a>
                    </li>
                    <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown">Social Media<b class = "caret"></b></a>

                        <ul class="dropdown-menu">
                            <li><a href="#">Facebook</a>
                            </li>
                            <li><a href="#">Instagram</a>
                            </li>
                            <li><a href="#">Twitter</a>
                            </li>
                            <li><a href="#">Google Plus</a>
                            </li>
                        </ul>
                    </li>   <a href="http://www.adds.com" class="navbar-btn btn-success btn pull-right">Add</a>

                </ul>
            </div>
        </div>
    </div>
    <div class="container">

Upvotes: 11

Views: 90454

Answers (9)

Sharad Kumar Yadav
Sharad Kumar Yadav

Reputation: 14

You can include css in header.php file as follow:

<link rel="stylesheet" href="<?php echo bloginfo('template_url').'/custom.css'; ?>">

Upvotes: 0

AtLeastTheresToast
AtLeastTheresToast

Reputation: 387

refer to https://wordpress.stackexchange.com/a/220719 update the fuction.php file through the Wordpress Dashboard > Appearance > Theme Editor theme files are listed on the right.

add the following to your function.php file

wp_enqueue_style ('style-name', get_template_directory_uri().'/mystylefile.css');

flush your word press cache and make sure you FTP the file up to the root of the theme.

Upvotes: 1

Dipak Kumar Pusti
Dipak Kumar Pusti

Reputation: 1723

Your theme style.css is included by default by the WordPress by wp_head() function. Before you end your HEAD tag add this function.

<?php wp_head(); ?>

If you want to add additional stylesheets then use this function in your functions.php file.

function additional_custom_styles() {

    /*Enqueue The Styles*/
    wp_enqueue_style( 'uniquestylesheetid', get_template_directory_uri() . '/css/custom.css' ); 
}
add_action( 'wp_enqueue_scripts', 'additional_custom_styles' );

Upvotes: 18

kulbhushan
kulbhushan

Reputation: 1

Just include this in the header, don't put style.css here

<?php wp_enqueue_style( 'style', get_stylesheet_uri() ); ?>

if you are adding Bootstrap CDN then use that like this

<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">

Upvotes: -2

Brad Allen
Brad Allen

Reputation: 1

Put the following under wp_head();

<link rel="stylesheet" href="<?php echo get_stylesheet_uri(); ?>" type="text/css" media="screen" />

Upvotes: 0

Shah Rukh
Shah Rukh

Reputation: 3156

you can try this one 

 <?php echo get_stylesheet_uri(); ?>

instead of this

<?php bloginfo('stylesheet_url'); ?>

from here

make sure your style.css file is in your theme's directory

Upvotes: 3

Nico Martin
Nico Martin

Reputation: 1278

For me this works great:

<link rel="stylesheet" type="text/css" href="<?php bloginfo("template_directory"); ?>/style.css" />

Upvotes: 4

user321531
user321531

Reputation:

Have you tried:

<link rel="stylesheet" type="text/css" href="<?php echo get_stylesheet_directory_uri(). '/style.css' ?>">

And have that file (I usually place it in a header.php file) in the same directory as the style.css file?

This is what I do.

Upvotes: 12

s.lenders
s.lenders

Reputation: 1149

Use the following code

<link rel="stylesheet" href="<?php echo get_stylesheet_uri(); ?>" type="text/css" media="screen" />

Hope that helps

Upvotes: 0

Related Questions