タグの一覧を表示するコピペJS

WordPressの固定ページや、投稿ページの編集画面で、「カスタムHTML」ブロックを追加して、以下をコピペすると、タグの一覧が表示されます。

実際にこれを使って表示しているデモはこちら。

タグ一覧のデモページ

<div id="wpnop-tags"></div>

<script>
(function() {
  let per_page = 6
  let element_name = 'wpnop-tags'
  
  // url for REST API
  let url = `/wp-json/wp/v2/tags?per_page=${per_page}&_fields=id,link,_links,name`

  // calling REST API
  fetch(url).then(response => response.json()).then(function(json) {
    let html = ''
    json.forEach(item => {
      html +=
      /*html*/
      `
        <p>
        <button class='button' onclick="location.href='${item.link}'">${item.name}</button>
        </p>
      `
    })
    let elm = document.getElementById(element_name)
    let newDiv = document.createElement('div');
    newDiv.innerHTML = html
    elm.appendChild(newDiv)
  })
})()
</script>

カスタムHTMLの使い方

「カスタムHTML」の使い方は、以下のページをみてみて下さい。

カスタムHTMLの使い方