ゲーム作りは楽しい

なんか書く

XをTwitterに戻す方法

はじめに

Xってなんですか?
やっぱりTwitterだよな!

Tampermonkeyの使用

今回はめんどうくさいので
手軽にブラウザ拡張みたいなことができるTampermonkeyを紹介します

chromewebstore.google.com

Tampermonkeyは、自分で作ったJavaScriptコードを好きなウェブページに適用して、ページの見た目や動作を自由にカスタマイズできる拡張機能です。

XをTwitterに戻すユーザースクリプトを作成する

まずは新規作成です。

// ==UserScript==
// @name         Replace X with Twitter
// @namespace    http://tampermonkey.net/
// @version      1.0.0
// @description  Replace all visible "X" text with "Twitter"
// @author       tyanmahou
// @match        *://*/*
// @grant        none
// ==/UserScript==

(function () {
    'use strict';
    // タイトル
    document.title = document.title.replace(/x/gi, 'Twitter');
    // 文字列を置換する関数(再帰的)
    function replaceText(node) {
        if (node.nodeType === Node.TEXT_NODE) {
            // "X" を "Twitter" に置き換え
            node.textContent = node.textContent.replace(/x/gi, 'Twitter');
        } else if (
            node.nodeType === Node.ELEMENT_NODE &&
            // styleなどが壊れないように
            !['SCRIPT', 'STYLE'].includes(node.nodeName)
        ) {
            for (let child of node.childNodes) {
                replaceText(child);
            }
        }
    }

    // 初期実行
    replaceText(document.body);

    // 動的に変わる要素にも対応(MutationObserver)
    const observer = new MutationObserver((mutations) => {
        for (const mutation of mutations) {
            for (const node of mutation.addedNodes) {
                replaceText(node);
            }
        }
    });

    observer.observe(document.body, {
        childList: true,
        subtree: true
    });
})();

ユーザースクリプトを作成出来たら保存します。

注意

自分はVivaldiを使っているのですが chrome://extensions から Tampermonkeyの詳細で
ユーザー スクリプトを許可するONにしてないと動かなかったので、ココも確認がいります。

適用されているのを確認

正しく動作していれば、ブラウザ拡張のアイコンにバッジが付きます




まとめ

Tampermonkeyを使って気軽にXをTwitterに戻せた!! やったー!