Blogi

HTML, WordPress ja sisu lisamine kodulehele V: Näpunäited

WordPressi keskkonnas on sisu lisamisel võimalik valida vähemalt kahe vaate vahel: visuaalne ja tekstivaade. Meie artiklite seeria alguses sai neile pilk heidetud.

Esimene on loodud sisu lisamise lihtsustamiseks ning pakub elementaarseid võimalusi nupuvajutusega teksti kujundada (kald- või rasvane kiri, loetelu, teksti joondus), linke või tsitaate lisada ning seda on lihtne kasutada. Teine vaade nn. tekstivaade tavaliselt sisu lisamisel kasutust ei leia, kuna siin esitatakse lisatav lehesisu  sarnaselt HTML koodiga ning seda tundmata on raske soovitud tulemuseni jõuda.

Üldiselt ei ole kogu lehe sisu tekstivaates lisamine mugav, kuid siinsest tekstist peaks siiski piisavalt aru saama, et mõista, millisel moel millist osa meie infost tähistatakse. Teatud juhtudel võivad sisu sisestamisel või muutmisel HTMLi teadmised osutuda  kasulikuks. Järgnevalt olgu toodud mõned sellised näited.

WP ja tabeli kasutamine

Kui sisulehel soovitakse kasutada tabeleid, siis võib HTMLi tundma õppimine olla möödapääsmatu. WordPressiga vaikimisi kaasas oleval  visuaalredaktoril puudub nimelt tabelitegemise funktsioon. Ning isegi kui su lehe malliga tuleb kaasa mõni uhkem sisukujundamise tööriist, võid sa avastada, et ka selle sees pead tabeli tegemiseks teadma HTMLi.

Jah, on olemas vastavad pluginad, mille saab installida wordpressi sees, kuid toimetajal ei pruugi  olla seda valikuvõimalust.

Loomulikult võib ka mujal tabeli valmis teha ja siis kopeerida ta oma lehele, kuid HTMLi tundmata ei saa sinna lisada ridu ega veerge. Igakord kui vaja uus rida tekitada, tuleb mujal tabel uuesti valmis teha.

Tabeli tegemise oskus võib tulla kasuks ka lehe sisu paigutuse kujundamisel. Kuigi seda tänapäeval enam heaks tooniks ei peeta, ei pruugi sisutoimetajal olla muid võimalusi (CSS-koodile ligi ei pääse ja ega sellega oskakski midagi teha, ühtegi Visual Composer või Cornerstone tüüpi leheehituse pluginat pole installitud, teemaga ka midagi kaasa ei tulnud). Kui ikkagi on vaja lehele kahte mitte ühte veergu ning tahetakse oma pilte, tekste, linke, ikoone, just kindlal moel paigutada ning tabel selles aitab, siis seda tuleb ka kasutada. Eriti kui tegu on erandjuhusega ning pole mõistlik arendajat kutsuda lehemalli ümberkirjutama.

WP, tühikud ja tühjad read

Lehele materjali lisamisel võib ette tulla juhuseid, kus soovime erinevate sisu osade vahele rohkem tühja ruumi. Enter ega tühik meid siin ei aita, sest brauser loeb neid vaid ühekordsetena, ükskõik kui palju me neid ka teksti ei lisaks. Nii tühjade ridade kui tühikute lisamiseks on vajalik HTML koodis leida üles õige koht ning vajalik märgend (  või  ) sinna kirjutada.

Tühikute lisamiseks soovitud sõnade või tähtede vahele lihtsalt lisada üks eelpool toodud erimärgistest sellesse kohta. Tühja rea lisamiseks lisada nende ridade vahele, kuhu tühja rida soovitakse, emb-kumb erimärgis paragrahvina:

<p>&nbsp;</p>

WP ja lingid

Mõnikord tekivad probleemid linkidega: nad ei pruugi üldse töötada (näiteks piltide asemel tühjad kohad, fail või lehekülg ei avane) või viia vanale või testlehele. Nii võib juhtuda näiteks siis, kui vahetatakse domeeninime ehk veebiaadressi või lingi sisestamisel tehakse viga või hilisemal lehe toimetamisel keegi kogemata olulise osa kas märgisest või aadressist ära kustutab. Kui tegemist on üksiku probleemiga, siis konkreetse lehe tekstivaates saab kiiresti kontrollida, kas lingi märgend ja aadress ikka on korrektsed ja vajadusel parandused teha. Visuaalredaktori vaates on vaja lingini jõudmiseks ja selle parandamiseks teha mitmeid lisaklikke.

Mõistlik oleks lehe siseste linkide-viidete korral kustutada ära aadressist protokolli ja domeeni nime osa (http://www.sinudomeeninimi.xx), seejuures jälgides, et allesjääv adressi osa algaks kaldkriipsuga. See kehtib nii lehele meediafaile lisades, kui ka teistele sisulehtedele viidates, aga ka css-faile sisu kujundamisel kasutades. Sel moel ei teki lehe teisele domeenile ületõstmisel  nii palju lingivigu.

WP ja manuste (teiste veebilehtede) lisamine

Ikka tekib olukordi, kus lehele tahaks lisada mõne video või dokumendi  manusena ehk nii, et koheselt oleks lisatud fail nähtav ja kasutatav. Näiteks leidsime Youtubest vahva video või oleme Google Formsis valmis teinud küsitluse. Ei tahaks ju, et inimene nende asjade nägemiseks kasutamiseks peaks meie lehelt lingile klikates lahkuma.

Selleks ongi manustamise süsteem (i.k. embedding)  välja mõeldud. Lihtsalt öeldes on see süsteem, kus sul on võimalik kopeerida vastava faili manustamiseks HTML kood ning see siis kleepida oma lehele.

HTMLi mõistes on see koodijupp, mida kopeerime, element <iframe>. Kleepima peame ta aga just tekstiredaktorisse, sest visuaalredaktorisse kleepides ei loeta seda koodina vaid tavalise tekstina ning külastaja näeb video või küsitluse asemel koodi.

Element <iframe> võimaldab meil näidata ühe veebilehe sees teist veebilehte ning  atribuut , mida me tema puhul alati näeme, on src, mis ütleb, millist lehekülge näidatakse. Muude atribuutide hulgas, mida võime näha, on näiteks kõrguse ja laiuse määramiseks atribuudid või täisekraani lubav atribuut.

WP ja redaktori avanemise kiirus

Sisumahukamate lehtede või aeglase interneti või muu lehe laadimise kiirust mõjutava teguri puhul võib juhtuda, et  tekstivaade avaneb kiiremini kui visuaalredaktori vaade, sest vormindus, pildid, lingid jmt on meie ees lihttekstina. Kui sellistel lehtedel on vaja tihti väikeseid muudatusi teha (nt kuupäev, kellegi/millegi nimi, rida teksti jne), siis võiks töös kasutada tekstivaadet.

Õige koha leidmise muudab lihtsamaks otsinguakna kasutamine (avamiseks klahvikombinatsioon CTRL+F).

Kokkuvõte

HTML tuleb kasuks, kui

  • tabelile on vaja lisada ridu
  • pärast veebilehe nime (domeeni) vahetust mõned viited ei tööta
  • sõnade või tähtede vahele on vaja lisaruumi
  • elementide vahele on vaja rohkem tühja ruumi kui lehe mall ette näeb
  • soov on lisada lehe sees vaatamiseks/kasutamiseks video või dokument mõnest teisest keskkonnast (nt Youtube, Google Drive)
  • kiiresti on vaja teha väike tekstimuudatus aeglaselt laadival sisulehel

Need olid vaid mõned näited, kus HTML saab sisutoimetajale appi tulla. Kui soovid HTML-i kohta rohkem teada, siis tasub külastada lehti  W3Schools.com  ja Metshein.com. Mõlemal lehel on tasuta õpikeskkond.

Loading Facebook Comments ...

Share Your Thoughts!

Copyright ©2005-. All Rights Reserved.