Ohje:Ulkoasun muokkaaminen

Vasemman reunan työkalurivin linkkejä pystyy piilottamaan lisäämällä niille display:none määrityksen henkilökohtaiseen css-tiedostoon. Vakioasetuksilla se tiedoston nimi on Käyttäjä:Käyttäjätunnus/vector.css. Suoran linkin kyseiseen tiedostoon löytää henkilökohtaisten asetusten ulkoasu-välilehdeltä.

Käyttö

Alla olevista jokainen rivi piilottaa kyseisellä rivillä määritetyn linkin ja niitä käytetään kopioimalla haluttu rivi henkilökohtaiseen css-tiedostoon.

#n-mainpage-description { display:none; }  /* Etusivu */#n-aboutsite            { display:none; }  /* Tietoja Wikipediasta */#n-allarticles          { display:none; }  /* Kaikki sivut */#n-randompage           { display:none; }  /* Satunnainen artikkeli */#n-help                 { display:none; }  /* Ohje */#n-portal               { display:none; }  /* Kahvihuone */#n-currentevents        { display:none; }  /* Ajankohtaista */#n-recentchanges        { display:none; }  /* Tuoreet muutokset */#n-sitesupport          { display:none; }  /* Lahjoitukset */

Esimerkki 1

• Esimerkki toimivasta css-tiedostosta joka piilottaa kaikki ylläolevat linkit.

Vasemmanreunan palkkiin saa lisättyä linkkejä henkilökohtaisessa javascript-sivulle tulevalla addPortletLink-funktiolla. Tiedoston nimi Wikipedian vakiona käytössä olevalla vector-ulkoasulla on käyttäjä:käyttäjätunnus/vector.js. Suoran linkin kyseiseen tiedostoon löytää myös asetusten ulkoasu välilehdeltä. Linkkien lisäämistä voi kokeilla copy-pastettamalla allaolevia esimerkkejä henkilökohtaiselle javascript-sivullensa.

Käyttö

addPortletLink(valikko, url, otsikko, id, tooltip, paikka);

Parametrit

• Valikko = mihin valikkoon linkki lisätään. (Vaihtoehdot "p-navigaatio" = päävalikko; "p-interaction" = osallistuminen ; "p-tb" = työkalut)
• URL = www-osoite
• Otsikko = linkin otsikko
• id = jokin valinnanvarainen nimi linkille. Nimen pitää olla uniikki.
• tooltip = selitys sille mitä linkki tekee; työkaluvihje
• Paikka = minkä elementin jälkeen uusi elementti lisätään. Jos parametrin jättää tyhjäksi, lisätään uusi elementti valikon viimeiseksi.

Esimerkki 1

Lisätään päänavigaatioon kolme linkkiä

addOnloadHook((function() {  addPortletLink(    'p-navigation',    'http://fi.wikipedia.org/wiki/Käyttäjä:Zache/Hiekkalaatikko',    'Hiekkalaatikko',    'uniikki_id1',    'Siirry hiekkalaatikkoon', '', '');  addPortletLink(    'p-navigation',    'http://www.google.com',    'Google',    'uniikki_id2',    'Siirry googleen', '', '');  addPortletLink(    'p-navigation',    'http://fi.wikinews.org',    'Wikiuutiset',    'uniikki_id3',    'Siirry wikiuutisiin', '', '');})());

Esimerkki 2

Lisätään päänavigaatioon, osallistumiseen ja työkaluihin yksi linkki jokaiseen

addOnloadHook((function() {  addPortletLink(    'p-navigation',    'http://fi.wikipedia.org/wiki/Käyttäjä:Zache/Hiekkalaatikko',    'Hiekkalaatikko',    'uniikki_id1',    'Siirry hiekkalaatikkoon', '', '');  addPortletLink(    'p-interaction',    'http://www.google.com',    'Google',    'uniikki_id2',    'Siirry googleen', '', '');  addPortletLink(    'p-tb',    'http://fi.wikinews.org',    'Wikiuutiset',    'uniikki_id3',    'Siirry wikiuutisiin', '', '');})());

Esimerkki 3

Tehdään oma alamenu johon lisätään kolme linkkiä.

• Esimerkki javascript-sivusta jossa alla oleva on käytössä.

addOnloadHook((function() {  var toolboxElement    = document.getElementById("p-tb");  var inspectionElement = toolboxElement.cloneNode(true);  inspectionElement.id        = "p-oma";  inspectionElement.innerHTML = "<h5>Omat linkit</h5><div class=body><ul></ul></div>";  toolboxElement.parentNode.insertBefore(inspectionElement, toolboxElement.nextSibling);  addPortletLink(    'p-oma',    'http://fi.wikipedia.org/wiki/Käyttäjä:Zache/Hiekkalaatikko',    'Hiekkalaatikko',    'uniikki_id1',    'Siirry hiekkalaatikkoon', '', '');  addPortletLink(    'p-oma',    'http://www.google.com',    'Google',    'uniikki_id2',    'Siirry googleen', '', '');  addPortletLink(    'p-oma',    'http://fi.wikinews.org',    'Wikiuutiset',    'uniikki_id3',    'Siirry wikiuutisiin', '', '');})());