TCN Forum, I did it the 3.0 way ?

12 jan 2019 11:59 - 12 jan 2019 12:18 #1 door DannyE
TCN Forum, I did it the 3.0 way ? werd gestart door DannyE
Toen ik nog in de Internetcommissie aan de achterkant bij knoppen zat was het makkelijk,
niemand snapte wat ik deed, dus paste alles aan aan eigen wensen.

Nu zit ik aan de voorkant.

Maar als ik mijn eigen motor kan pimpen... dan kan ik ook de pagina in mijn Browser pimpen..

Gebruikte altijd al tooltjes om dat Forum naar mijn wensen af te richten... maar je moest er altijd nog een techneut voor zijn om ze te gebruiken.
Tegenwoordig zijn er veel simpele JavaScript/CSS Browser Extensions zodat het voor iedereen te doen is.

Wat het kan

Ik bepaal welke Boards voor mij belangrijker zijn.
Kan natuurlijk ook het hele Board 'Varadero' uitzetten in mijn instellingen, maar dat wil ik weer niet.
Soms lees ik die gedimde berichten wel.

[/size]
Op Fora heb je altijd azijnzeikers die veel posten maar weinig zeggen;
normaliter herken je de naam en lees je eroverheen.
Ik stel in dat die personen gedimd worden, als ik muis eroverheen beweeg kan ik het bericht nog lezen:



Hoe doe je dit

Ik gebruikte voor Chrome Browser: CJS 
chrome.google.com/webstore/detail/custom...kjbjdk/related?hl=en

Maar er zijn tientallen extensies die Javascript aan een site kunnen toevoegen.
(noot: oudere IE/Microsoft browsers willen nog wel eens moeilijk doen, gebruik een moderne Chrome/FireFox versie

Op de TCN Forum sites activereer je de CJS extensie,
plakt het script, en druk save



Het volledige script wat je moet knippen/plakken:
//Transaclub.nl/forum verbeteraar VERSIE 1
//past vormgeving wat subtieler aan
//om onderwerpen die jij belangrijk vindt duidelijker te presenteren
//om personen wiens geouwehoer je minder belangrijk vindt te 'dimmen'
 
//take care, newStyle must be valid CSS
// *= is the CSS 'contains' selector
newStyle=`
/* Style the ongelezen/reacties list die jij belangrijk of niet vindt */
    [board*="Techniek"],[board*="lid"],[board*="Transalp"]{
        font-weight:bold;
    }
    [board*="Varadero"],[board*="Twin"]{
        opacity:0.7;
    }
/* Post header signature mogen wat subtieler, lezen we toch nooit */
    .postcount,,keyinfo .smalltext,.reportlinks,.signature {opacity: 0.6;}
/* set minimum height so message area is app. same height as Avatar */
    .inner {min-height: 12em;}
    .reportlinks:hover,.signature:hover{opacity: 1;}
/* large quoted text (we're getting old and have problems with small fonts) */
    .bbc_standard_quote.bbc_standard_quote {
        font-size: 100%;border-top: unset;border-bottom: unset;margin-left: 2em;
    }
 
/* persons I prefer not to read */
[poster*="Danny E"]{
        max-height: 6em;
        overflow: hidden;
        opacity: 0.7;
        border:1px dashed red;
    }   
    [poster]:hover{
        max-height:unset;
        opacity:1;
    }
}
`;//end style.innerHTML
 
/** Javascript is required to prepare the page for the above Styles 
 * Edit with care
**/
let proces=(selector,parent,attr)=>
//find selector
//take its textcontent
//stick it as attr on a parent HTML element
//now CSS Styles can target all its child content
[...document.querySelectorAll(selector)].forEach(el=>{
    try{
        el.closest(parent).setAttribute(attr,el.textContent.trim())
    }catch(e){//a selector might not be on this HTML page
        console.warn(selector,parent,attr,el);
    }
});
proces('em','tr','board');
proces('.poster>H4','.post_wrapper','poster');
 
//add the newStyle to the page so it gets applied
let style=document.body.appendChild(document.createElement('STYLE'));
style.innerHTML = newStyle;
//MIT license


Vragen, Browser issues verneem ik graag in dit topic




.

Youtube: I don't want to be...

Danny@Engelman.nl - 🏍️ 2 x Transalp 600 '98 'Betsy' & kloon 'Dolly' 🏍️ 2 x NX250 '93 'Daisy' & 'Meggy Meccano' (rebuild video met Jeroen Emke)
www.BikeSwap.org :...

Gelieve Inloggen of een account aanmaken om deel te nemen aan het gesprek.

Moderators: Huib@1100
Tijd voor maken pagina: 0.171 seconden