Reddit Search Button Next to Google a

Adds a Reddit search button next to Google search button

  1. // ==UserScript==
  2. // @name Reddit Search Button Next to Google a
  3. // @namespace http://tampermonkey.net/
  4. // @version 1.0
  5. // @description Adds a Reddit search button next to Google search button
  6. // @author You
  7. // @match https://www.google.com/*
  8. // @match https://google.com/*
  9. // @grant none
  10. // ==/UserScript==
  11.  
  12. (function() {
  13. 'use strict';
  14.  
  15. function addCustomStyles() {
  16. const styleSheet = document.createElement("style");
  17. styleSheet.textContent = `
  18. .reddit-search-btn {
  19. background: linear-gradient(to bottom, #ff4500, #dc3545);
  20. border: none;
  21. color: white;
  22. padding: 8px 8px;
  23. border-radius: 15px;
  24. font-family: Arial, sans-serif;
  25. font-weight: bold;
  26. cursor: pointer;
  27. transition: all 0.3s ease;
  28. box-shadow: 0 2px 4px rgba(0,0,0,0.2);
  29. text-transform: uppercase;
  30. font-size: 14px;
  31. letter-spacing: 0.5px;
  32. height: 40px;
  33. display: inline-flex;
  34. align-items: center;
  35. margin-left: 10px;
  36. vertical-align: up;
  37. }
  38.  
  39. .reddit-search-btn:hover {
  40. background: linear-gradient(to bottom, #ff5610, #e84555);
  41. box-shadow: 0 4px 8px rgba(0,0,0,0.3);
  42. }
  43.  
  44. .reddit-search-btn:active {
  45. box-shadow: 0 1px 2px rgba(0,0,0,0.2);
  46. }
  47.  
  48. .reddit-search-btn::before {
  49. content: "🔍 ";
  50. margin-right: 4px;
  51. }
  52.  
  53. .search-icons-container {
  54. display: inline-block;
  55. }
  56. `;
  57. document.head.appendChild(styleSheet);
  58. }
  59.  
  60. function createRedditButton() {
  61. // Find the Google search button
  62. const googleSearchButton = document.querySelector('button.HZVG1b.Tg7LZd');
  63. if (!googleSearchButton) return;
  64.  
  65. // Check if button already exists
  66. if (googleSearchButton.nextElementSibling && googleSearchButton.nextElementSibling.classList.contains('reddit-search-btn')) return;
  67.  
  68. // Create the Reddit button
  69. const redditButton = document.createElement('button');
  70. redditButton.textContent = 'Reddit';
  71. redditButton.className = 'reddit-search-btn';
  72. redditButton.type = 'button';
  73.  
  74. // Add click event listener
  75. redditButton.addEventListener('click', function(e) {
  76. e.preventDefault();
  77. // Get text from Google search input
  78. const searchInput = document.querySelector('textarea.gLFyf, input.gLFyf');
  79. if (searchInput && searchInput.value.trim()) {
  80. const redditSearchUrl = `https://www.google.com/search?q=site:reddit.com ${encodeURIComponent(searchInput.value)}`;
  81. window.open(redditSearchUrl, '_blank');
  82. }
  83. });
  84.  
  85. // Wrap the Google search button in a container if it doesn't already exist
  86. if (!googleSearchButton.parentElement.classList.contains('search-icons-container')) {
  87. const wrapper = document.createElement('div');
  88. wrapper.className = 'search-icons-container';
  89. googleSearchButton.parentNode.insertBefore(wrapper, googleSearchButton);
  90. wrapper.appendChild(googleSearchButton);
  91. }
  92.  
  93. // Add the Reddit button to the container
  94. const searchIconsContainer = googleSearchButton.parentElement;
  95. if (searchIconsContainer) {
  96. searchIconsContainer.appendChild(redditButton);
  97. }
  98. }
  99.  
  100. function init() {
  101. addCustomStyles();
  102.  
  103. // Initial creation with a delay to ensure page is loaded
  104. setTimeout(createRedditButton, 1000);
  105.  
  106. // Watch for dynamic changes
  107. const observer = new MutationObserver(function() {
  108. createRedditButton();
  109. });
  110.  
  111. observer.observe(document.body, {
  112. childList: true,
  113. subtree: true
  114. });
  115. }
  116.  
  117. // Run initialization
  118. if (document.readyState === 'loading') {
  119. document.addEventListener('DOMContentLoaded', init);
  120. } else {
  121. init();
  122. }
  123. })();