Forum Mjukvara Moln- och internettjänster Tråd Inlägg

Ändra storlek på hyperlänksförhandsvisning i Chrome

1
Skriv svar
Permalänk
Medlem ★
●

Ändra storlek på hyperlänksförhandsvisning i Chrome

Hej SweC,

I jobbet behöver jag notera och skriva ned vissa delar av webblänkar (massvis). Jag utgår från en sida där jag kan hovra över dessa länkar, för att sedan läsa av hyperlänksförhandsvisningen nere i vänstra hörnet och därefter skriva ned den önskade delen av texten i ett dokument. Detta är en mycket snabbare metod än att öppna länken då jag måste navigera tillbaka till originalsidan för att fortsätta arbetet efter att noteringen är klar.

Jag har en tanke om att det kanske är möjligt att förstora denna förhandsvisning, så att jag slipper spänna ögonen varje gång jag ska försöka lokalisera den text jag behöver läsa av.

En workaround jag tänkte mig kan fungera är att zooma in i webbläsaren, men det ger inget. Att ändra skalning i Windows till 200% ger mig en tillräcklig inzoomning men jag föredrar att arbeta i 100% (1440p, 27").

Efter en del googlande och Bingande (d.v.s. använt Bings ChatGPT-funktion) kommer jag fram till att dessa delar av Chrome interface inte går att redigera (dock är infon rätt gammal och hittar ingen ny information som styrker detta), dock så blir jag tipsad om att använda Custom Themes för chrome för att utföra denna uppgift. När jag tittat närmare på det så ser det inte ut som att jag kan uppnå mitt mål genom den metoden heller.

Därför vänder jag mig nu till er och undrar om någon har en idé om hur jag kan få till detta. Bifogar en bild för att förtydliga vad jag menar med hyperlänksförhandsvisningen.

Visa signatur

Crewmedlem på SandHack, det lilla lanet i Sandviken

Redigera
Citera flera Citera
Permalänk
Medlem ★
●

Att ändra hur den ser ut är garanterat mer jobb än det är värt.

Vad ska du göra med länken? Låter som att du skulle spara tid och göra färre misstag om du bara kopierar den till urklipp (genom högerklicksmenyn eller fixa ett userscript som låter dig kopiera med Shift+Klick eller något) istället för att skriva av något manuellt. Eller skriver ett skript som gör hela jobbet åt dig.

Visa signatur

Spela Swemantle! Du vet att du vill.

Ibland har jag fel, men då är det någon annans fel.

Redigera
Citera flera Citera
Permalänk
Medlem ★
●

Ett exempel på en sida där du ska hämta delar av länkar vore till hjälp för att förstå problemet. Vad är syftet med arbetet? Är länkarna någorlunda lika formaterade? Låter som något som skulle gå att scripta.

Visa signatur

Primär: R9 3900X | ASUS X570-F Gaming | NH-D15 | 64GB@3200MHz | RTX 3080 10GB | Seasonic 850W | Fractal Define R6 |
Gamla bettan: i5 750@3.8GHz | 8GB | HD5770 | Corsair VS 550W | FD R2 |

Redigera
Citera flera Citera
Permalänk
Medlem ★
●
Skrivet av Daz:

Ett exempel på en sida där du ska hämta delar av länkar vore till hjälp för att förstå problemet. Vad är syftet med arbetet? Är länkarna någorlunda lika formaterade? Låter som något som skulle gå att scripta.

Gå till inlägget

Precis! Om det finns någon form av gemensam nämnare så borde det gå.

Jag är ingen expert, men ponera att du har en sida där alla länkar är a-taggar och är till antingen en sida på Google eller Microsoft som i exemplet nedan:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="x-ua-compatible" content="ie=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <title></title>
  </head>

  <body>
    <a href="https:/www.google.se/a">Google A</a><br />
    <a href="https:/www.google.se/b">Google B</a><br />
    <a href="https:/www.microsoft.se/a">Microsoft A</a><br />
    <a href="https:/www.microsoft.se/b">Microsoft B</a><br />
  </body>
</html>

... Så kan man i webbläsarens konsoll (F12) klistra in nedanstående script som samlar ihop och matchar alla länkar mot "microsoft" i det här fallet och skriver ut länken som "gömmer sig" men som syns när man hovrar, som man sedan kan kopiera och göra vad man vill med.

var all_links = document.body.getElementsByTagName("a");
var matched_links  = [];

for (link of links) {
  if (/microsoft/.test(link.href)) {
    matched_links.push(link.href);
  }
}

for (link of matched_links) {
  console.log(link);
};

... Som ett snabbt exempel, alltså. Vill man som ett annat exempel scripta ut bara en del av länken ("/a", eller så) är det inga större problem.

Senast redigerat
Redigera
Citera flera Citera
Permalänk
Medlem ★
●
Skrivet av LemonIllusion:

Att ändra hur den ser ut är garanterat mer jobb än det är värt.

Vad ska du göra med länken? Låter som att du skulle spara tid och göra färre misstag om du bara kopierar den till urklipp (genom högerklicksmenyn eller fixa ett userscript som låter dig kopiera med Shift+Klick eller något) istället för att skriva av något manuellt. Eller skriver ett skript som gör hela jobbet åt dig.

Gå till inlägget

Jag ska plocka ut ett ID på 4-6 siffror som sedan ska föras in i ett dokument.

Skrivet av Daz:

Ett exempel på en sida där du ska hämta delar av länkar vore till hjälp för att förstå problemet. Vad är syftet med arbetet? Är länkarna någorlunda lika formaterade? Låter som något som skulle gå att scripta.

Gå till inlägget

Kortfattat så arbetar jag med guider till ett system där vi vid releaser behöver uppdatera vissa guider. Som en del i arbetet letar jag fram guider i ett system och för sedan in deras ID'n i ett arbetsdokument. Sidorna där länkarna finns är tyvärr bakom företagets SSO. Länkarna är likadant formaterade.

Skrivet av felplacrd:

Precis! Om det finns någon form av gemensam nämnare så borde det gå.

Jag är ingen expert, men ponera att du har en sida där alla länkar är a-taggar och är till antingen en sida på Google eller Microsoft som i exemplet nedan:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="x-ua-compatible" content="ie=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <title></title>
  </head>

  <body>
    <a href="https:/www.google.se/a">Google A</a><br />
    <a href="https:/www.google.se/b">Google B</a><br />
    <a href="https:/www.microsoft.se/a">Microsoft A</a><br />
    <a href="https:/www.microsoft.se/b">Microsoft B</a><br />
  </body>
</html>

... Så kan man i webbläsarens konsoll (F12) klistra in nedanstående script som samlar ihop och matchar alla länkar mot "microsoft" i det här fallet och skriver ut länken som "gömmer sig" men som syns när man hovrar, som man sedan kan kopiera och göra vad man vill med.

var all_links = document.body.getElementsByTagName("a");
var matched_links  = [];

for (link of links) {
  if (/microsoft/.test(link.href)) {
    matched_links.push(link.href);
  }
}

for (link of matched_links) {
  console.log(link);
};

<Uppladdad bildlänk>

... Som ett snabbt exempel, alltså.

Gå till inlägget

Detta låter som en del av en alternativ lösning jag kan tänka mig. Behovet är som sådant att jag behöver plocka ut följande ur en länk (i fetstilt): ***.***.com/1632.guide

Tyvärr så kommer länken som leder till denna guide på sidan inte vara den enda länken, och jag behöver endast vissa ID'n. För att skriptet ska fungera någorlunda smidigt så behöver jag alltså kunna köra det vid hover på aktuell länk, som om jag kopierar den fetstilta delen i stället för hela länken. Kan tänka mig att detta borde gå att göra med ett Chrome-plugin.

Jag är en novis när det kommer till programmering.. Jag kan läsa mig till logiken i din kod, men att skriva är helt uteslutet tyvärr :/ Är det ens möjligt att göra som jag tänker?

Senast redigerat Ett par ord
Visa signatur

Crewmedlem på SandHack, det lilla lanet i Sandviken

Redigera
Citera flera Citera
Permalänk
Medlem ★
●

Finns webläsartillägg som hämtar alla länkar på en sida, t ex https://github.com/MichelePezza/CopyLinksplusplus
Sen lite skript, makro i Notepad++ eller lite kreativt excel-arbete borde ju hjälpa dig.

Redigera
Citera flera Citera
Permalänk
Medlem ★
●
Skrivet av trattgunnar:

Behovet är som sådant att jag behöver plocka ut följande ur en länk (i fetstilt): ***.***.com/1632.guide

För att skriptet ska fungera någorlunda smidigt så behöver jag alltså kunna köra det vid hover på aktuell länk

Gå till inlägget

Inget av ovanstående är något större problem. Om ingen annan hinner före så skriver jag ihop ett exempel senare idag.

I och för sig tänker jag att det måste finnas nåt bättre sätt att "välja" länkar än att hovra på dem, då man säkerligen kommer hovra fel. Men ett mitt-klick eller nåt borde ju gå lika bra.

Redigera
Citera flera Citera
Permalänk
Medlem ★
●
Skrivet av trattgunnar:

Jag ska plocka ut ett ID på 4-6 siffror som sedan ska föras in i ett dokument.

Gå till inlägget

Ett userscript som gör att man får en liten popupruta med ID:t extraherat (om det fanns ett ID, annars bara hela länken) om man skiftklickar på en länk:

Klicka för mer information 
// ==UserScript==
// @name ShiftClickLinkThingy
// @version 0.1
// ==/UserScript==

let shift = false;

window.addEventListener("keydown", event => {
    if (event.key === 'Shift') {
        shift = true;
    }
});

window.addEventListener("keyup", event => {
    if (event.key === 'Shift') {
        shift = false;
    }
});

for (const link of document.querySelectorAll("a")) {
    link.addEventListener("click", event => {
        if (shift) {
            event.preventDefault();
            let match = link.href.match(/(\d+).guide/);
            if (match) {
                prompt("", match[1]);
            } else {
                prompt("", link.href);
            }
        }
    });
}
Visa mer

Installera med https://violentmonkey.github.io/ eller liknande userscripthanterare.

Demo: https://jsfiddle.net/qutyomv7/4/ (Klicka en gång i panelen nere till höger först för att det ska fungera. Hanteringen av att känna av om shift är nedtryckt är inte optimal.)

EDIT: Insåg nu att det här kanske inte fungerar på alla hemsidor om länkarna läggs till med javascript. :/

Senast redigerat
Visa signatur

Spela Swemantle! Du vet att du vill.

Ibland har jag fel, men då är det någon annans fel.

Redigera
Citera flera Citera
Permalänk
Medlem ★
●

Supersnyggt med userscript!

Kunde inte låta bli att färdigställa min enklare "klistra-i-konsollen"-variant. Shift-klick (utmärkt idé) för att skriva ut varje matchad länk allt eftersom de läggs till.

const my_links = [];

function handleLinkClick(event) {
    if (event.target.hasAttribute("href") && (event.shiftKey)) {
        event.preventDefault();
        if (match = event.target.href.match(/\/(\d+).guide$/)) {
            my_links.push (match[1]);
            console.log(my_links.join(', '))
        }
    }
}

document.addEventListener('click', handleLinkClick);

Här är det som userscript också, så man slipper klistra in något i konsollen varje gång man byter sida. Ändra domänen i @match och installera enligt LemonIllusions instruktion ovan. När du shift-klickar skrivs matchade länkar ut i konsollen (F12) [edit: och till en ruta längst ner på sidan].

// ==UserScript==
// @name         Yet Another ShiftClickLinkThingy
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  Tracks numeric parts of links ending in ".guide"
// @author       felplacrd 
// @match        https://xxx.xxx.com/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    const my_links = [];
  
    const displayDiv = document.createElement('div');
    displayDiv.style.position = 'fixed';
    displayDiv.style.bottom = '10px';
    displayDiv.style.right = '10px';
    document.body.appendChild(displayDiv);

    function handleLinkClick(event) {
        const target = event.target;

        if (target.hasAttribute("href") && event.shiftKey) {
            const match = target.href.match(/\/(\d+)\.guide$/);

            if (match) {
                event.preventDefault();
                my_links.push(match[1]);
                console.log(my_links.join(', '));
                displayDiv.textContent = my_links.join(', ');
            }
        }
    }

    document.addEventListener('click', handleLinkClick);
})();
Senast redigerat
Redigera
Citera flera Citera
Permalänk
Medlem ★
●
Skrivet av felplacrd: 
event.shiftKey
Gå till inlägget

Tusen tack! Det hade ju underlättat om jag kände till den här.

Har du någon idé för att lösa situationer där a-taggen har barn? Känns lite tråkigt att kolla igenom alla föräldrar, så jag hoppades att man bara kunde låta eventet bubbla vidare tills det träffade en a-tagg, men fick det inte att fungera. :/

<a href="https://***.***.com/42.guide"><h1>Liftarens guide till galaxen</h1></a>
Visa signatur

Spela Swemantle! Du vet att du vill.

Ibland har jag fel, men då är det någon annans fel.

Redigera
Citera flera Citera
Permalänk
Medlem ★
●
Skrivet av LemonIllusion:

Tusen tack! Det hade ju underlättat om jag kände till den här.

Har du någon idé för att lösa situationer där a-taggen har barn? Känns lite tråkigt att kolla igenom alla föräldrar, så jag hoppades att man bara kunde låta eventet bubbla vidare tills det träffade en a-tagg, men fick det inte att fungera. :/

<a href="https://***.***.com/42.guide"><h1>Liftarens guide till galaxen</h1></a>
Gå till inlägget

Om det alltid är ett eller flera element ovanför:

    <a href="/42.guide"><h1>Liftarens guide till galaxen</h1></a>
    <a href="/43.guide"><h1><u>Don't Panic</u></h1></a>

... så kan man stega upp genom föräldrarna med closest():

const target = event.target.closest('a');

.

Senast redigerat
Redigera
Citera flera Citera
Permalänk
Medlem ★
●
Skrivet av felplacrd:

Om det alltid är ett eller flera element ovanför:

    <a href="/42.guide"><h1>Liftarens guide till galaxen</h1></a>
    <a href="/43.guide"><h1><u>Don't Panic</u></h1></a>

... så kan man stega upp genom föräldrarna med closest():

const target = event.target.closest('a');

.

Gå till inlägget

Snyggt! Då borde det ju funka i alla lägen om man slänger in ett anrop till closest innan man läser href.

Klicka för mer information 
// ==UserScript==
// @name         Yet Another ShiftClickLinkThingy
// @namespace    http://tampermonkey.net/
// @version      0.2
// @description  Tracks numeric parts of links ending in ".guide" 
// @author       felplacrd and LemonIllusion
// @match        *://*/*
// @grant        none
// @homepageURL  https://www.sweclockers.com/forum/trad/1696349-andra-storlek-pa-hyperlanksforhandsvisning-i-chrome
// ==/UserScript==

(function() {
    'use strict';

    const my_links = [];

    const displayDiv = document.createElement('div');
    displayDiv.style.position = 'fixed';
    displayDiv.style.bottom = '10px';
    displayDiv.style.right = '10px';
    document.body.appendChild(displayDiv);

    function handleLinkClick(event) {
        const target = event.target.closest("a");

        if (target && target.hasAttribute("href") && event.shiftKey) {
            event.preventDefault();
            const match = target.href.match(/\/(\d+)\.guide$/);

            if (match) {
                my_links.push(match[1]);
                console.log(my_links.join(', '));
                displayDiv.textContent = my_links.join(', ');
            }
        }
    }

    document.addEventListener('click', handleLinkClick);
})();
Visa mer
Senast redigerat
Visa signatur

Spela Swemantle! Du vet att du vill.

Ibland har jag fel, men då är det någon annans fel.

Redigera
Citera flera Citera
Permalänk
Medlem ★
●
Skrivet av LemonIllusion:

Snyggt! Då borde det ju funka i alla lägen om man slänger in ett anrop till closest innan man läser href.

Klicka för mer information 
// ==UserScript==
// @name         Yet Another ShiftClickLinkThingy
// @namespace    http://tampermonkey.net/
// @version      0.2
// @description  Tracks numeric parts of links ending in ".guide"
// @author       felplacrd
// @match        *://*/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    const my_links = [];

    const displayDiv = document.createElement('div');
    displayDiv.style.position = 'fixed';
    displayDiv.style.bottom = '10px';
    displayDiv.style.right = '10px';
    document.body.appendChild(displayDiv);

    function handleLinkClick(event) {
        const target = event.target.closest("a");

        if (target && target.hasAttribute("href") && event.shiftKey) {
            event.preventDefault();
            const match = target.href.match(/\/(\d+)\.guide$/);

            if (match) {
                my_links.push(match[1]);
                console.log(my_links.join(', '));
                displayDiv.textContent = my_links.join(', ');
            }
        }
    }

    document.addEventListener('click', handleLinkClick);
})();
Visa mer
Gå till inlägget

Yes! v0.2 Ser ut att fungera perfekt. Bra samarbete för att få en lösning på plats. Hoppas TS blir nöjd

Du kan väl lägga till ditt eget namn under @author samt @source med en länk till tråden så blir det ordning och reda.

Redigera
Citera flera Citera
Permalänk
Medlem ★
●
Skrivet av felplacrd:

Yes! v0.2 Ser ut att fungera perfekt. Bra samarbete för att få en lösning på plats. Hoppas TS blir nöjd

Du kan väl lägga till ditt eget namn under @author samt @source med en länk till tråden så blir det ordning och reda.

Gå till inlägget

Fixat

Visa signatur

Spela Swemantle! Du vet att du vill.

Ibland har jag fel, men då är det någon annans fel.

Redigera
Citera flera Citera
Permalänk
Medlem ★
●

Kommer att prova detta under veckan som kommer

Visa signatur

Crewmedlem på SandHack, det lilla lanet i Sandviken

Redigera
Citera flera Citera
1
Skriv svar