Hur man använder Avada Header, Footer och column layout builder

Vår alldeles egna sidbyggare, Avada Builder, finns nu i två gränssnitt: Avada Builder, som är vår back-end wireframe-sidbyggare, och Avada Live, som är vår front-end-byggare, som nyligen introducerades med Avada 6.0 .

Med vårt enkla system med behållare, kolumner och element gör att båda versionerna av Avada Builder låter dig enkelt utforma vackra sidlayouter för din webbplats. Avada Builder är ett fantastiskt verktyg för både moderna webbdesigners och webbplatsägare, eftersom det ger dem fullständig kontroll över alla aspekter av sidinnehåll och layout. Båda versionerna av Avada Builder genererar också samma kod. De är helt utbytbara, så att du kan få det bästa av två världar med Avada Builder, som för närvarande är tillgängligt.

Layout Builder -sidan är där du hittar alla dina layouter och alla villkorliga layouter som du kanske vill bygga utöver den globala layout som skapats som standard. Här finns också området där du tilldelar layoutavsnitt till dina layouter och anger villkor för att dina villkorliga layouter ska träda i kraft.

Layoutbyggaren kan nås från Avada-instrumentpanelen genom att välja Layouter> Layoutbyggare på rullgardinsmenyn. Ett av de mest okomplicerade sätten att beskriva layouter är att säga att de är behållare som innehåller de fyra layoutavsnitten på en sida - rubriksektionen, sidtitelfältet, innehållssektionen och sidfoten. Du kan lära dig mer om skillnaderna mellan layoutavsnitt och layouter genom att läsa det här dokumentet: Förstå layouter och layoutavsnitt (PDF). Fortsätt läsa för att lära dig mer om de saker du kan göra på den här sidan.

Två delar finns högst upp på sidan Layout Builder. En teknik för att fylla i layoutavsnitten i den globala layouten eller generera villkorliga layouter beskrivs i det första avsnittet (tips: du kan stänga detta med X), och på höger sida av skärmen finns ett område från vilket du kan skapa nya layouter direkt (se nedan). Skriv in ett namn för din nya layout och klicka sedan på Skapa ny layout för att slutföra processen. En tom layout skapas när denna metod används; inga layoutavsnitt eller villkor anges.

När du bygger layouter importeras de automatiskt till Layout Builder -sidan. Du kan byta namn på en layout genom att klicka på knappen Byt namn högst upp på sidan. Du kan också klicka på kugghjulsikonen för att skapa villkor för layouten, och du kan ta bort en layout genom att klicka på fackikonen högst upp på sidan. Du kan också se och tilldela kriterier genom att klicka på botten av alla layouter, förutom den globala layouten.

Inom varje layout kan du se de fyra layoutavsnitt som tilldelats en viss layout, en för var och en av de fyra layouterna. I varje layoutavsnitt ser du en + -ikon, som låter dig tilldela ett layoutavsnitt till det avsnittet i layouten när du flyttar musen över den. Du har möjlighet att tilldela ett befintligt layoutavsnitt till det här avsnittet eller skapa ett helt nytt avsnitt från början.

Använda sektionslayout

Som en del av Avada Layouts kan du nu skapa fullständigt anpassningsbara sidfötter för din webbplats och dra nytta av hela den kreativa förmågan hos Avada Builder för att åstadkomma detta.

En sidfotlayout är ett layoutavsnitt som läggs till i en layout. För ex amp le kräver en anpassad sidfot en sektion för sidfotlayout, som kan läggas till antingen den globala eller anpassade layouten. Vi kommer att titta på att konstruera ett anpassat sidfotlayoutavsnitt i nästa avsnitt, men låt oss först titta på Introduktion till Avada -layouter.

I WordPress -sidofältet eller Avada -instrumentpanelen väljer du Avada> Layouter. Avadas layouter och layoutavsnitt skapas och hanteras här. Som visas nedan är den globala layouten initialt tom utan några associerade layoutavsnitt.

Anpassa en layout

Det här avsnittet kan läggas till i den globala layouten eller en villkorlig layout, som bara visas på vissa anpassade inläggstyper eller enstaka sidor. Den globala layouten är redan närvarande, men vi måste först utveckla en villkorlig layout.

Lägg till ett namn på sidan Layout och klicka på Skapa ny layout, som visas nedan.

Skapa ett sidfotlayoutavsnitt om du vill lägga till det i en befintlig layout eller den globala layouten.

På skärmen Layout -sektionsbyggare väljer du typen av layoutavsnitt, anger ett namn (i denna ex amp le, sidfot, eventuellt global sidfot) och klickar på Skapa ny layoutavsnitt, som visas nedan.

Följande bild visar hur du skapar ett layoutavsnitt direkt från layouten. Webbplatsens layoutavsnitt måste läggas till i en layout. Inledningsvis finns det helt enkelt en global layout. Så, för att skapa en global anpassad sidfot, lägg till den i den här layouten. Anpassat sidfotlayoutavsnitt och lägg sedan till villkor i avsnittet Anpassad sidfotlayout för att få layouten att visas enligt kriterierna.

Inget fel med det, men det är viktigt att tänka på situationen. Om layouten för närvarande är aktiv (dvs. har villkor eller är den globala layouten) kommer alla nya layoutavsnitt att vara aktiva omedelbart och tomma. Det är mer meningsfullt att lägga till en anpassad sidfot i en global layout via sidan Layout Section Builder först och sedan lägga till den i den globala layouten.

Alternativt kan vi lägga till en sidfots-, sidhuvud- eller kolumnlayoutavsnitt till en villkorlig layout och sedan skapa den. Villkor används inte förrän villkor läggs till. Som illustreras nedan kan vi ändra sektionen sidfotlayout genom att hålla muspekaren över den och klicka på redigeringsikonen.

Lägga till sidfotlayoutavsnitt till villkorlig layout

Anpassad layoutredigering

Standard WordPress Editor visas när du redigerar ett nytt layoutavsnitt; du kan använda Avada Builder eller Avada Live härifrån. Anpassade layoutavsnitt skapas här. Mer information finns i Skapa layoutavsnittsinnehåll, men kort sagt kan du bygga allt här.

Din anpassade sidfot kan innehålla allt du kan konstruera i Avada Builder. Du kan ha många kolumner, foton, etc .; Detta möjliggör enorm flexibilitet. Layoutavsnittet är där sidfotsmaterialet visas. Materialet kommer från Builder, och din kreativitet är den enda begränsningen.

Se den ursprungliga sidfoten som byggdes för taxidemonstrationen nedan; Detta gjordes genom att ändra temalternativen och sidfots -widgets.

Taxi Demo> Basic sidfot”src =” https://lh3.googleusercontent.com/_xzRCQdf_jBPoJv6eaW9Wx3rdXORc7Ni1945ud13b9kALKA4WdmZpeSSCTnLx-4hcwPKXGF1dl3E0qragaIr_eJ6AiBxO4AMKlY2tuxFbek-S0Z1PY3oQTE2UmjI4QzZydYbWqscpkwNbIpjTQ=s0 "> Titta på Avada Layouts Custom Global Footer.

Skrivbordsversionen av denna anpassade rubrik visas här, men för att korrekt förstå omfattningen av denna anpassade rubrik måste du besöka den live -webbplats som du kan komma åt här.

Villkorlig layoutdesign

Inga villkor i en global layout. Att lägga till layoutavsnitt till det kommer att användas på varje sida eftersom det är globalt. Om du bara behövde en anpassad sidfot på vissa sidor på din webbplats, som enstaka bloggartiklar, måste du använda en villkorlig layout.

En villkorlig layout kan endast innehålla befintliga layoutavsnitt. Bläddra sedan till fliken Välj sidfot i layouten till Befintlig, där du kan lägga till layoutavsnittet, enligt nedan.

Tilldela ett avsnitt för anpassad layout

Du måste ange villkoren för alla villkorliga layouter. Layouten är aktiv så snart villkoren är specificerade; Därför, om du gör detta innan du upprättar layoutavsnittet, kommer sidorna som matchar villkoren att vara tomma.

Om du vill lägga till ett villkor väljer du Lägg till ett villkor i layoutens nedre meny. En dialogruta visas, som visas nedan. För mer information om villkorliga layouter, se Förstå villkorliga layouter, men för detta ex amp le skulle vi välja Alla inlägg på fliken Inläggsvillkor, enligt nedan.

Lägger till kolumner från Avada Layout Builder

Kolumnelementet, liksom behållarelementet, är en väsentlig strukturell komponent när du utformar en Avada -webbplats.

Att lägga till kolumner är relativt enkelt med Avada Layout Builder.

  • Klicka på knappen ' + Behållare ' för att lägga till en behållare på sidan. När du infogar en behållare blir du ombedd att välja en kolumn- eller kolumnlayout. Du kan skapa en tom behållare, men normalt lägger du till kolumner i detta steg.
  • För att lägga till nya kolumner till en befintlig behållare, håll muspekaren över behållaren och klicka på knappen + Kolumn För att lägga till en ny kolumn, klicka här.
  • I det övre vänstra hörnet av en kolumn klickar du på ikonen "Ändra storlek på kolumn". Den kommer att ha samma storlek som din kolumn nu. Till amp kolumn att visas som '1/4 ' under alternativet Ändra storlek på kolumn.
  • Dra och släpp kolumner för att ordna om dem. Du kan också dra och släppa kolumner till behållare.

En kolumn kan bara placeras inuti ett behållarelement med samma bredd; Detta är vanligtvis den webbplatsbredd du ställer in för webbplatsen. Om du anger webbplatsbredden till 1200px blir en 1/2 kolumn 600px bred. Förinställda kolumnstorlekar visas nedan när de läggs till på en sida.

I Avada kan du ställa in kolumnbredder (och mer) separat på stora, medelstora och små layouter hur du ställer in visningsordning och storlek på kolumner i responsiva layouter förklarar hur du använder denna utmärkta nya funktion med kolumner.

Anpassade bredder finns under Kolumner > Design > Bredd . Som visas nedan kan du ange en anpassad bredd genom att använda ett procenttal. Positioneringen är således obegränsad

Auto är ett nytt breddalternativ. Istället för en fast bredd tar kolumnen platsen för det mest betydande elementet inuti den. Så det fungerar bara i vissa fall. Du kan ändra den överordnade kolumnen till Auto och kolumnen ändras till elementets bredd.

Avada lägger också till responsiva alternativuppsättningar för behållare och kolumner. I baksidan av Builder kan du se de responsiva ikonerna på alla kolumner, som visas på bilden nedan. Front-end Builder visar de responsiva ikonerna på alternativen.

Endast de nya Flex -behållarna visar responsiva alternativuppsättningar. Kolumner i äldre behållare är inte tillgängliga.

Slutsats

Tack vare Avada Layouts är möjligheten att skapa en anpassad sidfot, sidhuvud och lägga till kolumner nu en verklighet och ett nästan obegränsat alternativ. Inte bara kan du utnyttja kraften i Avada Builder för att konstruera praktiskt taget alla sidfötter eller sidhuvuden du kan tänka dig, men du kan också utnyttja kraften i villkorliga layouter för att visa eller dölja dem på vilken sida, kategori, anpassad inläggstyp som helst eller en kombination av kriterier du kan tänka dig att använda Avada Builder.

När det gäller WordPress-layouter är Avada Layouts en spelväxlare i bokstavlig mening. Det faktum att det tillåter sådan designfrihet och flexibilitet i distributionen innebär att processen att skapa sidfot aldrig kommer att vara densamma.

Lämna en kommentar

Din e-postadress kommer inte att publiceras. Obligatoriska fält är markerade med *