wp_footer() の使い方

footer で呼ばれている wp_footer() というのはどういう意味があるのでしょうか。

wp_footer() については1度知ってしまうとシンプルなものです。
footer 付近で呼びたいスクリプトなどを出力する関数です。

使い方

wp_footer(); は引数がないのでポイントです。

wp_footer();

基本的には wp_head() と同じような動きだが、呼ばれる場所が違うものと考えれば良いでしょう。

もし WordPress のテーマ内で呼ばれていたらどこかで wp_footer() で呼ばれたスクリプトが使用されているかもしれません。むやみに消さないほうがいいですね。

参考

https://wpdocs.osdn.jp/%E3%83%86%E3%83%B3%E3%83%97%E3%83%AC%E3%83%BC%E3%83%88%E3%82%BF%E3%82%B0/wp_footer

wp_nav_menuでBootstrapのnavに対応する方法

WordPress のテンプレートタグ wp_nav_menu を BootstrapのNavsメニューに対応させたいケースについてご紹介します。

wp-bootstrap-navwalkerというライブラリを使用すると、wp_nav_menuをBootstrapのNavsに対応させることができます。

使い方

使い方は2ステップ、ライブラリの読み込みとソースコードの作成です。

読み込み

class-wp-bootstrap-navwalker.php をコピーもしくはダウンロードして、テーマディレクトリに保存します。class-wp-bootstrap-navwalker.php というファイル名で保存しましょう(ファイル名はなんでもOK)。

読み込み記述がない場合は、functions.php に class-wp-bootstrap-navwalker.php の読み込みコードを記載します。

<?php
/**
* WP Bootstrap Navwalker
*/
require get_template_directory() . '/class-wp-bootstrap-navwalker.php';

これでライブラリ class-wp-bootstrap-navwalker.php が読み込まれて使用可能になります。

wp_nav_menu の記述

wp_nav_menu にキーを渡すことで Bootstrap の Navs 対応ができるようになっています。

<?php
wp_nav_menu( array(
	'menu_id' => 'メニュー名',
	'menu_class' => 'nav',
	'container_id' => 'navbarNav'
	'fallback_cb' => 'WP_Bootstrap_Navwalker::fallback',
	'walker' => new WP_Bootstrap_Navwalker()
));

メニューの子要素を表示するには、depthのキーを2に指定してください。

the_permalinkの使い方

使い方

投稿のパーマリンクを表示するテンプレートタグです。ループの中で使用する必要があります。
パーマリンクとは、投稿の固有のURLのことです。

<?php
the_permalink();
?>

出力

the_permalinkでstaffページを出力した例です。

http://localhost:8080/staff/

参考

https://wpdocs.osdn.jp/%E3%83%86%E3%83%B3%E3%83%97%E3%83%AC%E3%83%BC%E3%83%88%E3%82%BF%E3%82%B0/the_permalink

the_title の使い方

使い方

タイトルを表示するテンプレートタグです。
必ずループ内で使用するようにとあります。

<?php
the_title( '<h2>', '</h2>' );
?>

こちらでh2タグに囲まれたテキストのタイトルが出力されます。

参考

https://wpdocs.osdn.jp/%E3%83%86%E3%83%B3%E3%83%97%E3%83%AC%E3%83%BC%E3%83%88%E3%82%BF%E3%82%B0/the_titl

wp_nav_menu の使い方

WordPressてメニューを扱うwp_nav_menuについて機能を紹介します。

使い方

wp_nav_menu()を記述して、パラメータを配列で渡します。

<?php
	wp_nav_menu(array(
		'menu_id' => 'primary-menu',
	));
?>

classの追加

classの追加パターンです。menu_classというキーにクラス名を指定します。

<?php
	wp_nav_menu(array(
		'menu_id' => 'primary-menu',
		'menu_class' => 'navbar-nav-scroll',
	));
?>

ラップするcontainerにクラスの追加

container_classに記述します。

	<?php
		wp_nav_menu(array(
			'menu_id' => 'primary-menu',
			'menu_class' => 'navbar-nav bd-navbar-nav flex-row',
			'container_class' => '',
		));
	?>

aタグにクラスを追加

wp_nav_menuのデフォルトでは、aタグにクラスを足すことはできないようです。functions.phpにコードの追加が必要です。

参考