admin管理员组文章数量:1336091
So I have the following structure in my theme:
Themes/
- theme-name/
-- functions.php
-- style.css
-- page-directories.php
For some reason, I'm unable to link the style.css to be included for my page-directories.php file.
Here is what I have inside the functions.php:
function register_directories_style() {
wp_register_style('style', get_template_directory_uri(), [], 1);
wp_enqueue_style('style');
}
add_action( 'wp_enqueue_scripts', 'register_directories_style');
Here is what's inside my page-directories.php file:
<?php
/* Template Name: Directories */
?>
<!-- All CDN Scripts to be converted later -->
<link href="//maxcdn.bootstrapcdn/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="//code.jquery/jquery-1.11.1.min.js"></script>
<link href=".4.0/css/font-awesome.min.css" rel='stylesheet' type='text/css'>
<!-- The actual panel -->
<div class="container">
<div class="row">
<div class="col-md-10 col-md-offset-1">
<div class="panel panel-default panel-table">
<div class="panel-heading">
<div class="row">
<div class="col col-xs-6">
<h3 class="panel-title">Panel Heading</h3>
</div>
<div class="col col-xs-6 text-right">
<button type="button" class="btn btn-sm btn-primary btn-create">Create New</button>
</div>
</div>
</div>
<div class="panel-body">
<table class="table table-striped table-bordered table-list">
<thead>
<tr>
<th><em class="fa fa-cog"></em></th>
<th class="hidden-xs">ID</th>
<th>Name</th>
<th>Email</th>
</tr>
</thead>
<tbody>
<tr>
<td align="center">
<a class="btn btn-default"><em class="fa fa-pencil"></em></a>
<a class="btn btn-danger"><em class="fa fa-trash"></em></a>
</td>
<td class="hidden-xs">1</td>
<td>John Doe</td>
<td>[email protected]</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
I have the template selected on the page, but for some reason the style.css stylesheet won't apply to the page.
Also, how would I be able to select a stylesheet inside a folder such as css/directories.css?
So I have the following structure in my theme:
Themes/
- theme-name/
-- functions.php
-- style.css
-- page-directories.php
For some reason, I'm unable to link the style.css to be included for my page-directories.php file.
Here is what I have inside the functions.php:
function register_directories_style() {
wp_register_style('style', get_template_directory_uri(), [], 1);
wp_enqueue_style('style');
}
add_action( 'wp_enqueue_scripts', 'register_directories_style');
Here is what's inside my page-directories.php file:
<?php
/* Template Name: Directories */
?>
<!-- All CDN Scripts to be converted later -->
<link href="//maxcdn.bootstrapcdn/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="//code.jquery/jquery-1.11.1.min.js"></script>
<link href="https://cdnjs.cloudflare/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css" rel='stylesheet' type='text/css'>
<!-- The actual panel -->
<div class="container">
<div class="row">
<div class="col-md-10 col-md-offset-1">
<div class="panel panel-default panel-table">
<div class="panel-heading">
<div class="row">
<div class="col col-xs-6">
<h3 class="panel-title">Panel Heading</h3>
</div>
<div class="col col-xs-6 text-right">
<button type="button" class="btn btn-sm btn-primary btn-create">Create New</button>
</div>
</div>
</div>
<div class="panel-body">
<table class="table table-striped table-bordered table-list">
<thead>
<tr>
<th><em class="fa fa-cog"></em></th>
<th class="hidden-xs">ID</th>
<th>Name</th>
<th>Email</th>
</tr>
</thead>
<tbody>
<tr>
<td align="center">
<a class="btn btn-default"><em class="fa fa-pencil"></em></a>
<a class="btn btn-danger"><em class="fa fa-trash"></em></a>
</td>
<td class="hidden-xs">1</td>
<td>John Doe</td>
<td>[email protected]</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
I have the template selected on the page, but for some reason the style.css stylesheet won't apply to the page.
Also, how would I be able to select a stylesheet inside a folder such as css/directories.css?
3 Answers
Reset to default 1get_template_directory_uri() just returns the directory of the current theme, not the link to the actual stylesheet.
In functions.php try:
function register_directories_style() {
wp_register_style('style', get_template_directory_uri().'/style.css', [], 1);
wp_enqueue_style('style');
}
add_action( 'wp_enqueue_scripts', 'register_directories_style');
if you wanted to select a different stylesheet, you just updated the $src arguement. e.g.
function register_directories_style() {
wp_register_style('directory_style', get_template_directory_uri().'/css/directories.css', [], 1);
wp_enqueue_style('directory_style');
}
add_action( 'wp_enqueue_scripts', 'register_directories_style');
1 - This is what the wp_enqueue_style and wp_register_style functions take as arguments:
($handle:string, $src:string, $deps:array, $ver:string|boolean|null, $media:string );
So you can use the following code to enqueue your main style (don't forget to add the header comment section in you style.css):
function register_directories_style() {
wp_enqueue_style("stylesheet", get_stylesheet_uri(), null, "1.0.0", "all");
}
add_action( 'wp_enqueue_scripts', 'register_directories_style');
2 - the style.css stylesheet won't apply to the Directories page you have to add the following function in your template header <?php wp_head() ?>
Part of the problem you're experiencing is the way you're adding extra scripts to your directories template. You should be enqueuing all of them. And you don't need to manually add jQuery because WordPress already loads it. Try set-up instead, with the scripts that require jQuery you just add it as a dependency like in the last enqueue line where we include bootstrap.js and then add the array('jquery').
function register_directories_style() {
wp_enqueue_style( 'directories', get_template_directory_uri(), array(), '1' );
wp_enqueue_style( 'bootstrap', '//maxcdn.bootstrapcdn/bootstrap/3.3.0/css/bootstrap.min.css', array(), '3.3.0' );
wp_enqueue_style( 'fontawesome', 'https://cdnjs.cloudflare/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css', array(), '4.4.0' );
wp_enqueue_script( 'bootstrap', '//maxcdn.bootstrapcdn/bootstrap/3.3.0/js/bootstrap.min.js', array('jquery'), '3.3.0', true );
}
add_action( 'wp_enqueue_scripts', 'register_directories_style' );
本文标签： theme developmentStylesheet not linking
版权声明：本文标题：theme development - Stylesheet not linking 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1742393240a2466406.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。
发表评论