Add Google Search Buttons to Duckduckgo - faster searching in Google and Google Shopping (mobile)

Adds Google and Google Shopping search buttons to DuckDuckGo search results with a visually appealing design for small and large displays, following the DuckDuckGo color scheme

  1. // ==UserScript==
  2. // @name Add Google Search Buttons to Duckduckgo - faster searching in Google and Google Shopping (mobile)
  3. // @namespace http://tampermonkey.net/
  4. // @version 8.1
  5. // @description Adds Google and Google Shopping search buttons to DuckDuckGo search results with a visually appealing design for small and large displays, following the DuckDuckGo color scheme
  6. // @match https://duckduckgo.com/*
  7. // @grant none
  8. // @author Luciano Stanziani
  9. // @license CC BY-NC-ND 4.0
  10. // ==/UserScript==
  11.  
  12. (function() {
  13. 'use strict';
  14.  
  15. const colorScheme = {
  16. lightBG: 'var(--ddg-light-bg)',
  17. lightHoverBG: 'var(--ddg-light-hover-bg)',
  18. text: 'var(--ddg-text)',
  19. lightHoverText: 'var(--ddg-light-hover-text)',
  20. google: '#4964B3',
  21. googleShopping: '#4964B3'
  22. };
  23.  
  24. const buttonsCacheKey = 'ddgGoogleSearchButtonsCache';
  25.  
  26. document.addEventListener('DOMContentLoaded', function() {
  27. // Create container for buttons
  28. const buttonsContainer = document.createElement('div');
  29. buttonsContainer.classList.add('ddg-buttons-container');
  30. const searchForm = document.querySelector('#search_form');
  31. searchForm.insertAdjacentElement('beforebegin', buttonsContainer);
  32.  
  33. // Create buttons
  34. let buttons = null;
  35. const buttonsCache = localStorage.getItem(buttonsCacheKey);
  36. if (buttonsCache) {
  37. buttons = JSON.parse(buttonsCache);
  38. } else {
  39. buttons = [
  40. { text: 'Google', dataLink: 'google', className: 'ddg-google-button' },
  41. { text: 'Google Shopping', dataLink: 'googleshopping', className: 'ddg-google-shopping-button' }
  42. ];
  43. localStorage.setItem(buttonsCacheKey, JSON.stringify(buttons));
  44. }
  45.  
  46. buttons.forEach((button, index) => {
  47. const buttonElement = createButtonElement(button.text, button.dataLink, button.className);
  48. buttonsContainer.appendChild(buttonElement);
  49.  
  50. buttonElement.addEventListener('click', event => {
  51. event.preventDefault();
  52. const searchBox = document.querySelector('#search_form_input');
  53. const searchText = searchBox.value.trim();
  54. if (searchText === '') {
  55. return;
  56. }
  57. const dataLink = buttonElement.getAttribute('data-zci-link');
  58. let searchURL = '';
  59. if (dataLink === 'google') {
  60. searchURL = `https://www.google.com/search?q=${searchText}&oq=${searchText}`;
  61. } else if (dataLink === 'googleshopping') {
  62. searchURL = `https://www.google.com/search?q=${searchText}&tbm=shop`;
  63. }
  64. searchOnGoogle(searchURL);
  65. });
  66.  
  67. // Add margin between buttons
  68. if (index < buttons.length - 1) {
  69. buttonElement.style.marginRight = '10px';
  70. }
  71. });
  72.  
  73. // Add styles to buttons container
  74. const styles = `
  75. .ddg-buttons-container {
  76. display: flex;
  77. justify-content: center;
  78. align-items: center;
  79. padding: 5px 10px;
  80. background-color: ${colorScheme.lightBG};
  81. border-radius: 20px;
  82. width: calc(100% - 20px);
  83. }
  84.  
  85. .ddg-buttons-container a:hover {
  86. background-color: ${colorScheme.lightHoverBG};
  87. color: ${colorScheme.lightHoverText};
  88. }
  89.  
  90. .ddg-google-button, .ddg-google-shopping-button {
  91. transition: background-color 0.2s ease;
  92. color: #fff; /* Impostiamo il colore del testo su bianco */
  93. }
  94.  
  95. :root[data-theme="dark"] .ddg-google-button, :root[data-theme="dark"] .ddg-google-shopping-button {
  96. background-color: #1a73e8l;
  97. }
  98. `;
  99. const styleElement = document.createElement('style');
  100. styleElement.textContent = styles;
  101. document.head.appendChild(styleElement);
  102. });
  103.  
  104. // Helper function to create button elements
  105. function createButtonElement(text, dataLink, className) {
  106. const button = document.createElement('a');
  107. button.classList.add(className);
  108. button.setAttribute('data-zci-link', dataLink);
  109. button.textContent = text;
  110. button.href = '#';
  111. button.style.borderRadius = '20px';
  112. button.style.padding = '8px 16px';
  113. button.style.marginBottom = '8px';
  114. button.style.backgroundColor = colorScheme.google;
  115. button.style.color = 'fff';
  116. button.style.fontSize = '14px';
  117. button.style.fontWeight = 'bold';
  118. button.style.textDecoration = 'none';
  119. button.style.height = 'auto';
  120. button.style.whiteSpace = 'nowrap';
  121. button.style.overflow = 'hidden';
  122. button.style.textOverflow = 'ellipsis';
  123. button.style.flex = '1';
  124. return button;
  125. }
  126.  
  127. // Helper function to search on Google
  128. function searchOnGoogle(url) {
  129. window.location.href = url;
  130. }
  131.  
  132. })();

QingJ © 2025

镜像随时可能失效,请加Q群300939539或关注我们的公众号极客氢云获取最新地址