Googleサイトで自創作紹介ページを作る

<div>
  <ul>　//アイコンのリスト
    <li><img src="画像" id="ID" width=65%" height="auto" alt="" /></li>
    <li><img src="画像" id="ID" width="65%" height="auto" alt="" /></li>
　</ul>

  <div id="">　//紹介スペース
  <img src="画像" id="ID" width="80%" height="auto" onselectstart="return false;" onmousedown="return false;" style="pointer-events: none;">
  <h2 id="name">キャラ名</h2>
  <p id="par">紹介文</p>
  </div>
</div>

<style>
   ul {
      display: flex;
      height: 100px;
      overflow-x: scroll;
      overflow-y: hidden;
      justify-content: center;
      margin-block-end: 0px;
    }
   li {
      list-style: none;
    }
  h2 {
      font-size:22px;
      margin-block-start: 0px;
      margin-block-end: 0px;
  }
  p {
      font-size:16px;
  }
  　img{
      /* SPの長押し禁止 */
      -webkit-touch-callout:none;
      -webkit-user-select:none;
      -moz-touch-callout:none;
      -moz-user-select:none;
      user-select:none;
  　}
  #prof {
  text-align:center;
  }
  @media (max-width:480px)
  {
  ul{ height:50px; }
  h2{ font-size:18px; }
  p { font-size:14px;}
  #prof img { width :70% }
  }
</style>
<script>
  const pushBtn = (btn,src,name,par) => {
    document.getElementById(btn).onclick = function(){
      document.getElementById("pics").src=src;
      document.getElementById('name').textContent=name;
      document.getElementById('par').innerText=par;
    }
  }
  pushBtn("ID","画像URL", 'キャラ名','紹介文')
  pushBtn("ID","画像URL", 'キャラ名','紹介文')
</script>