Kun kehität MyCashflow-teemaa verkkokaupalle tai sen sähköposteille, voit helpottaa työtäsi suuresti synkronoimalla lokaalien teematiedostojen muutokset automaattisesti verkkokaupan tiedostohakemistoon. Tämä onnistuu kaikkein helpoiten käyttämällä mycashflow-sync-työkalua.

Ominaisuudet

mycashflow-sync on Node.js-pohjainen komentorivityökalu, jonka avulla voit synkronoida omalla tietokoneellasi ja verkkokaupan hakemistossa sijaitsevat teematiedostot joko automaattisesti tai manuaalisesti.

Synkronointi on kaksisuuntainen, eli työkalu sekä lähettää että lataa tiedostoja verkkokaupan ja lokaalin ympäristön välillä. Synkronointi tapahtuu tiedoston iän perusteella: uudempi tiedosto ylikirjoittaa aina vanhemman. Ohjelma ei koskaan poista tiedostoja.

Ohjelma voi suorittaa tarvittaessa myös SASS-tiedostojen automaattisen käännöksen CSS-tyyleiksi ennen synkronointia.

Lisäksi mycashflow-sync näyttää kehitettävästä teemasta selainesikatselun (Browsersync) aina synkronoinnin yhteydessä.

Vaatimukset

Voit käyttää työkalua millä tahansa käyttöjärjestelmällä, johon on asennettu Node.js (versio >= 9) ja npm-pakettienhallinta.

Kehitettävän teeman on oltava kehitystilassa, jotta synkronointi toimii. Kehitystila otetaan käyttöön määrittämällä {MinifyCSS}- ja {MinifyJS}-tageille attribuutti mode:'development'.

Verkkokaupassa on oltava käytössä FTP-yhteys, jonka saat asentamalla Web Designer -laajennuksen.

Asennus ja käyttöönotto

Avaa terminaali ja asenna mycashflow-sync seuraavan komennon avulla:

npm install -g mycashflow-sync

Kun työkalu on asennettu, seuraavilla komennoilla voit luoda uuden teemakansion, navigoida sinne ja määrittää teeman synkronointiasetukset:

mkdir teemakansio
cd teemakansio
mycashflow-sync init

Ohjelma kysyy sinulta seuraavat tiedot (pakolliset lihavoitu):

  • FTP-palvelin ja -portti (käytä oletusarvoja)
  • Käyttäjätunnus
  • Salasana

    FTP-käyttäjätunnus ja -salasana ovat saatavilla Web Designer -laajennuksen asetuksissa.

  • Verkkokaupan oletusosoite (esim. https://KAUPANNIMI.mycashflow.fi)
  • Teemakansion sijainti

    Esim. themes/shop/teemakansio tai themes/email/teemakansio

    Jos verkkokaupan tiedostohakemistossa ei vielä ole teemakansiota, luo se ensin ja anna sen nimi synkronoinnin asetuksiin.

  • SASS-lähdekansio suhteessa teeman juurikansioon (esim. styles/scss)

    Jos asetat SASS-kansion, mycashflow-sync kääntää SASS-tiedostot automaattisesti CSS-tyyleiksi aina synkronoinnin yhteydessä.

    Jos et käytä SASS-tyylejä, voit jättää SASS- ja CSS-kohdat tyhjiksi.

  • CSS-tyylikansio (esim. styles)

    mycashflow-sync sijoittaa SASS-tiedostoista käännetyt CSS-tyylit tänne automaattisesti.

Kun olet määrittänyt synkronointiasetukset, voit suorittaa manuaalisen synkronoinnin tai asettaa työkalun seuraamaan muutoksia teeman tiedostoihin.

Voit tarvittaessa muuttaa synkronointiasetuksia muokkaamalla teemakansioon luotua sync.json-asetustiedostoa. Alla esimerkki mahdollisista asetuksista:

{
	"ftp": {
		"host": "ftp.mycashflow.fi",
		"port": 21,
		"user": "<username>",
		"pass": "<password>"
	},
	"sync": {
		"url": "https://KAUPPA.mycashflow.fi",
		"path": "themes/shop/teemakansio",
		"ignore": [
			"./ignored/directory",
			"./*.scss",
			"./*.css.map"
		]
	},
	"sass": {
		/*
		* Syötä tähän tyylitiedostokansioiden sijainti
		* suhteessa teeman juurikansioon
		*/
		"source": "styles/scss",
		"dest": "styles"
	}
}

ignore-taulukossa voit rajata tiedostoja tai tiedostotyyppejä synkronoinnin ulkopuolelle.

Selainesikatselu (Browsersync)

mycashflow-sync näyttää aina synkronoinnin yhteydessä verkkokaupasta Browsersync-työkalun luoman esikatselun verkkoselaimessa.

Jos annoit synkronointiasetuksissa verkkokaupan osoitteen https://-alkuisena, näet todennäköisesti selaimessa varoituksen suojaamattomasta yhteydestä. Ohita varoitus päästäksesi katsomaan esikatselua.

mycashflow-sync-työkalun päivittäminen

Päivitä mycashflow-sync uusimpaan versioon syöttämällä terminaaliin alla oleva komento:

npm update -g mycashflow-sync

Jos haluat päivittää mycashflow-syncin johonkin muuhun kuin uusimpaan versioon, käytä alla olevaa komentoa (korvaa lopun numerosarja haluamallasi versionumerolla):

npm install -g mycashflow-sync@0.5.4

Teematiedostojen synkronointi

Kun olet määrittänyt teemakohtaiset synkronointiasetukset, voit synkronoida lokaalit ja palvelimella sijaitsevat tiedostot seuraavalla komennolla:

mycashflow-sync sync

Tällöin jokaisen tiedoston uusin versio ylikirjoittaa vanhemman ja kaikki uudet tiedostot lisätään, jos ne puuttuvat palvelimelta tai lokaalista kansiosta.

Synkronointi on kaksisuuntainen, eli työkalu lähettää tiedostoja palvelimelle ja lataa niitä lokaaliin ympäristöön.

Tiedoston uudempi versio ylikirjoittaa vanhemman version riippumatta siitä, kumpi sijaitsee lokaalissa hakemistossa ja kumpi verkkokaupan palvelimella.

Synkronointi ei koskaan poista tiedostoja.

Muutosten seuraaminen

Seuraavalla komennolla voit asettaa mycashflow-syncin seuraamaan muutoksia teeman tiedostoihin ja suorittamaan synkronoinnin automaattisesti, kun jokin tiedosto muuttuu:

mycashflow-sync watch

Tällöin sinun ei tarvitse ajaa synkronointikomentoa aina kun teet muutoksia, vaan saat muutokset näkymään teemassa heti kun olet tallentanut tiedoston.

mycashflow-sync seuraa muutoksia sekä lokaaleihin että verkkokaupan tiedostohakemistossa sijaitseviin tiedostoihin.

mycashflow-sync-työkalun käyttäminen sähköpostiteemoissa

Jos haluat käyttää mycashflow-sync-työkalua yhdessä oletussähköpostiteeman kanssa, sinun on suoritettava build ja synkronointi eri pääteikkunoissa.

Rajoitukset

  • mycashflow-sync ei käännä sähköpostiteeman SASS-tiedostoja CSS-kielelle. Sähköpostiteeman build-komento hoitaa SASS-tyylien kääntämisen.
  • Browsersync ei toimi sähköpostiteemojen kehittämisessä (työkalu ei käsittele Interface-tageja, vaan näyttää ne sellaisenaan).

Näin voit käyttää mycashflow-sync -työkalua sähköpostipohjien synkronointiin:

  1. Avaa yhteen pääteikkunaan mycashflow-sync watch
  2. Aja toisessa ikkunassa aina tarvittaessa npm run build

    Aina buildin valmistuttua mycashflow-sync lähettää valmistuneet sivupohjat synkronointiasetuksissa määritettyyn kauppaan.