Vill du skapa unika bakgrundsbilder med hjälp av mönsterblandningsläget Divi ?
De inbyggda bakgrundsmönsterinställningarna för Divi låter dig skapa iögonfallande design och lägga till stil till bakgrundsbilderna på din webbplats. Du kan använda inställningar för blandningsläge för att finjustera hur mönstret blandas med bakgrundsbilden.
I den här handledningen kommer vi att visa dig några exempel på hur du lägger till ett mönsterblandningsläge till bakgrundsbilderna på din sida. Följ dem för att återskapa dessa utseenden på egen hand eller använd dem som inspiration för att skapa dina egna anpassade mönster.
Låt oss börja!
undersökningen
Här är en förhandstitt på vad vi kommer att designa i den här handledningen.
Första layouten
Andra layouten
Tredje layouten
Hur man använder mönsterblandningslägen på dina Divi-bakgrundsbilder
Skapa en ny sida med en fördefinierad layout
Vi börjar med att använda en fördefinierad layout från biblioteket Divi. För denna design kommer vi att använda « Marina landningssida 'Of Marina Layout Pack .
Lägg till en ny sida till din webbplats och ge den en titel och välj sedan alternativet Använd Divi Builder.
Vi kommer att använda en färdig layout från Divi Library för det här exemplet, så välj Bläddra i layouter.
Hitta och välj layout Marina landningssida.
Välj Använd den här layouten för att lägga till layouten på din sida.
Vi är nu redo att designa.
Första layouten
För vår första design lägger vi till ett chevronmönster till den första rubrikbilden. Detta kommer att lägga till ett visst visuellt intresse till rubriken.
Läs också: Divi: Hur man anpassar modulen "Countdown Timer" med en GIF
På grund av blandningsläget vi kommer att tillämpa, kommer mönstret att vara mer subtilt och fortfarande låta bakgrundsbilden vara synlig.
Öppna först avsnittsinställningarna och gå till avsnittet Bakgrund. Klicka på fliken Bakgrundsmönster och välj Lägg till bakgrundsmönster.
Välj sedan mönstertyp. Som du kan se finns det många olika mallar att välja mellan, och de kan alla anpassas ytterligare genom mallinställningarna nedan.
- Mönstertyp: Inverterat fiskben 2
Lade till "Pattern Blend"-läge
Ställ slutligen in blandningsläget för mönstret. Vi kommer att använda blandningsläge Mjukt ljus för detta exempel. Detta blandningsläge gör mönstret mer subtilt så att det inte distraherar från bakgrundsbilden.
- Mönsterblandningsläge: Mjukt ljus
Resultat
Här är den slutliga designen av vårt första exempel.
Här är mobilversionen.
Andra layouten
För den andra layouten kommer vi att använda ett vågmönster som överlagras på bakgrundsbilden och övertoningen, vilket passar bra med sidans nautiska tema.
Navigera först till avsnittet "Hur det fungerar" och öppna avsnittsinställningarna.
Öppna Inställningar Bakgrund, välj sedan fliken Bakgrundsmönsteroch klicka Lägg till bakgrundsmönster.
För denna design kommer vi att använda mönstertyp Waves.
- Mönstertyp: Vågor
Ändra sedan mönsterfärgen till vitt.
- Mönsterfärg: #FFFFFF
Lade till mönsterblandningsläge
Vi kan nu lägga till blandningsläget till vårt mönster. Ställ in mönsterblandningsläget på Täcka över.
Upptäck också: Divi: Hur man anpassar korg- och sökikonerna i modulen "Fullwidth Menu".
Detta blandningsläge gör mörka färger i bakgrundsbilden mörkare och ljusare ljusa färger.
- Mönsterblandningsläge: Överlägg
Resultat
Här är det slutliga resultatet av det andra exemplet som tillämpas på avsnittet "Hur det fungerar".
Och här är mobilversionen.
Tredje layouten
Låt oss börja vår tredje layout.
För den här layouten lägger vi till ogenomskinliga diagonala ränder på bakgrunden av " Ring till handling".
Börja med att öppna avsnittsinställningarna och gå till avsnittet Bakgrund. Klicka på fliken Bakgrundsmönster, välj sedan Lägg till bakgrundsmönster.
Välj mönster Diagonala ränder.
Ställ sedan in mönsterfärgen.
- Mönsterfärg: rgba(255,255,255,0.25)
Vänd mönstret horisontellt med hjälp av Transform Pattern-inställningarna. Detta är ytterligare en parameter som kan hjälpa dig att finjustera mönstret efter eget tycke.
- Mönsteromvandling: Horisontell
Lade till mönsterblandningsläge
Ställ slutligen in blandningsläget för mönstret. För denna design kommer vi att använda blandningsläget Ljusstyrka.
Läs också vår guide om: Divi: Hur man använder "Gradient Builder" för att försköna dina bilder
Detta, i kombination med vår mönsterfärg, lägger till en ljus skärm till bilden samtidigt som det låter bilden synas igenom. Med denna design sticker bilden av båten ut mer från bakgrunden eftersom mönstret ger en distinkt kontrast.
- Mönsterblandningsläge: Ljusstyrka
Resultat
Här är den slutliga designen för detta avsnitt.
Och här är dess mobilversion.
Slutresultat
Låt oss nu ta en titt på helsidesdesignen med mönsterblandningslägen.
Ladda ner DIVI nu!!!
Slutsats
Att lägga till ett mönster kan vara ett bra sätt att lägga till visuellt intresse till din bakgrundsbild, men ibland kan mönstret överväldiga bakgrundsbilden. Som tur är kommer Divi med massor av blandningslägen så att du kan anpassa mönstren så mycket du vill.
Vi hoppas att denna handledning kommer att inspirera dig för dina nästa Divi-projekt. Om du har några funderingar eller förslag, kontakta oss kommentaravsnittet att diskutera det.
Du kan också konsultera våra resurser, om du behöver fler element för att genomföra dina projekt för att skapa webbplatser.
Tveka inte att också konsultera vår guide om WordPress blogg skapande eller den på Divi: det bästa WordPress-temet genom tiderna.
Men under tiden dela den här artikeln på dina olika sociala nätverk.
.
