Useisiin MyCashflow-verkkokauppojen sisältötyyppeihin kuuluu tekstikenttiä, joissa voit muotoilla sisältöä käyttämällä graafista tekstieditoriamme.

Näitä tekstikenttiä löydät esimerkiksi:

Käyttöönotto

Jos verkkokauppasi ei vielä käytä kaikissa tekstikentissä uutta tekstieditoria, voit ottaa sen käyttöön koko verkkokaupan laajuisesti käyttämällä editorien massamuutostyökalua.

Voit aloittaa massamuutoksen tekstieditorien yhteydessä sijaitsevan ilmoituksen kautta.

Jos haluat, voit myös vaihtaa yksittäisiä sivuja käyttämään uutta tekstieditoria. Näin voit testata editorin käyttämistä ennen lopullista siirtymistä uuteen editoriin.

Tekstinkorostuskeinot

MyCashflow'n WYSIWYG-tekstieditorissa voit lisätä tekstiin helposti yleisimpiä tekstinkorostuskeinoja.

Alla on esitelty WYSIWYG-tekstieditorissa saatavilla olevat tekstinkorostustoiminnot:

  • : Lihavointi
  • : Kursiivi
  • Alleviivaus
  • : Yliviivaus
  • : Tekstieditoriin kuuluu useita valmiita tyylejä, joiden avulla voit luoda monipuolisia tekstielementtejä.

    Otsikkotyylien avulla voit luoda HTML-otsikot h1–h6. Otsikot on aina suositeltavaa luoda otsikkotyylien avulla.

    Lainaus-tyylin avulla voit luoda sisennetyn tekstikatkelman.

    Koodi-tyylin avulla voit kirjoittaa tasavälisellä fontilla merkittyä tekstiä, jossa ei voi käyttää muita muotoiluja.

  • : Tekstin asemointi (esim. tasaus vasemmalle tai oikealle)
  • Lisää tekstiin viivoja, joiden avulla voit esimerkiksi visuaalisesti jakaa tekstikappaleita.
  • Aseta haluamasi värit ja taustavärit tekstille.

Listojen käyttäminen tekstissä

Voit luoda MyCashflow'n tekstieditorissa numeroituja ja numeroimattomia listoja.

Jos haluat luoda listaan useita tasoja MyCashflow'n tekstieditorissa, sisennä haluamaasi listankohtaa käyttämällä työkalupalkin sisennystoimintoja >Lisää sisennystä ja <Vähennä sisennystä.

Voit myös käyttää erityyppisiä listoja toistensa sisällä. Valitse tällöin esimerkiksi numeroitu listankohta, jonka haluat muuttaa numeroimattomaksi, ja paina tarvittavaa listapainiketta editorin työkalupalkissa:

Taulukkojen käyttäminen tekstissä

Voit lisätä MyCashflow'n tekstieditorissa sisällön joukkoon taulukkoja editorin helppokäyttöisen taulukkotyökalun avulla:

Lue lisää MyCashflow'n tekstieditorista.

  1. Valitse Lisää taulukko editorin työkalupalkin taulukkovalikosta .
  2. Muuta halutessasi taulukon kokoa käyttämällä taulukkovalikossa olevia vaihtoehtoja.
  3. Lisää halutessasi taulukolle otsikkorivi:

Editorin taulukkovalikossa voit myös poistaa rivejä sekä sarakkeita milloin tahansa taulukon luomisen jälkeen. Voit myös poistaa koko taulukon.

Kuvien käyttäminen sisältökentissä

Voit lisätä sisältökenttään kuvia useilla eri tavoilla.

Voit lisätä uusia kuvia tekstiin raahaamalla ne tekstin joukkoon omalta tietokoneeltasi tai käyttämällä editorin kuvatyökalua:

  1. Avaa kuvanlisäysikkuna painamalla kuvapainiketta .
  2. Jos haluat lisätä uuden kuvatiedoston, raahaa tai valitse se Lataa-välilehdellä omalta tietokoneeltasi.
  3. Jos haluat käyttää jotain kuvaa kaupan tiedostohakemistosta, siirry Valitse-välilehdelle, ja valitse haluamasi kuva.

    Et voit käyttää sisältökentissä tuotekuvia, vaan ainoastaan sellaisia kuvia, joita on käytetty muissa sisältökentissä.

    Jos haluat käyttää sisältökentissä muita kuvia, sinun on lisättävä ne erikseen käyttämällä sisältökentän kuvanlatausta.

    Voit myös kopioida haluamasi tuotekuvat tiedostohakemistoon /files/content_images, jolloin ne ovat käytettävissä sisältökentissä.

  4. Sulje kuvanlatausikkuna.

Sisältökuvien sijainti tiedostohakemistossa

Sisältökenttiin lisätyt kuvat tallennetaan automaattisesti verkkokaupan tiedostohakemistoon /files/content_images, jonka löydät helpoiten käyttämällä tiedostoselainta.

Kuvien koon muuttaminen sisältökentässä

Kun olet lisännyt kuvan tekstikenttään, voit muuttaa sen näyttökokoa:

  1. Paina kuvaa tekstikentässä
  2. Tartu neliöön kuvan oikeassa alakulmassa, ja vedä kuva haluamaasi kokoon:

Koon muuttaminen sisältökentässä ei muuta itse kuvatiedoston kokoa – kuva vain esitetään eri koossa.

Kuvien muut mukauttamisvalinnat

Saat näkyviin lisää kuvanmukauttamisvalintoja painamalla kuvan keskellä näkyvää Muokkaa-painiketta:

Voit määrittää kuville seuraavat asetukset:

  • Otsikko: Teksti joka toimii esimerkiksi oletusteemassa kuvan alt-tekstinä.
  • Kuvateksti: Teksti joka näkyy esimerkiksi oletusteemassa kuvan alapuolella selitteenä.
  • Asemointi: Kuvan tasaus vasemmalle, oikealle tai keskelle suhteessa tekstiin.
  • Linkki: URL-osoite, johon käyttäjä siirtyy kuvaa painettuaan.
  • Avaa linkki uudessa välilehdessä: Asettaa linkin aukeamaan selaimen uuteen välilehteen.

    Anna verkkokaupan sisäiset linkit muodossa /product/5 ja ulkoiset linkit muodossa https://www.example.com.

Linkkien lisääminen tekstiin

Voit luoda sisältötekstin sekaan linkkejä sekä verkkokaupan sisäisiin että ulkoisiin lähteisiin.

Tekstilinkin luominen

Lisää tekstilinkki seuraavasti:

  1. Valitse teksti, jota haluat käyttää linkkitekstinä.
  2. Paina editorin työkalupalkissa linkkipainiketta .
  3. Valitse Lisää linkki.
  4. Jos haluat luoda linkin verkkokaupan sisäiselle sivulle, käytä Valitse sivu -kohdassa olevaa hakukenttää:

    Kirjoita hakuun vähintään kolme merkkiä, jolloin haku käynnistyy. Haku kohdistuu tuotteisiin, tuoteryhmiin ja -merkkeihin sekä sisältösivuihin.

    Valitse haluamasi sivu hakutuloslistalta.

    Verkkokaupan sisäiset linkit voit syöttää myös URL-kenttään muodossa /product/23 (numeron kohdalle lisätään kohteen ID-numero).

  5. Jos taas haluat luoda linkin ulkoiseen kohteeseen, anna linkin URL-osoite.
  6. Valitse halutessasi, avataanko linkki uudella välilehdellä.
  7. Paina Lisää-painiketta.

Linkin lisääminen kuvaan

Jos haluat luoda sisällön joukossa olevasta kuvasta linkin, toimi seuraavasti:

  1. Lisää ensin kuva sisällön joukkoon.
  2. Paina valitsemasi kuvan Muokkaa-painiketta.
  3. Määritä kuvalinkin asetukset:
    • Otsikko: Teksti joka toimii esimerkiksi oletusteemassa kuvan alt-tekstinä.
    • Kuvateksti: Teksti joka näkyy esimerkiksi oletusteemassa kuvan alapuolella selitteenä.
    • Asemointi: Kuvan tasaus vasemmalle, oikealle tai keskelle suhteessa tekstiin.
    • Linkki: URL-osoite, johon käyttäjä siirtyy kuvaa painettuaan.
    • Avaa linkki uudessa välilehdessä: Asettaa linkin aukeamaan selaimen uuteen välilehteen.

      Anna verkkokaupan sisäiset linkit muodossa /product/5 ja ulkoiset linkit muodossa https://www.example.com.

  4. Tallenna kuvalinkin asetukset.

Videoiden upottaminen editoriin

MyCashflow'n tekstieditoriin on mahdollista lisätä videoita upottamalla ne ulkoisista palveluista (esim. Vimeo tai YouTube).

Useimmissa videotoistopalveluissa on jako- tai upotustoiminto, josta saat katkelman HTML-koodia, jonka liittämällä sisältöön MyCashflow'n tekstieditorissa saat videon näkymään sivullasi.

Katso lisätietoja palvelujen omista käyttöohjeista:

Esimerkki: Videon upottaminen YouTubesta

  1. Etsi haluamasi video YouTubesta, ja avaa videon tiedoissa Jaa-valikko:
  2. Avaa Jaa-valikossa Upota-vaihtoehto, ja kopioi tekstikentässä näkyvä upotuskoodi kokonaisuudessaan.
  3. Avaa MyCashflow'n hallinnassa haluamasi sisällön muokkauslomake, ja ota sisältökentässä käyttöön uusi tekstieditori, jos et ole vielä tehnyt niin.
  4. Vaihda näkyviin sisällön HTML-merkkaus painamalla editorin -painiketta.
  5. Liitä kopioimasi upotuskoodi haluamaasi kohtaan koodissa, ja vaihda takaisin tavalliseen editorinäkymään painamalla uudestaan -painiketta.

    Upotetun videon pitäisi nyt näkyä sisältökentässä.

  6. Tallenna muokkaamasi sisältö, ja katso että video näyttää hyvältä sivulla.

Äänitiedostojen upottaminen editoriin

MyCashflow'n tekstieditoriin on mahdollista upottaa äänitiedostoja ulkoisista palveluista (esim. SoundCloud).

Esimerkki: Äänitiedoston upottaminen SoundCloudista

  1. Etsi ja avaa haluamasi äänitiedosto SoundCloudista.
  2. Paina äänitiedoston työkaluissa Share-painiketta.

    Jakoikkuna aukeaa.

  3. Avaa jakoikkunassa Embed-välilehti.
  4. Kopioi Code -otsikon alla olevasta tekstikentästä upotuskoodi.
  5. Siirry sivulle, jolle haluat upottaa äänitiedoston, ja avaa tekstieditorissa HTML-koodinäkymä painamalla -painiketta työkalupalkissa.

    Jos et ole vielä ottanut uutta tekstieditoria käyttöön, tee se nyt.

  6. Liitä upotuskoodi lähdekoodissa siihen kohtaan, jossa haluat sen näkyvän tekstin joukossa.
  7. Tallenna muutokset, ja tarkasta että upotettu soitin näkyy oikein sivulla.

Vapaamuotoisen HTML-koodin käyttö editorissa

Jos sinulla on kokemusta HTML-merkkauksen muokkaamisesta, voit käsitellä sisällön merkkausta ilman editorin työkaluja.

Saat sisällön HTML-koodin näkyviin painamalla editorin -painiketta editorin työkalupalkissa.

Kun olet tehnyt kaikki tarvittavat muutokset HTML-koodiin, paina uudestaan -painiketta vaihtaaksesi takaisin graafiseen näkymään. Tekemäsi muutokset päivittyvät editorissa välittömästi.

Kaikkia HTML-tageja ei näytetä hallintatyökalun sisällön esikatselussa, mutta verkkokaupan julkisella puolella ne ovat kuitenkin käytössä.

Jotkut HTML-tagit poistetaan sisällöstä automaattisesti (esim. <script>).

Interface-merkkauksen käyttäminen tekstieditorissa

Voit käyttää MyCashflow'n Interface-tageja suoraan tekstin seassa. Pidemmät Interface-merkkaukset kannattaa lisätä tekstikenttiin Interface-merkkaus-toiminnon avulla.

Lue lisää MyCashflow'n Interface-tagien käyttämisestä.

Näin lisäät tekstiin Interface-tageja, joiden attribuutteja ei tarvitse muokata:

  1. Avaa haluamasi sivu muokattavaksi.
  2. Syötä haluamasi Interface-tagit tekstin joukkoon.

    Tässä esimerkissä lisätään tekstiin verkkokaupan yhteystietoja. Voit lisätä tageja tekstikappaleiden sekaan tai omina kappaleinaan.

    MyCashflow'n teemaoppaasta löydät kattavan listan saatavilla olevista Interface-tageista.

  3. Tallenna sivu.
  4. Tarkista verkkokaupassa, että lisäämäsi Interface-tagit tulostavat oikean sisällön tekstin joukkoon.

Tässä kappaleessa käsiteltiin Interface-tageja, joiden attribuutteja ei tarvitse muokata. Seuraavassa kappaleessa käsitellään oman HTML-merkkauksen lisääminen tageihin.

Merkkausta sisältävien attribuuttien käyttäminen tekstieditorissa

Joissakin Interface-tagien attribuuteissa on käytettävä omaa HTML-merkkausta, jolloin Interface-tagit kannattaa lisätä tekstiin editorin Interface-merkkaus -työkalun avulla:

  1. Avaa haluamasi sivu muokattavaksi ja siirry haluamaasi kohtaan sivun sisältökentässä.
  2. Paina Interface-merkkaus-kuvaketta tekstieditorin työkalurivillä.
  3. Syötä haluamasi merkkaus Interface-merkkaus -ikkunaan.

    Tässä esimerkissä lisätään tekstiin lista tuotteen yhteensopivista tuotteista.

    before-attribuutilla määritetään tuotelistalle otsikko.

    helper-attribuutissa käytetään verkkokaupan teeman tiedostoa themes/shop/THEME/helpers/list-product.html

    MyCashflow'n teemaoppaasta löydät kattavan listan saatavilla olevista Interface-tageista.

  4. Paina Lisää-painiketta.
  5. Tallenna sivu.
  6. Tarkista verkkokaupassa, että lisäämäsi Interface-tagit tulostavat oikean sisällön tekstin joukkoon.

Nyt syöttämäsi Interface-merkkauksen tuottama sisältö näytetään muokkamallasi sivulla.

Voit milloin tahansa muokata Interface-merkkausta painamalla Interface-merkkaus -painiketta editorissa kursorin ollessa merkkauksen kohdalla.