Bring back the google maps button when searching on google

google_search_maps_addon.js

// ==UserScript==
// @name         Google maps addon
// @namespace    http://tampermonkey.net/
// @version      2024-03-21
// @description  Bring google maps button back
// @author       You
// @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 addMapsButton() {
    // Find the list container of existing tabs
    const tabsContainer = document.querySelector('.crJ18e');

    // If tabs exist, proceed
    if (tabsContainer) {
      // Create the Maps button elements (updated)
      const mapsListItem = document.createElement('div');
      mapsListItem.jsname = 'VIftV';
      // mapsListItem.classList.add('Ap1Qsc');
      mapsListItem.setAttribute('role', 'listitem');

      // Replace this entire section with the provided <a> element
      const mapsButton = document.createElement('a');
      mapsButton.jsname = "ONH4Gc";
      mapsButton.classList.add("LatpMc");
      mapsButton.classList.add("nPDzT");
      mapsButton.classList.add("T3FoJb");
      mapsButton.dataset.navigation = "server";  // Update the attribute name
      mapsButton.dataset.hveid = "CAEQCA";
      // 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 = `//maps.google.com/maps?q=${searchQuery}`;
      mapsButton.href = mapsLink;

      //mapsButton.textContent = "Maps"; // Set the inner text
      const mapsButtonText = document.createElement('div');
      mapsButtonText.jsname = "bVqjv";
      mapsButtonText.classList.add("YmvwI");
      mapsButtonText.textContent = "Maps";
      mapsButton.appendChild(mapsButtonText);

      // Append the mapsButton to the list item
      mapsListItem.appendChild(mapsButton);

      // Insert the Maps button at the beginning of the tabs container
      tabsContainer.prepend(mapsListItem);
    }
  }

  // Call the function to add the button
  addMapsButton();
})();

@Daan-Grashoff

@ this line underneath the @match to support google.nl

// @match https://www.google.nl/*

Thanks for this code. I will create a chrome plugin from it.
However, it's not just about Maps. Google Flight used to appear directly...but this is no longer the case in EU. :(

I had to change the line 43 to this, but thanks, it works great!

const mapsLink = https://www.google.com/maps/search/?api=1&query=${searchQuery}

I had to change the line 43 to this, but thanks, it works great!

const mapsLink = https://www.google.com/maps/search/?api=1&query=${searchQuery}

this worked good

Thansk a lot! Fixed a few things like supporting local domains instead of just .com and also made the map image clickable.
https://gist.github.com/Delivator/cbb71fc770b11b02b4269f26d65ce145

Thansk a lot! Fixed a few things like supporting local domains instead of just .com and also made the map image clickable. https://gist.github.com/Delivator/cbb71fc770b11b02b4269f26d65ce145

Thanks to both !

Google changed the UI, So I updated the script

Nice! Thanks!

Works great, thx a lot! :)

Can I ask to add a variable determining the position of the Maps button?

As far as I know, the Maps button was after Everything.

@kubinka0505
You need to replace line 54 (tabsContainer.prepend(mapsListItem);) with one of these :

If you want it to be second to last as such :

tabsContainer.insertBefore(mapsListItem,tabsContainer.children[tabsContainer.children.length - 1]);

If you want it to be at a given position (for example the second position, so position 1 since you count from 0) :

tabsContainer.insertBefore(mapsListItem,tabsContainer.children[1]);

If you rename the file to .user.js when opening raw Tampermonkey automatically detects it's a userscript you're trying to install and directly opens up an "installation" tab, rather than needing to manually copy-paste. Appreciate the bringing back of Google Maps.

noobie q, sorry: how do i install this (to Firefox)?

@juhorepository You need the extension "Tampermonkey" and then install this script (to do so: click on the Tampermonkey icon in the extension toolbar of Firefox -> "Create a new Script" and copy-paste the script above

Sweet :)