☰

Steam Workshop Open in Steam

Adds an open in steam button next to workshop item titles.

  1. // ==UserScript==
  2. // @name         Steam Workshop Open in Steam
  3. // @namespace    http://tampermonkey.net/
  4. // @version      2.0
  5. // @description  Adds an open in steam button next to workshop item titles.
  6. // @match        https://steamcommunity.com/workshop/filedetails/?id=*
  7. // @match        https://steamcommunity.com/sharedfiles/filedetails/?id=*
  8. // @grant        none
  9. // @license      MIT
  10. // ==/UserScript==
  11.  
  12. (function() {
  13.     'use strict';
  14.  
  15.     function addOpenInSteamButton() {
  16.         const workshopId = new URLSearchParams(window.location.search).get('id');
  17.         if (!workshopId) return;
  18.  
  19.         const titleElement = document.querySelector('.workshopItemDetailsHeader .workshopItemTitle');
  20.  
  21.         if (titleElement && !document.querySelector('#openInSteamBtn')) {
  22.             const container = document.createElement('div');
  23.             container.style.cssText = `
  24.                 display: flex;
  25.                 align-items: center;
  26.                 gap: 15px;
  27.                 margin-bottom: 10px;
  28.             `;
  29.  
  30.             titleElement.parentNode.insertBefore(container, titleElement);
  31.             container.appendChild(titleElement);
  32.  
  33.             const button = document.createElement('a');
  34.             button.id = 'openInSteamBtn';
  35.             button.className = 'btnv6_blue_hoverfade btn_medium';
  36.             button.href = 'steam://url/CommunityFilePage/' + workshopId;
  37.             button.innerHTML = '<span>Open in Steam</span>';
  38.             button.style.cssText = `
  39.                 display: inline-flex;
  40.                 align-items: center;
  41.                 justify-content: center;
  42.                 font-size: 12px;
  43.                 padding: 0 12px;
  44.                 height: 32px;
  45.                 line-height: 32px;
  46.                 white-space: nowrap;
  47.                 min-width: 90px;
  48.                 max-width: 100px;
  49.             `;
  50.  
  51.             container.appendChild(button);
  52.         }
  53.     }
  54.  
  55.     function initialize() {
  56.         let attempts = 0;
  57.         const maxAttempts = 20;
  58.  
  59.         function tryAdd() {
  60.             if (attempts >= maxAttempts) return;
  61.  
  62.             if (document.readyState === 'complete') {
  63.                 addOpenInSteamButton();
  64.             } else {
  65.                 attempts++;
  66.                 setTimeout(tryAdd, 500);
  67.             }
  68.         }
  69.  
  70.         tryAdd();
  71.     }
  72.  
  73.     initialize();
  74.  
  75.     const observer = new MutationObserver((mutations) => {
  76.         if (!document.querySelector('#openInSteamBtn')) {
  77.             addOpenInSteamButton();
  78.         }
  79.     });
  80.  
  81.     observer.observe(document.body, {
  82.         childList: true,
  83.         subtree: true
  84.     });
  85. })();