Flatesomt tema
Flatsome er et kraftig WordPress-tema designet for e-handelsnettsteder og kommer med WooCommerce-integrasjon.
Det er et av de mest populære WooCommerce-temaene på ThemeForest. På tidspunktet for skriving av denne opplæringen var det over 174.500 salg og en fantastisk 4,8-stjerners rangering fra over 6600+ anmeldelser.
Flatsome er først og fremst designet med tanke på nybegynnere og ikke-teknologikyndige brukere.
Dette er flott for folk som ønsker å komme i gang med en nettbedrift, men som ikke vet hvordan de skal kode eller har budsjett til å ansette en profesjonell koder. Med Flatsome vil du kunne lage et profesjonelt utseende nettsted ved hjelp av enkle og intuitive verktøy.
Nå kommer Flatsome fullpakket med tonnevis av fantastiske funksjoner og funksjoner. For å vise frem hva som er tilgjengelig og hvordan det fungerer, har vi en rask veiledning som viser deg hvordan du lager en WooCommerce-produktside ved hjelp av Flatsome.
Så, uten videre, la oss komme i gang:
Innholdsfortegnelse:
- Flatesomt tema
- Forskjellen mellom Flatsome, WooCommerce og WordPress
- Lag en WooCommerce-produktside ved å bruke Flatsome-temaet
- Trinn 1: Velg en layout for produktsiden
- (Valgfritt) Trinn 2: Opprett produktside manuelt
- Trinn 3: Tilpass produktsiden
- Innpakning
Forskjellen mellom Flatsome, WooCommerce og WordPress
Ettersom vi ønsker våre nye lesere velkommen, må vi legge inn noe nødvendig informasjon for å sikre at alle våre lesere er på samme side. Her vil vi diskutere forskjellen i alle tre terminologier som vi skal bruke gjennom denne artikkelen.
La oss starte med WordPress. Det er en plattform der du installerer forskjellige temaer og plugin -er for å lage nettstedet ditt. Det er tusenvis av plugin -er og temaer tilgjengelig for å utføre andre oppgaver i henhold til dine krav.
WooCommerce er en plugin vi installerer på WordPress som lar deg legge til forskjellige funksjoner på nettsiden vår. Med denne plugin -installasjonen kan vi lage vår nettside og nettbutikk med tilleggsfunksjoner som handlekurv, betalingsbehandling, produktadministrasjon, etc.
Til slutt, men absolutt, er et av de mest kritiske elementene utsiktene til nettstedet vårt. Flatsome er et tema som lar oss tilpasse nettstedets perspektiv i henhold til våre ønsker. Hvis firmalogoen din for eksempel er oransje, vil du gjerne reflektere over fargen på nettstedet ditt. Det er det Flatsome kan gi deg.
Lag en WooCommerce-produktside ved å bruke Flatsome-temaet
Siden alle våre lesere har kunnskap om WordPress, WoCommerce og Flatsome, er det på tide for oss å gå videre til produktsiden vårs tilpasning med den fantastiske UX-byggeren som følger med Flatsome-temaet. Det er en dra og slipp-funksjon som gjør livet til designeren ekstremt enkelt.
Nesten alle har handlet på nett, sannsynligvis på grunn av de utfordrende tidene vi har møtt de siste månedene. Å bli hjemme var den tryggeste løsningen for oss alle. Det er grunnen til at alle våre lesere er enige om at en nettbutikk er mye mer komplisert sammenlignet med en standard nettside.
Men ved hjelp av WooCommerce og Flatsome har denne oppgaven blitt ekstremt enkel. Du må sette deg ned og planlegge hvordan nettstedet ditt skal se ut, og det er det. WooCommerce vil være der for å hjelpe deg med byggealternativene. Du kan lage en fullverdig fungerende nettbutikk på bare noen få minutter med dra og slipp.
Med WooCommerce og Flatsome vil du kunne gi ideene dine om å ha en nettbutikk et helt nytt liv. Nettsiden din må ha et moderne og vakkert utseende slik at den kan tiltrekke seg kunder. Derfor Flatsome den beste løsningen for alle dine problemer, så last den ned herfra og la oss komme i gang.
Flatsome har noen fantastiske funksjoner, men en av delene er at den har blitt et toppvalg for mer enn 300 000 brukere. Et ultimat verktøy hjelper deg med å lage noen enorme responsive nettsteder uten å måtte kode en eneste linje. Dessuten gjør dens evne til å lage noen svært kreative og unike nettbutikker den enda mer verdig.
Så uten å kaste bort mer tid, la oss gå videre til opplæringen. Denne opplæringen tar deg gjennom hele prosessen med å designe produktsiden. Bildene vil hjelpe deg å få et bedre inntrykk av hvordan oppgaven vil gå gjennom prosessen.
Trinn 1: Velg en layout for produktsiden
Først vil vi starte med å velge en layout for produktsiden. Dette utvalget vil lage en basisside for nettbutikken vår, som vi vil tilpasse etter våre ønsker senere. Denne trinnvise guiden vil lede deg gjennom prosessen med å tilpasse siden.
For dette amp fortsetter vi med Classic Shop-alternativet. Det er imidlertid ingen begrensning på deg. Tilpasningsprosessen vil være lik for hver layout du velger. Den eneste forskjellen ville være at den grunnleggende strukturen på siden vil være forskjellig fra den andre.
Vi gikk videre til produkttilpasningen, og ga den navnet venstre sidefelt i full høyde.
Det er to tilgjengelige alternativer for å tilpasse produktsiden. Den første skal gjøres med UX-byggeren, mens den andre er å bygge siden manuelt. Hvis du velger det andre alternativet, må du gå til den offisielle dokumentasjonen og finne kortkoder. Hvis du er nybegynner og dette er din første erfaring med å bygge en nettbutikk, anbefaler jeg å gå for dette første alternativet.
(Valgfritt) Trinn 2: Opprett produktside manuelt
Her er et skjermbilde av den offisielle dokumentasjonssiden til Flatsome. Du kan skrive inn ordet kortkoder og søke etter dem.
Når du trykker på søk, vil det vises en liste over kortkoder på skjermen. Du kan velge kortkodene som er viktige for produktsiden. Å bruke kortkoder krever mindre innsats, men det er viktig at du har litt praktisk erfaring med WordPress og bruk av kortkoder.
Her er listen over kortkoder som du kan bruke på nettsiden for å lage sider.
I dette amp vil vi tilpasse oppsettet til venstre sidefelt i full høyde; Derfor vil vi kopiere koden for designet. Følgende er et bilde av det påførte, men du kan enkelt kopiere det fra strukturen.
Start med å lage en blokk med en tittel. Hvis du vil utvikle head, må du klikke på "Legg til ny" tilgjengelig under UX-blokker plassert i dashbordet ditt.
Du kan navngi blokken etter dine ønsker. Her i dette amp har vi navngitt foreningen som "Full høyde venstre sidefeltoppsett." Deretter kan du se kortkodene inne i blokkredigeringsprogrammet. Når du har fullført kopieringen av de ønskede kortkodene, kan du trykke på publiser.
Vi vil være på nivå etter dette ene lille trinnet der vi kan tilpasse siden vår etter våre ønsker. Naviger nå til produktsidetemaalternativet og trykk på ikonet for tilpasset layout.
Når du er ferdig, vil du nå kunne opprette blokker fra rullegardinmenyen Custom Product Layout.
Velg blokken vi nettopp opprettet. Vårt hovedmål for å lage den blokken var å lage en produktside ut av den. I følge dette amp er oppsettet på venstre sidefelt i full høyde blokken, mens den ved din ende vil være som du har navngitt.
Når du er ferdig, trykker du bare på Publiser-knappen; den vil lagre innstillingene.
Trinn 3: Tilpass produktsiden
Det er på tide for oss å starte tilpasning. Først vil vi navigere på den eksisterende produktsiden fra grensesnittet som vi satte tidligere i trinnene.
Det er viktig at du velger et bestemt produkt som vi må sette opp. Du bør ha fullstendige detaljer, bilder av arbeidet som vi må tilpasse. På denne måten blir prosessen mer behagelig å visualisere sidedelen du skal lage.
Alternativet UX-bygger er synlig. Bare trykk på knappen for å starte tilpasningen.
Etter at UX-byggeren er åpen, kan du se fra bildet at produktsideelementene er tilgjengelige i venstre sidepanel på produktsiden din.
Venstre sidepanel er blokken som vi opprinnelig opprettet. Vi laget den ved hjelp av kortkodene hentet fra dokumentasjonen.
Du har muligheter for å omorganisere elementene fra venstre sidepanel og endre innstillingene fra elementalternativet. I dette amp vil vi omorganisere prisen som er tilgjengelig i menyen til venstre.
Dessuten lar det deg også omorganisere elementer fra byggherrens forhåndsvisning og sette på tilleggskomponenter på byggmesterens produktside. I denne demoen har produktfanene og det relaterte produktet blitt omorganisert med bare et enkelt dra og slipp.
Med den betydelige dra og slipp-funksjonaliteten er Flatsome klar til å gi deg det du leter etter på nettstedet ditt. Med svært tilpassbare moduler kan du enkelt lage noen fantastiske sider. Dra og slipp-funksjonen gjør livet enda mer behagelig.
Innpakning
Det er viktig å ha en nettvirksomhet i denne moderne tidsalder fordi folk foretrekker å være hjemme for å være trygge. Så begynn å bygge din bedrifts første nettbutikk med Flatsome og trollbind kundene dine med dens unikhet og kreativitet. Dessuten er det ingen søl med kode i innholdsredigereren, bare noen få kortkodelinjer. Flatsome er utvilsomt det beste temaet jeg har vært borti. Så det er ingen grunn til å se seg om etter noe annet tema, bare trykk på nedlastingsknappen og begynn å bygge din tilpassede nettbutikk med en gang.
