Forked from Daan-Grashoff/google_search_maps_addon.js
Last active
April 24, 2024 19:51
-
-
Save Delivator/cbb71fc770b11b02b4269f26d65ce145 to your computer and use it in GitHub Desktop.
Bring back the google maps button and make map image clickable when searching on google
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// ==UserScript== | |
// @name Google Search Maps Fix | |
// @namespace http://tampermonkey.net/ | |
// @version 2024-03-07 | |
// @description Bring Google maps button back | |
// @author Daan Grashoff / Delivator | |
// @match https://www.google.com/search* | |
// @include https://www.google.tld/search* | |
// @icon https://www.google.com/images/branding/googleg/1x/googleg_standard_color_128dp.png | |
// @grant none | |
// ==/UserScript== | |
(function () { | |
'use strict'; | |
function addMapsLink() { | |
// Find the existing results tabs (Images, News, etc.) | |
const tabsContainer = document.querySelector('.IUOThf'); | |
const mapImage = document.querySelector('#lu_map'); | |
// Get the search query from the URL | |
const searchQuery = new URLSearchParams(window.location.search).get('q'); | |
// Construct the Maps link with the query | |
const mapsLink = `${window.location.origin}/maps?q=${searchQuery}`; | |
// If map image exists | |
if (mapImage) { | |
const anchorElement = document.createElement('a'); | |
anchorElement.href = mapsLink; | |
mapImage.parentNode.insertBefore(anchorElement, mapImage); | |
anchorElement.appendChild(mapImage); | |
} | |
// If tabs exist, proceed | |
if (tabsContainer) { | |
// Create the Maps button | |
const mapsButton = document.createElement('a'); | |
mapsButton.classList.add('nPDzT', 'T3FoJb'); // Style to match other tabs | |
// Create the inner elements for the Maps button | |
const mapDiv = document.createElement('div'); | |
mapDiv.jsname = 'bVqjv'; | |
mapDiv.classList.add('GKS7s'); | |
const mapSpan = document.createElement('span'); | |
mapSpan.classList.add('FMKtTb', 'UqcIvb'); | |
mapSpan.jsname = 'pIvPIe'; | |
mapSpan.textContent = 'Maps'; | |
// Assemble the elements | |
mapDiv.appendChild(mapSpan); | |
mapsButton.appendChild(mapDiv); | |
mapsButton.href = mapsLink; | |
// Insert the Maps button at the beginning of the tabs container | |
tabsContainer.prepend(mapsButton); | |
} | |
} | |
// Call the function to add the button | |
addMapsLink(); | |
})(); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
It's fine, I found a workaround for that. Basically when I was running one-word plain searches like "Denmark" or "Copenhagen", there wasn't any map button appearing. I have made it a habit now to end all of my searches regarding places with the word map, so I am typing "USA map" instead of just "USA" and it works like a charm, I have both the button "Maps" on top and the clickable map! Thanks once again for the great script!