Does not load the style.css in wordpress

Asked

Viewed 637 times

0

I am studying Wordpress, but, I could not use functions.php to load the stylesheet

These are the files

css style.

/*
Theme Name: Tema Estudo
Author: A
Version: 1.0.0
*/

body{
    color:  #4d5a6c !important;
}

header.php

<!DOCTYPE html>
<html lang="en">
<head>
    <?php wp_head(); ?>
</head>
<body>

<h2>Este é o header</h2>

index php.

<?php get_header();

while (have_posts()) {
    the_post();
?>
<h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
<?php the_content();

}

get_footer();
?>

footer.php

<h4>Este é o footer</h4>
<?php wp_footer(); ?>
</body>
</html>

functions.php

<?php 
function arquivos_estilo(){
    wp_enqueue_style('estilo_principal', get_stylesheet_uri());
}

add_action('wp_enqueue_scripts', 'arquivos_estilo');

Why don’t you read the style?

What returns is the following:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta name='robots' content='noindex,follow' />
<link rel='dns-prefetch' href='//s.w.org' />
        <script type="text/javascript">
            window._wpemojiSettings = {"baseUrl":"https:\/\/s.w.org\/images\/core\/emoji\/11\/72x72\/","ext":".png","svgUrl":"https:\/\/s.w.org\/images\/core\/emoji\/11\/svg\/","svgExt":".svg","source":{"concatemoji":"http:\/\/localhost\/estudo\/wp-includes\/js\/wp-emoji-release.min.js?ver=5.0.2"}};
            !function(a,b,c){function d(a,b){var c=String.fromCharCode;l.clearRect(0,0,k.width,k.height),l.fillText(c.apply(this,a),0,0);var d=k.toDataURL();l.clearRect(0,0,k.width,k.height),l.fillText(c.apply(this,b),0,0);var e=k.toDataURL();return d===e}function e(a){var b;if(!l||!l.fillText)return!1;switch(l.textBaseline="top",l.font="600 32px Arial",a){case"flag":return!(b=d([55356,56826,55356,56819],[55356,56826,8203,55356,56819]))&&(b=d([55356,57332,56128,56423,56128,56418,56128,56421,56128,56430,56128,56423,56128,56447],[55356,57332,8203,56128,56423,8203,56128,56418,8203,56128,56421,8203,56128,56430,8203,56128,56423,8203,56128,56447]),!b);case"emoji":return b=d([55358,56760,9792,65039],[55358,56760,8203,9792,65039]),!b}return!1}function f(a){var c=b.createElement("script");c.src=a,c.defer=c.type="text/javascript",b.getElementsByTagName("head")[0].appendChild(c)}var g,h,i,j,k=b.createElement("canvas"),l=k.getContext&&k.getContext("2d");for(j=Array("flag","emoji"),c.supports={everything:!0,everythingExceptFlag:!0},i=0;i<j.length;i++)c.supports[j[i]]=e(j[i]),c.supports.everything=c.supports.everything&&c.supports[j[i]],"flag"!==j[i]&&(c.supports.everythingExceptFlag=c.supports.everythingExceptFlag&&c.supports[j[i]]);c.supports.everythingExceptFlag=c.supports.everythingExceptFlag&&!c.supports.flag,c.DOMReady=!1,c.readyCallback=function(){c.DOMReady=!0},c.supports.everything||(h=function(){c.readyCallback()},b.addEventListener?(b.addEventListener("DOMContentLoaded",h,!1),a.addEventListener("load",h,!1)):(a.attachEvent("onload",h),b.attachEvent("onreadystatechange",function(){"complete"===b.readyState&&c.readyCallback()})),g=c.source||{},g.concatemoji?f(g.concatemoji):g.wpemoji&&g.twemoji&&(f(g.twemoji),f(g.wpemoji)))}(window,document,window._wpemojiSettings);
        </script>
        <style type="text/css">
img.wp-smiley,
img.emoji {
    display: inline !important;
    border: none !important;
    box-shadow: none !important;
    height: 1em !important;
    width: 1em !important;
    margin: 0 .07em !important;
    vertical-align: -0.1em !important;
    background: none !important;
    padding: 0 !important;
}
</style>
<link rel='stylesheet' id='wp-block-library-css'  href='http://localhost/estudo/wp-includes/css/dist/block-library/style.min.css?ver=5.0.2' type='text/css' media='all' />
<link rel='https://api.w.org/' href='http://localhost/estudo/wp-json/' />
<link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://localhost/estudo/xmlrpc.php?rsd" />
<link rel="wlwmanifest" type="application/wlwmanifest+xml" href="http://localhost/estudo/wp-includes/wlwmanifest.xml" /> 
<meta name="generator" content="WordPress 5.0.2" />
</head>
<body>

<h2>Este é o header</h2><h2><a href="http://localhost/estudo/2018/12/31/terceiro-post/">Terceiro post</a></h2>

<p>este é o terceiro</p>
<h2><a href="http://localhost/estudo/2018/12/31/segundo-post/">Segundo post</a></h2>

<p>loremasfas ffsdfsdfsdfsd ssfsdfsdsds</p>
<h2><a href="http://localhost/estudo/2018/12/31/ola-mundo/">Olá, mundo!</a></h2>

<p>Boas-vindas ao WordPress. Esse é o seu primeiro post. Edite-o ou exclua-o, e então comece a escrever!</p>
<h4>Este é o footer</h4>
<script type='text/javascript' src='http://localhost/estudo/wp-includes/js/wp-embed.min.js?ver=5.0.2'></script>
</body>
</html>
css wordpress

1 answer

1


You didn’t link the css in head, try it like this:

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

get_stylesheet_uri() returns the css url of the currently enabled theme

  • It worked your way, but, you know explain to me why functions didn’t pull stylesheet?

Browser other questions tagged css wordpress

You are not signed in. Login or sign up in order to post.