Saatteeksi: On hyvä muistaa, että enemmän voi olla liikaa. Näiden toimittajan tekemien upotusten lisäksi juttuihin injektoidaan mainoksia kuten ennenkin. Se tehdään vasta käyttäjän selaimessa. Toimitus ei siis voi koskaan nähdä valmista juttua juuri sellaisena kuin joku satunnainen käyttäjä sen näkee.
Mutta upotellaan! Ihan ensimmäiseksi grafiikka infogramista (html-lohko).
Semmoinen se.
Seuraavaksi lohkoeditorilla upotettu täysleveä kuva (template ”vu…”). Kuva valitaan templaten blanko-kuvaa klikkaamalla ja valitsemalla aukeavasta valikkopalkista ”Korvaa”. Kuvateksti voi kirjaoittaa suoraan paikoilleen kuvan alle kohtaan, jossa lukee ”(Kirjoita tähän haluamasi kuvateksti ja -kredit.)”.
Ja tässä blanko-template, jota käytetty Elinan upotuksessa.
Toinen vakioitu elementti voisi olla tekstinosto, tähän tapaan:
”Suspendisse a semper libero, a aliquam massa.”
– Ronald McDonald
Nosto tasataan vasemmalle deskarissa ja vaikka sille ei ole määritelty lukittua leveyttä, teksti näyttää kiertävan sitä nätisti. Jos huomaatte ongelmia, kertokaa Timolle. Mobiilissa lohko on käytännössä aina täysleveä.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam a felis sapien. Aliquam erat volutpat. Nunc vestibulum augue ex. Praesent sed sagittis elit.
Pellentesque convallis mattis tellus at eleifend. Duis porta lorem sed sem posuere, non lacinia neque bibendum. Vestibulum erat lectus, sagittis at nunc et, tincidunt pellentesque augue.
”Lorem ipsum dolor sit amet…”
– Nn Nn
Suspendisse a semper libero, a aliquam massa. Vivamus sit amet vulputate velit, non rhoncus ligula. Nulla facilisi.
Curabitur pulvinar, ligula at tristique bibendum, lorem erat tempor nulla, eget blandit sapien lacus id lectus. Mauris ullamcorper dui libero, finibus blandit mi ultrices id. Sed lacinia, libero ac viverra lobortis, mauris quam rutrum dolor, sed pharetra nulla nisl sed mi.
Aliquam erat volutpat. Mauris ut tellus id dolor aliquam porta in at libero. Sed id dictum tortor. Mauris at sapien ac tortor scelerisque feugiat.
Väliotsikko H4: Välitosikko Elon Musk äksyilee ja tahtoo viihdyttää
Ja vielä pikkukuva, joka tasataan vasemmalle ja teksti kiertää sitä nätisti niin deskarissa kuin mobiilissakin. Lohko ei siis ole täysleveä mobiilissa. Kuva skaalataan pieneksi mutta koko kuva-ala käytetään. Kuvia ei siis rajata vaan vaakakuvat ovat vaakoja ja pystykuvat pystyjä.
Kannattaa kurkata lopputulos myös mobiililaitteella, koska pitkät sanat voivat aiheuttaa hyppelyä.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam a felis sapien. Aliquam erat volutpat. Nunc vestibulum augue ex. Praesent sed sagittis elit.
Curabitur pulvinar, ligula at tristique bibendum, lorem erat tempor nulla, eget blandit sapien lacus id lectus. Mauris ullamcorper dui libero, finibus blandit mi ultrices id. Sed lacinia, libero ac viverra lobortis, mauris quam rutrum dolor, sed pharetra nulla nisl sed mi.
Pellentesque convallis mattis tellus at eleifend. Duis porta lorem sed sem posuere, non lacinia neque bibendum. Vestibulum erat lectus, sagittis at nunc et, tincidunt pellentesque augue.
Vanhoja tuttuja elementor-templatella upotettavia kuvia voi edelleen lisätä mutta ainakin toistaiseksi vain extroihin, joissa palsta on rauhallisempi. Esimerkki löytyy täältä. (Näin siksi, että noiden feature-kuvien käytöstä pääsee tarvittaessa säätämään sivupohjista käsin.)
Työn iloa!