Share
I den første delen av denne korte serien dekket vi grunnleggende om hvilke landingssider som er. I denne delen går vi gjennom byggeprosessen av en innstigningsside.
Design som ble bygget først i Photoshop, bør konverteres til en piksel perfekt destinasjonsside på Instapage-plattformen. Alle sidene er strukturert ved å følge 960-nettverket og ved hjelp av horisontale sidestykker som er forklart nedenfor.
Instapage tilbyr sine brukere en rekke maler å velge mellom. Mens vi fokuserer på bransjespesifikke maler for våre generelle brukere, vil du starte med et tomt lerret.
Du trenger ikke å bruke noe annet program for å fullføre installasjonsmalen, men du kan konvertere eller importere dine andre tidligere utformede temaer hvis du ønsker det. CSS og tilpasset JavaScript støttes også.
Med Instapage kan du begynne å legge til elementene for destinasjonssiden ved å klikke på LEGG TIL NY alternativet på hovedverktøylinjen og deretter velge hvilket element du vil legge til på siden din.
Vanligvis er det å legge til ett element på en klart definert sideseksjon. Du har imidlertid full mulighet til å strukturere siden din som du vil. Du kan også justere høyden på sideseksjonene i henhold til elementene du har lagt til.
I applikasjonen er det et X / Y-verktøytips som vises når du flytter et element. Dette vil hjelpe hvis du er vant til å designe via denne metoden, eller hvis du konverterer fra et annet tema. Koordinatene bestemmes av at midten av elementet flyttes i forhold til hvor langt det er fra øverst til venstre på hovedsiden kolonnen.
Hjemmesiden kolonnen har en definert standard sidebredde på 960px.
Du kan legge til følgende elementer i den tilpassede landingssiden din:
Alle disse blir lagt til ved å klikke på hvilket element du vil legge til og deretter plassere / redigere på siden din. Vi diskuterer å legge til elementer i detalj nedenfor.
Sidestykker brukes til å skille forskjellige innholdsområder på destinasjonssiden din. Seksjonen spenner alltid over hele bredden på siden og kan ikke resizes horisontalt. Sidestykker kan flyttes vertikalt hvor som helst på siden (vist i videoen)
Du kan gruppere innhold med begge seksjoner og bokser på to måter. Hvis du allerede har innhold på siden din, kan du legge til en boks (ved å velge den fra formelementet) og deretter dra innholdet i den boksen. Du kan også lage boksen først og deretter dra og slippe objekter direkte inn i boksen som vil hekke dem.
Når objektene er nestet, kan du nå flytte dem om siden din som et enkelt objekt. Velg boksen og fortsett derfra.
Boksen form brukes vanligvis til å lage en standard firkant eller rektangel som du kan bruke til å markere skjemaer, bilder, tekst og mer. Det bør ikke spanne hele bredden på siden.
Når du redigerer sidestykker eller boksformer, får du følgende egenskaper:
Du kan legge til overskrift og avsnitt tekst ved å klikke på de respektive alternativene fra verktøylinjen. Når du klikker på avsnittet eller overskriftsknappen, får du se et forhåndsinnstilt avsnitt vises på siden din, du kan deretter redigere dette avsnittet tilsvarende.
Tekstredigereren lar deg endre farge, skriftstørrelse, justering og du kan også legge til nummererte lister eller opprette en lenke.
Etter å ha klikket for å legge til et nytt bildeelement, får du muligheten til å velge en eksisterende fra en mappe eller for å laste opp en ny. Eventuelle bilder du laster opp, blir lagret på våre servere, og du kan bruke dem på et senere tidspunkt uten å laste opp igjen.
Du kan erstatte bilder til enhver tid ved å velge bildet> klikke på Rediger> velg erstatning.
Bruk bilder til å forstørre produktet eller tjenesten din (bilder er verdt tusen ord), men du får ikke igjen for å bli borte. For mye visuell vil distrahere brukere fra konverteringsmålet.
Hvis du vil vite mer om hvordan du bruker bilder på en destinasjonsside, kan bedre konvertering ta en titt på Bruk bilder på destinasjonssiden din for å øke konverteringene.
Du kan laste opp en video til destinasjonssiden din ved å velge videoalternativet og koble til din valgte YouTube- eller Vimeo-video. Du kan endre størrelse og plassere videoen i henhold til dine behov. Deretter velger du om du vil at videoen skal autoplay eller skjule fremdriftslinjen.
Å velge LEGG TIL NY fra hovedverktøylinjen og klikk deretter FORMER. Dette vil fylle ut et skjema på destinasjonssiden din. Du kan dra og slippe og endre størrelsen på skjemaet ditt for å dekke dine spesifikke designbehov, og du kan tilpasse knappestil, skjemaformat, farge, skrift ved å klikke på REDIGERE knappen etter at du har klikket på skjemaet.
Du kan også angi forhåndsdefinerte felt eller lage dine egne tilpassede rullegardiner. Skjemaer kan knyttes til våre integrerte e-posttjenester som Mailchimp eller Aweber, eller kan fungere alene. Vi tilbyr også et viderekoblingsalternativ (både integrasjoner og formendirektiver skal ikke brukes på siden din).
For å legge til en knapp på siden klikker du LEGG TIL NY fra hovedverktøylinjen. Dette vil fylle ut en knapp på destinasjonssiden din. Hvis du klikker på knappen, kan du endre størrelsen, endre farge eller skrift og dra og slipp funksjonen hvor du helst liker.
Etter å ha klikket på knappen ovenfor, vil du se et linkikon. Dette er en link hendelsen trekk. Dette åpner en lenkeadministrator som lar deg legge til en utgående kobling til knappen din, en pop-up (Lightbox) til knappen din, en filnedlasting eller link til en annen destinasjonssider.
Mange destinasjonssider bruker en to-trinns registreringsprosess hvor en besøkende klikker på en knapp som åpner en popup-oppgave. Inne i pop-up er hovedgenereringsformen. På grunn av dette og fordi popup-vinduer kan være nyttige for å avsløre mer informasjon, har vi gjort det veldig enkelt å legge til popup-vinduer til knapper, bilder og tekstkoblinger.
Bare klikk på en av disse tre elementene> klikk på koblingsknappen> og velg deretter popup-alternativet.
Du kan endre størrelsen på popup-boksen som du ville noe annet element. Enhver type innhold kan legges inn i popup-vinduet.
Siden Instapage tilbyr komplett dra og slipp-tilpasning, støtter vi ikke for øyeblikket automatisk responsiv design. På grunn av dette må du rekonstruere skrivebordssiden din i mobilvisningen basert på den mindre skjermstørrelsen og hva som gir mening i en mobil kontekst.
Du kan flytte elementer mellom skrivebordet og mobilversjonen ved å kopiere og lime inn.
Mac-brukere:
PC-brukere:
For å se det endelige oppsettet til din egen Instagram-mal, klikk på Forhåndsvisning alternativet og gå gjennom malen din før du klikker publisere.
Merk: Publisering av siden din gjør at du kan gi en forhåndsvisningslink i malmarkeder.
Alle destinasjonssidemaler må være tilpassbare. Instapage-brukere bør kunne enkelt bytte ut hvilket element de ønsker.
For å sikre at maler ikke mister sin kvalitet når sluttbrukeren gjør endringer, er det viktig at siden din godkjennes av ThemeForest. Vær oppmerksom på følgende retningslinjer:
For å kunne bruke, dele eller selge den ferdige malen, må du laste den ned. For å laste ned, klikk på flere valg knappen funnet på dashbordet og velg Last ned side.
Filen vil ha en ".instapage" -utvidelse. Når du har lastet ned filen, kan du omdøpe det etter behov, men la forlengelsen ".instapage" være intakt.
Vil du pakke flere oppsett av samme mal? Vennligst kontroller at du bruker sidevarianter til å pakke inn flere layouter sammen.
I stedet lager hver layout som en egen side og laster ned hvert layout separat. Dette sikrer at du har en funksjonell forhåndsvisningslink for hvert layout, og det vil redusere forvirring fra nedlasteren, da varianter brukes spesielt for A / B-testing.
Forhåpentligvis har dette gitt deg en grundig introduksjon til Instapage og authoring Instapage maler for salg på markedsplasser som ThemeForest. Det er nok mer å lære, men hvis du har noen spørsmål, vær så snill å spørre deg i kommentarene.
Også sjekk ut Envatos Most Wanted Instapage-konkurranse som skjer akkurat nå!
Accentsconagua