GTMをタグに戻す

GTMと聞いて別のサービスを思い浮かべるのは私だけでないはず。
そこで正しいサービスに戻してみようと思います。

ここの記事を参考にさせていただきました。
LGTMを戻す

gtm/gtm.js

window.onload = function() {
  var img = 'data:image/png;base64,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';
  var hideStyle = document.createElement('style');
  hideStyle.type = 'text/css';
  hideStyle.innerHTML = `.hideButtonTitle { 
    display: none !important;
  }`;
  document.body.appendChild(hideStyle);

  // tooltipを消す
  var hideTootipStyle = document.createElement('style');
  hideTootipStyle.type = 'text/css';
  hideTootipStyle.innerHTML = `.MuiTooltip-popper { 
    display: none;
  }`;
  document.body.appendChild(hideTootipStyle);

  // mobile
  var mobileLike = document.querySelector('div.it-ActionsMobile_like');
  var mobileLikeStyle = document.createElement('style');
  mobileLikeStyle.type = 'text/css';
  mobileLikeStyle.innerHTML = `.mobileLike { 
    background-color: white !important;
    border: 2px solid rgb(93, 112, 124) !important;
  }`;
  document.body.appendChild(mobileLikeStyle);
  mobileLike.classList.add('mobileLike');
  mobileLike.addEventListener('click', function() {
    setTimeout(function() {
      mobileLike.classList.add('mobileLike');
    }, 0);
  });
  mobileLike.addEventListener('mouseover', function() {
    setTimeout(function() {
      mobileLikeButton.classList.add('hideButtonTitle');
      mobileLikeButton.title = 'Google Tag なんとか';
      mobileLikeButton.classList.remove('hideButtonTitle');
    }, 0);
  });

  var mobileLikeButton = mobileLike.querySelector('button');

  var buttonStyle = document.createElement('style');
  buttonStyle.type = 'text/css';
  buttonStyle.innerHTML = `.mobileLikeButton { 
    display: flex;
    justify-content: center;
    align-items: center;
  }`;
  document.body.appendChild(buttonStyle);
  mobileLikeButton.title = 'Google Tag Manager';
  mobileLikeButton.classList.add('mobileLikeButton');

  var span = mobileLikeButton.querySelector('span:first-child');
  span.parentNode.removeChild(span);
  mobileLikeButton.insertAdjacentHTML('afterbegin', '<img src="' + img + '" style="width: 45px; margin-right: 10px;" />');

  var mobileCount = mobileLikeButton.querySelector('span:last-child');
  var countStyle = document.createElement('style');
  countStyle.type = 'text/css';
  countStyle.innerHTML = `.likeCount { 
    color: rgb(93, 112, 124);
  }`;
  document.body.appendChild(countStyle);
  mobileCount.classList.add('likeCount');

  // footer
  var footerLike = document.querySelector('div.it-Footer_like');
  footerLike.title = 'Google Tag Manager';
  footerLike.addEventListener('mouseover', function() {
    setTimeout(function() {
      footerLike.classList.add('hideButtonTitle');
      footerLike.title = 'Google Tag なんとか';
      footerLike.classList.remove('hideButtonTitle');
    }, 0);
  });

  var footerButton = footerLike.querySelector('button');
  var footerButtonStyle = document.createElement('style');
  footerButtonStyle.type = 'text/css';
  footerButtonStyle.innerHTML = `.footerLikeButton {
    background-color: transparent !important;
    border: none !important;
  }`;
  document.body.appendChild(footerButtonStyle);
  footerButton.classList.add('footerLikeButton');
  footerButton.innerHTML = '<img width=45 src="' + img + '" />';
  var footerCount = footerLike.querySelector('a');
  footerCount.classList.add('likeCount');
};

manifest.jsonの設定を書きます。

gtm/manifest.json

{
  "name": "GTM",
  "version": "1.0.0",
  "manifest_version": 2,
  "description": "GTM Chrome Extension",
  "content_scripts": [{
    "matches": ["https://qiita.com/**/items/*"],
    "js": [
      "gtm.js"
    ]
  }]
}

早速戻してみましょう・・・おっと、サービスを間違えたようです

これは酷い