新版Google Sites自定义滚动按钮遇iframe限制，求解决方案

最近在新版Google Sites上做自定义按钮，需求很简单：点击后滚动到页面指定区域或顶部，但实际操作起来困难重重。

要自定义按钮样式必须用Embed code添加，但这样按钮会被嵌入到iframe里。我尝试过用window.top的onclick事件实现滚动，完全无效（可能是操作方式不对）。

目前用了个临时方案，代码如下，但点击按钮会先打开新标签页，体验很差：

CSS样式 #

.button-test {
  background-color: #0078d0;
  border: 0;
  border-radius: 56px;
  color: #fff;
  cursor: pointer;
  display: inline-block;
  font-family: system-ui, -apple-system, system-ui, "Segoe UI", Roboto, Ubuntu, "Helvetica Neue", sans-serif;
  font-size: 18px;
  font-weight: 600;
  outline: 0;
  padding: 16px 21px;
  position: relative;
  text-align: center;
  text-decoration: none;
  transition: all .3s;
  user-select: none;
  -webkit-user-select: none;
  touch-action: manipulation;
}

.button-test:before {
  background-color: initial;
  background-image: linear-gradient(#fff 0, rgba(255, 255, 255, 0) 100%);
  border-radius: 125px;
  content: "";
  height: 50%;
  left: 4%;
  opacity: .5;
  position: absolute;
  top: 0;
  transition: all .3s;
  width: 92%;
}

.button-test:hover {
  box-shadow: rgba(255, 255, 255, .2) 0 3px 15px inset, rgba(0, 0, 0, .1) 0 3px 5px, rgba(0, 0, 0, .1) 0 10px 13px;
  transform: scale(1.05);
}

@media (min-width: 768px) {
  .button-test {
    padding: 16px 48px;
  }
}

HTML结构 #

<a href="http://test.com/en#h.2f00a9eddc84963_56">
  <button class="button-test" role="button">Test Button</button>
</a>

现在的问题是：找不到能让主窗口直接滚动到指定区域且不打开新标签页的方法或脚本，有没有人解决过这个问题？Google Sites的这些限制实在让人费解。

另外我分析，这应该和自动生成的沙箱iframe没有配置allow-top-navigation选项有关，有没有办法修改或者绕过这个限制？

内容的提问来源于stack exchange，提问作者David