Chrome扩展:新标签页Google Logo无法替换,求技术解决方案
Hey there! I see you've got your extension working on Google's main search pages, but the new tab page is still showing the original logo—let's fix that.
Why It's Not Working
Google's new tab page doesn't use the standard https://www.google.com/ or /search paths. Depending on your browser settings, it might be a special web URL like https://www.google.com/_/chrome/newtab* or the native chrome://newtab page. Your current matches in manifest.json aren't covering these URLs, so your content script never runs there.
Step 1: Update Your Manifest.json
First, expand your content script matches to include the new tab page URLs. Here's how to modify your manifest:
{ "update_url": "https://clients2.google.com/service/update2/crx", "manifest_version": 2, "name": "glogochange", "description": "blabla", "version": "1.0", "content_scripts": [ { "run_at": "document_start", "matches": [ "https://*.google.com/*", "https://www.google.com/_/chrome/newtab*" // Add this for Google's web-based new tab ], "css": [ "style.css" ], "js": [ "script.js" ] } ], "permissions": [ "https://*/*", "tabs" ], // Keep your existing permissions "web_accessible_resources": [ "newlogo.png" ] }
Note: If you're targeting the native chrome://newtab page, Manifest V2 has strict security restrictions here. You could add "chrome://newtab/" to your permissions and matches, but many Chromium-based browsers block this for safety. The web-based new tab URL above is more reliable for most users.
Step 2: Adjust Your JavaScript for the New Tab Page
Next, check the element selectors for the logo on the new tab page. Open a new tab, right-click the logo, and inspect it to find its exact ID or XPath (Google sometimes tweaks page structures!).
Update your DoIT() function to handle the new tab path. Here's a modified version with support for the new tab:
// Make sure your XPath helper function is defined (you might have this already!) function XPath(query) { return document.evaluate(query, document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue; } function DoIT() { var domain, path, button, logo, ilogo, text, logourl; domain = window.location.host; path = window.location.pathname; logourl = chrome.runtime.getURL("newlogo.png"); text = "cool Search"; // Handle main homepage, webhp page if(domain == "www.google.com" && (path == "/" || path == "/webhp")) { button = '//*[@id="tsf"]/div[2]/div[3]/center/input[1]'; logo = document.getElementById("hplogo"); if(XPath(button)) XPath(button).value = text; if(logo) { logo.srcset = logourl; logo.width = 292.5; logo.height = 133.5; logo.style.display = "block"; } } // Handle search results page else if(domain == "www.google.com" && path == "/search") { ilogo = '//*[@id="logo"]/img'; const searchLogo = XPath(ilogo); if(searchLogo) { searchLogo.width = 120; searchLogo.height = 54; searchLogo.srcset = logourl; searchLogo.style.display = "block"; } } // Handle Google's web-based new tab page else if(domain == "www.google.com" && path.includes("/_/chrome/newtab")) { // Replace this XPath with the actual selector you found via dev tools! const newTabLogo = XPath('//*[@id="logo"]/img'); if(newTabLogo) { newTabLogo.srcset = logourl; // Adjust dimensions to fit your logo newTabLogo.width = 292.5; newTabLogo.height = 133.5; newTabLogo.style.display = "block"; } } } // Run the function when the DOM is fully loaded document.addEventListener('DOMContentLoaded', DoIT); // Add a small delay to catch dynamically loaded logos setTimeout(DoIT, 500);
Step 3: Test and Tweak
- Reload your extension in Chrome's extensions page (
chrome://extensions/) - Open a new tab and check if the logo updates
- If it still fails, re-inspect the new tab logo to confirm your selector is correct—Google occasionally changes their page elements!
Bonus: Consider Manifest V3
If you're open to updating, Manifest V3 is the current standard for Chrome extensions and has better support for modern features. The content script setup is similar, but you'll have access to more flexible injection options via chrome.scripting if needed.
内容的提问来源于stack exchange,提问作者Zero




