WordPressにbootstrapを導入するための手順です。
bootstrapの導入に苦労したため備忘録的にまとめました。
CDNを用いた方法ではなく、bootstrap公式サイトからCSSファイルとJSファイルをダウンロードして導入する方法です。
ファイルをダウンロード後以下のようにコードを書きbootstrapのボタンが上手く反映されていると、
bootstrapの導入は完了です。
ファイル構成
ファイル構成はこのようになっています。
コード
<!doctype html>
<html lang="ja">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/css/bootstrap.css">
<title>title</title>
</head>
<body>
<a href="#" class="btn btn-success">ボタン</a>
<a href="#" class="btn btn-warning">ボタン</a>
<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="<?php echo get_template_directory_uri(); ?>/js/jquery-3.5.1.js"></script>
<script src="<?php echo get_template_directory_uri(); ?>/js/bootstrap.bundle.js"></script>
</body>
</html>
↑bootstrapが効き、こうなればOK！
