![eycatch](https://whatswp.t-haku.com/wp-content/uploads/example-css.png)
CSSファイルを指定
![テマ](https://whatswp.t-haku.com/wp-content/themes/whatswp/balloon/b-theme.png)
テーマ有効化したのでサイトを表示すればいいにゃ?
![ワープ](https://whatswp.t-haku.com/wp-content/themes/whatswp/balloon/b-wp.png)
ではサイトを表示してみるにゃ。
![](https://whatswp.t-haku.com/wp-content/uploads/view-site.png)
![ワープ](https://whatswp.t-haku.com/wp-content/themes/whatswp/balloon/b-wp.png)
VIEW SITEをクリックしてサイトを表示するにゃ。
![](https://whatswp.t-haku.com/wp-content/uploads/view-example-site.png)
![テマ](https://whatswp.t-haku.com/wp-content/themes/whatswp/balloon/b-theme.png)
HTMLと表示がちがうにゃ。
![ワープ](https://whatswp.t-haku.com/wp-content/themes/whatswp/balloon/b-wp.png)
サイトのURLがhttp://example.local/なのに対してCSSファイルはテーマフォルダの下にあるのでCSSファイルの指定が効かなくなっているにゃ。
index.php
<!DOCTYPE HTML>
<html lang="ja">
<head>
<title>ページタイトル - サイトタイトル</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="style.css" />
</head>
<body>
![ワープ](https://whatswp.t-haku.com/wp-content/themes/whatswp/balloon/b-wp.png)
WordPressのしくみでCSSファイルを指定するために7行目を<?php wp_head(); ?>に変更するにゃ。
index.php
<!DOCTYPE HTML>
<html lang="ja">
<head>
<title>ページタイトル - サイトタイトル</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<?php wp_head(); ?>
</head>
<body>
![ワープ](https://whatswp.t-haku.com/wp-content/themes/whatswp/balloon/b-wp.png)
functions.phpでstyle.cssファイルを指定するにゃ。
functions.php
<?php
function example_register_styles() {
wp_enqueue_style( 'example-style', get_stylesheet_uri(), [ ], wp_get_theme()->get( 'Version' ) );
}
add_action( 'wp_enqueue_scripts', 'example_register_styles' );
![](https://whatswp.t-haku.com/wp-content/uploads/example-php.png)
![テマ](https://whatswp.t-haku.com/wp-content/themes/whatswp/balloon/b-theme.png)
HTMLの表示に近くなったにゃ。
![ココア](https://whatswp.t-haku.com/wp-content/themes/whatswp/balloon/b-cocoa.png)
アイキャッチ画像が表示されてないけどにゃ。