WordPress > 【WordPress】独自のフックを定義してタグクラウド挿入

【WordPress】独自のフックを定義してタグクラウド挿入

do_action()関数でフックを定義

▼header.php

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta name="description" content="<?php bloginfo( 'description' )?>">
  <title><?php bloginfo( 'name' ); ?></title>
  <?php wp_head(); ?>
</head>
<body >
    <div class="g-nav-mask"></div>
    <header id="header">
      <a class="" href="<?php echo home_url(); ?>"><?php bloginfo( 'name' ); ?></a>
    </header>
    <div class="openbtn1"><span></span><span></span><span></span></div>
    <nav id="g-nav">
      <?php wp_nav_menu( array( 
        'container' => 'div',
        'container_id' => 'g-nav-list',
        'theme_location' => 'my-drawer'
      ) ); ?>
    </nav>
    <main id="main">
    <?php do_action( 'main_hook' ); ?>

add_action()関数でアクションフックの処理を実行

▼functions.php

add_action('main_hook', function () {
if (is_front_page() || is_archive()) {
$args = array(
	'smallest' => 1,
	'largest' => 1,
	'unit' => 'em',
	'number' => 30,
	'orderby' => 'count',
	'order' => 'DESC',
	'format' => 'list'
);
	$args['taxonomy'] = array('post_tag','category');
	wp_tag_cloud( $args );
	?>
	<style>
		ul.wp-tag-cloud {
			display: flex;
			flex-wrap: wrap;
			margin-bottom: 2rem;
			gap: 8px;
			padding: 1rem 0 0 0;
		}
		.wp-tag-cloud li {
			list-style: none;
		}
		.wp-tag-cloud li a {
			background: #f7f7f7;
			padding: 4px 8px;
		}
	</style>
<?php
}
});

参考サイト

WordPressフックとは？アクションフック・フィルターフックの使い方：
https://webst8.com/blog/wordpress-action-filter-hook