ワードプレスの画像が表示されません。コンソールでエラーが出ます。

前提・実現したいこと

超初心者な質問で申し訳ありません。
WordPressのオリジナルテーマを作ろうと、コピペしたのですが、画像が表示されません。
mampでローカル表示を見たいだけです。

発生している問題・エラーメッセージ

該当のソースコード

PHP

ソースコード

<!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <title>ウェブストエイト</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> <link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/mystyle.css"> <script src="<?php echo get_template_directory_uri(); ?>https://code.jquery.com/jquery-3.2.1.min.js"></script> <script src="<?php echo get_template_directory_uri(); ?>https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> <?php wp_head(); ?> </head> <body> <header> <nav class="navbar navbar-default" style="margin-bottom:0;"> <div class="navbar-header"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-navbar-collapse-1"> <span class="sr-only">メニュー</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> </div> <div id="bs-navbar-collapse-1" class="collapse navbar-collapse"> <ul class="nav navbar-nav"> <li><a href="#">HOME</a></li> <li><a href="#">PROFILE</a></li> <li><a href="#">BLOG</a></li> <li><a href="#">CONTACT</a></li> </ul> </div> </nav> <div id="top-vg"> <img src="<?php echo get_template_directory_uri(); ?>/images/top.jpeg" alt="トップページ画像"> </div> </header> <section id="content"> <div id="content-wrap" class="container"> <div id="main" class="col-md-9"> <h1 class="text-center">個人事業主向けWebスクールウェブストエイト</h1> <p> ウェブストエイトは自分でホームページ制作・Web集客したい方向けの少人数制個別指導のスクール・塾です。 <br><br> 継続6ヶ月コースとお試し1ヶ月コースから選択して受講できます。 </p> <div class="row"> <div class="col-md-6"> <p><img src="<?php echo get_template_directory_uri(); ?>images/pc-wood.jpg" alt="6ヶ月コース画像"></p> <h2 class="text-center">しっかり6ヶ月コース</h2> <p>ホームページ作成からWeb集客まで一通り習得して売上拡大したい方向けのコース</p>

			</div>
			<div class="col-md-6">
				<p><img src="<?php echo get_template_directory_uri(); ?>images/pc-leaf.jpg" alt="1ヶ月コース画像"></p>
				<h2 class="text-center">お試し1ヶ月コース</h2>
				<p>特定範囲のみ習いたい・まずは試しに受講してみたい方向けのコース</p>
			</div>
		</div>
		<p class="text-center">
			<br>
			お申し込みは<a href="https://webst8.com">こちらから</a>
			<br><br>
		</p>
	</div>
	<div id="sidebar" class="col-md-3">
		<h1 class="text-center">セミナー情報</h1>
		<section id="wordpress-seminar">
			<h2>WordPress入門セミナー</h2>
			<p>
				<img src="<?php echo get_template_directory_uri(); ?>images/seminar-wordpress.png" alt="ワードプレスセミナー画像">
			</p>					
		</section>
		<section id="seo-seminar">
			<h2>SEO入門セミナー</h2>
			<p>
				<img src="<?php echo get_template_directory_uri(); ?>images/seminar-seo.png" alt="SEOセミナー画像">
			</p>					
		</section>
	</div>
</div>

試したこと

ブラウザを変える
Google Chrome
Firefox

補足情報（FW/ツールのバージョンなど）

画像は
imagesフォルダ内に入っています。

行動規範の内容に同意します

回答1件

ベストアンサー

下記のようにurlにスラッシュを付けてください。
なお、子テーマを使っているのであればget_stylesheet_directory_uriです。

PHP
1
2<p><img src="<?php echo get_template_directory_uri(); ?>images/pc-wood.jpg" alt="6ヶ月コース画像"></p>
3
4　↓
5
6<p><img src="<?php echo get_template_directory_uri(); ?>/images/pc-wood.jpg" alt="6ヶ月コース画像"></p>
7
8　or
9
10<p><img src="<?php echo get_stylesheet_directory_uri(); ?>/images/pc-wood.jpg" alt="6ヶ月コース画像"></p>