Dæmi um efnisgreinar (paragraphs)

Styttri leið: Image - Event Carousel - Rich Text - Generic Carousel - Link Cards - Campaign - Form - Book Slider - Marquee - Remote Video - Document - Link Collection

Þegar við búum til efni fyrir síðuna höfum við úr þessum efnisgreinum að velja:

Hér fyrir neðan koma dæmi um allar þessar efnisgreinar og hvernig má haga þeim.

Fyrst er það...

Image

Þegar við veljum hana blasir þetta við okkur (linkur á mynd)

Efst getum við valið hlutföllin sem myndin á að hafa, á síðunni sem við erum að búa til.

Vel að merkja: þetta á bara við um þessa tilteknu notkun á þessari mynd. Við getum uploadað einhverri mynd einu sinni, og valið svo mismunandi hlutföll í hvert sinn sem við setjum hana inn á nýja síðu.

Til þess að sjá hvernig þessi mismunandi hlutföll líta út má fara á þessa síðu hér, sem er bara um það.

Hinn valkosturinn á þessari valmynd er "Bæta við margmiðlunarefni", smellum á það og fáum þetta hér (linkur á mynd):

Þarna neðar á skjánum sjást þær myndir sem hefur nýlega verið bætt inn á vefinn. Þannig að ef við erum að nota sömu myndina oft, þá sjáum við hana e.t.v. þarna í röðinni -- ef við sjáum hana ekki strax en vitum að hún er til í myndabankanum, þá getum við leitað að henni.

Þannir að hérna get ég annað hvort valið mynd úr listanum og svo 'insert selected', eða smellt á 'browse' efst í valmyndinni, og fundið mynd til að uploada.

Smellum á browse og veljum mynd til að upload, þá fáum við þessa valmynd (linkur á mynd)

Hér viljum við skrá annað og meira lýsandi heiti fyrir myndina, einmitt til þess að geta mögulega fundið hana aftur seinna.

Sömuleiðis verðum við að skrá alt texta, þeas. texta sem lýsir því sem er að gerast á myndinni, sem skjálesarar geta lesið fyrir sjóndapra eða blinda notendur.

Svona til dæmis:

Lengst til hægri á að birtast preview af myndinni, það er eitthvað misjafnt hvort það virkar. En ef vafrinn leyfir það þá er hægt að hægrismella á þennan tóma myndflöt og velja 'reload image':

Og þá getum við valið fókus punkt, hér er það barnavagninn:

Tilgangurinn með fókuspunktinum er sá að aðalatriði myndarinnar sé alltaf í ramma, hvaða hlutföll sem við veljum fyrir myndina.

Þannig að einsog ég nefndi hér fyrir ofan þá getur ein mynd birst í öllum þessum mismunandi hlutföllum á síðunni (ef ástæða er til) en fókuspunkturinn er alltaf sá sami. Þannig getum við amk. eftir fremsta megni komist hjá því að landscape myndir klippi höfuðið af viðfangi portrait myndarinnar okkar.

Ef við veljum engan fókus punkt þá lendir hann sjálfkrafa á miðjunni.

Við getum líka alltaf fundið myndina aftur í myndasafninu og stillt fókuspunktinn, eða breytt honum eftir á.

Event Carousel

Þessi er gríðarlega einföld: þegar við veljum hana fáum við að skrá titil, og búið (linkur á mynd)

Og þá fáum við svona rúllu einsog hér fyrir neðan.

Það er ekki hægt að leita eftir sérstökum flokkum eða staðsetningum eins og er, það er á verkefnalistanum.

Næst er það

Rich Text

Og það er sú sem við notum til að setja upp texta. Hér er mynd af henni:

Það eru ekkert gríðarlega margir valkostir til að sníða textann, rennum yfir þá hérna í röð frá vinstri til hægri:

Í fyrsta felliglugganum er sjálfvalið "paragraph", þeas. reglulegur texti. Hann lítur út eins og þessi texti sem þú ert að lesa núna.

Þetta er heading 2

Þetta er heading 3

Þetta er heading 4

Hér er dæmi um texta sem er feitletraður

Hér er dæmi um texta sem er skáletraður

Hér eru nokkur atriði um punktalista:

• Þeir draga fram aðalatriði
• Þeir krefjast þess að við séum stuttorð
• Þeir brjóta upp texta
• Þeir eiga aldrei að vera lengri en 7 atriði, helst færri

Það sem mér finnst best við tölulista:

1. Ég er mikið fyrir híerarkíu
2. Í öðru lagi kemur þetta næst
3. Eitt leiðir af öðru og best að lesa listann í röð
4. Hann á heldur ekki að vera neitt rosalega langur

Þar til hliðar kemur "Link" takkinn og við getum notað hann til að linka á efni innan sömu síðu, innan vefsins okkar, eða á annan vef.

Hér er dæmi um link á efni hér á þessari sömu síðu. Þessi vísar á "Rich Text" fyrirsögnina hér fyrir ofan.

.

Gefum þessum punkti eitthvað einfalt nafn og vistum með því að smella á vaffið:

Því næst getum við búið til sjálfan linkinn.

Merkjum textann þar sem linkurinn á að vera, og veljum link-takkann:

Og hér viljum við skrá inn myllumerkið (#) og svo nafnið á linknum sem við vorum að búa til. Þannig að í þessu dæmi er það #rich-text-daemi :

Vefurinn á eftir að segja 'no results' vegna þess að hann þekkir ekki þennan punkt sem við erum að vísa á, en það er allt í lagi. Veljum "Insert" og þá er linkurinn klár.

Linkur á efni inni á borgarbokasafn.is

Ef við erum að linka yfir á aðra síðu á borgarbokasafn.is getum við leitað eftir titli þeirrar síðu í leitarglugganum:

Þarna fæ ég upp síðuna sem ég leita að (bókasafnið í Grófinni), smelli á hana og við sjáum að vefurinn notar "innri" slóð þeirrar síðu, í þessu dæmi er það "/node/17". Þetta truflar ekki almenna notendur, sem sjá alltaf alias slóðina.

Linkur á annan vef

Ef ég vil tengja út frá vefnum þá bara lími ég eða skrifa heilu slóðina sem ég vil nota.

Vefurinn lætur mig vita að hann finni þessa síðu ekki á vefnum okkar, sem er eðlilegt, við getum bara valið 'insert'.

Ef við þurfum að breyta tenglinum eða stillingum fyrir hann eftir á, þá smellum við bara á texta tengilsins, og fáum þá upp valkosti.

En lesandi góður! Við erum enn að fara í gegnum valkostina í Rich text paragraphinu.

Hægra megin við linka-takkann eru gæsalappir, þetta má nota til að búa til "blockquote" eða inndregna tilvitnun. Hún lítur svona út:

Mannlegr sjaldgæf hvarfak skyggndist, jarðhúss bjartur aðgerðir, rangárleið flókahettu metorð írlands dalla mjúk bjór játaði. Smálöndum fyrirtæki óhegndar eyrbyggja, öruggt holti ambáttina, binda hatast svívirðingarlaust afturkoman fálynd úteyjar.

Og loks eru þarna valkostir fyrir jöfnun á texta,

Við getum hægrijafnað þessa línu.

Og svo getum við miðjujafnað þessa línu.

Þarmeð er Rich text yfirferðinni lokið.

Næst er það

Generic Carousel

Hún lítur svona út þegar við búum hana fyrst til. Hérna er ég búinn að færa inn aðaltitil, og titil, mynd og link fyrir fyrsta atriðið:

Þarna neðst til vinstri er takkinn "Bæta við Generic Carousel Element", þar getum við sett inn næsta atriði og svo koll af kolli.

Þegar við höfum "collapse"-að þessari General Carousel valmynd, eða vistað síðuna og farið aftur í edit, fáum við yfirlitsútgáfu, svo við getum farið beint í að breyta einstökum atriðum, eða breyta röðinni. Það gerum við með því að grípa í punktana sex á vinstri hliðinni og draga upp eða niður.

Næst:

Link Cards

Hér fyrir neðan er sú valmynd, þarna er ég að plögga Artótekið, og ég vel bláa litinn fyrir það, sjálft litaboxið kemur svo beint fyrir neðan myndina:

Þetta kemur ekkert rosalega fallega út þegar það er bara eitt spjald í einu, þá viljum við frekar nota aðra einingu sem ég sýni hér á eftir.

En neðst til vinstri er hægt að smella á "Bæta við Link card" og þannig er hægt að hafa 2 eða 3 í röð, einsog hér:

Ef við viljum ýta fram einhverju einu atriði getur verið betra að nota

Campaign

sem lítur svona út:

Það sem er þarna kallað "Watermark" er hugsað sem skraut. Það er takmarkað við 10 stafabil og á ekki að nota sem fyrirsögn.

Næst á listanum er

Form

Þar getum við fært inn vefslóð, og þetta er til þess hugsað að sækja og embedda vefform af vefnum forms.reykjavik.is. Innsetningarglugginn lítur svona út:

Ég ætla ekki að hafa dæmi um form hérna inni á þessari síðu, ég gerði sér dæmis-síðu fyrir það og hún er hér.

Þetta er í stuttu máli gert til þess að við höfum möguleika á því að setja upp vefform, en án þess að þurfa að smíða þá virkni á okkar vef. Þau sem sýsla með vefform fyrir vefinn okkar þurfa að fá aðgang að forms.reykjavik.is og koma sér inní málin þar, en þetta er ekki mikið notað hjá okkur eins og er..

Book Slider

Þetta getum við notað til þess að stilla fram bókum eða öðru efni.

Við gerum það með því að vísa í lista eða "rúllu" af efni sem búið er að taka saman í þar til gerðu kerfi á bokasofn.is.

Hvernig förum við að því? Það er efni í sér leiðbeiningar!

Hérna skulum við gefa okkur að listinn sé klár og við höfum ID númerið, sem í þessu dæmi er "1024".

við veljum Book slider og getum sett inn titil og ID númer:

Og þá fáum við þessa hér:

Marquee

sá lítur svona út, og þarna get ég valið annað hvort "Bæta við Marquee Link" eða "Bæta við Marquee Text":

Svona lítur þetta út þegar ég er búinn að fylla út í fjögur atriði, og svo birtist rúllan þar fyrir neðan:

Remote Video

Þetta er paragraph sem inniheldur embeddað youtube myndband. Við bætum henni við og fáum þá að bæta við margmiðlunarefni, rétt einsog með myndefnið.

Og rétt einsog með myndefni þá sjáum við eldra efni í listanum neðarlega í glugganum, og þar fyrir ofan getum við bætt inn nýju efni. 

En í þessu tilfelli þurfum við að líma inn youtube-slóð í textareitinn. Það þarf ekki að fara neinar krókaleiðir að því, við bara afritum slóðina beint á youtube myndbandið og límum inn, smellum svo á "Bæta við".

Myndbandið fær sjálfkrafa titilinn sem það ber á youtube en við getum skírt það eitthvað annað ef við viljum. Þessi titill er notaður í skráarkerfi vefsins en birtist ekki út á við.

Og myndbandið birtist svona hér:

Document

Þessi paragraph er til þess ætluð að stilla fram PDF skjali. Þegar við bætum henni inn þá getum við valið að bæta við margmiðlunarefni, þetta ferli er nánast það sama og fyrir myndefnið:

Við getum valið skjal sem er þegar búið að hlaða upp, eða hlaðið upp nýju skjali, og gefið því lýsandi titil:

Þegar það er vistað birtist skjalið valið í listanum neðst í glugganum:

Og þegar við höfum bætt skjalinu við og paragraphið er klárt þá lítur það svona út:

Við getum líka uploadað skjalinu og linkað í það úr texta, ef við viljum síður nota þessa einingu hér fyrir ofan.

Þá förum við í "Stofna" og "Document" í vinstri valmyndinni:

Þar getum við bætt inn skjali á sama hátt og ég lýsti hér fyrir ofan. 

Förum svo í "Margmiðlunarefni" og finnum skjalið í listanum

Ef við opnum það, smellum svo á sjálft PDF skjalið svo það opnist í vafranum, þá getum við afritað slóðina

og fært hana inn sem link í texta:

Næst á listanum er

Link Collection

Sem er það sem við höfum efst á forsíðunni (og víðar) til þess að ýta fram efni. Hérna er ég að færa inn eitthvað sniðugt:

Þarna neðst til vinstri er hægt að velja "Bæta við Link collection item" og færa inn fleiri atriði. Þessi eining gerir ráð fyrir 2-4 atriðum, og það er hægt að draga þau upp eða niður til að umraða, alveg eins og með Generic carousel eininguna.

Hér fyrir neðan er tilbúin collection item eining: