WordPress 5 - Galleri
Jes Conradsen
59 steps
7 minutes
3C til galleri sektion
1
Åben List View
2
Marker nederst Row Layout (nederste række ikonbokse) og tryk på 3 lodrette punktummer for at folde menuen ud.
3
Klik "Insert after"
4
Klik her.
5
Tilføj en Row Layout.
6
Uden kolonner.
7
Klik her.
8
Vælg "Full width"
9
Klik her.
10
Vælg "Use Theme Content Inner Width?".
Overskrift
11
Nu skal vi tilføje indhold, klik her.
12
Indsæt Advanced Text block.
13
Giv H2 overskriften teksten "Chocolate - a feast for the eyes [[enter]]"
Indsæt galleri
14
Klik her.
15
Klik i søgefeltet.
16
Skriv 'advanced' og indsæt en Advanced Gallery block.
17
Klik "Select Images"
18
Klik "Upload files"
19
Klik "Select Files" og vælg billeder til galleriet fra din computer.
20
Når billeder til galleriet af uploadet ser det sådan her ud.
21
Klik "Create a new gallery"
22
Sæt evt. en 'caption' på, ellers træk i billederne for at få den rækkefølge du ønsker.
23
Klik "Insert gallery"
24
Du må selv vælge, men jeg kan gode lidt Carousel galleriet :)
25
Klik "Link Settings"
26
Vælg 'Link til media file' i dropdown.
Husk Lightbox (billedfremviser)
Tip! Før din Ligthbox (billedfremviser) kommer til at virke skal du slå den til her: Husk Appearance->Customizer->General->Performance->Enable Lightbox
27
Vælg 'Lightbox' i Link trigger dropdown.
28
Gem ved at klikke på "Update"
VALGFRIT - Smuksering Overskrift
29
Klik på "Chocolate - a feast for the eyes" overskriften.
30
Sæt font size til 60px.
31
Klik her.
32
Sæt farven til rød.
33
Klik "Text Shadow Settings"
34
Slå tekst skygge til.
35
Klik her.
36
Vælg brun som skyggens farve.
VALGFRIT - BAGGRUNDSGRADIENT
37
Klik og marker "Row Layout" for galleriet.
38
Fold "Background Overlay Settings" ud.
39
Klik på "Gradient"
40
Sæt "Overlay Opacity" til 100%.
41
Vælg første farve til gradienten og sæt den til mørkeste af de tre baggrundsfarver.
42
Denne farve.
43
Klik her.
44
Sæt anden farve i gradienten til brun.
VALGFRIT - Divider / overgang
45
Klik på "Dividers"
46
Klik her.
47
Vælg en cool overgang til brug nederst.
VALGFRIT - White space
48
Vi vil give galleriet lidt mere luft i top og bund. Fold "Padding/Margin" ud.
49
Klik på "Top" felter og skriv 125.
50
Klik på "Bottom" feltet og sæt det til 150 px.
51
Klik på det nederste "Location" felt (for den brune farve). Juster den brune farve lidt højere op for en bedre effekt.
VALGFRIT - Indsæt spacer / divider
52
Klik her imellem overskrift og galleri.
53
Søg efter 'Divider' og indsæt en 'Spacer/Divider' block.
54
Spacer / Divider block.
55
Vælg farve for Divider.
56
Sæt den til rød.
57
Klik på "Update".
58
Klik på "View Page" og inspicer 👀
59
Tillykke! Du er nu LEVEL 5 HACKERMAN! 🤘
WordPress 5 - Galleri
Jes Conradsen
59 steps
7 minutes
3C til galleri sektion
1
Åben List View
2
Marker nederst Row Layout (nederste række ikonbokse) og tryk på 3 lodrette punktummer for at folde menuen ud.
3
Klik "Insert after"
4
Klik her.
5
Tilføj en Row Layout.
6
Uden kolonner.
7
Klik her.
8
Vælg "Full width"
9
Klik her.
10
Vælg "Use Theme Content Inner Width?".
Overskrift
11
Nu skal vi tilføje indhold, klik her.
12
Indsæt Advanced Text block.
13
Giv H2 overskriften teksten "Chocolate - a feast for the eyes [[enter]]"
Indsæt galleri
14
Klik her.
15
Klik i søgefeltet.
16
Skriv 'advanced' og indsæt en Advanced Gallery block.
17
Klik "Select Images"
18
Klik "Upload files"
19
Klik "Select Files" og vælg billeder til galleriet fra din computer.
20
Når billeder til galleriet af uploadet ser det sådan her ud.
21
Klik "Create a new gallery"
22
Sæt evt. en 'caption' på, ellers træk i billederne for at få den rækkefølge du ønsker.
23
Klik "Insert gallery"
24
Du må selv vælge, men jeg kan gode lidt Carousel galleriet :)
25
Klik "Link Settings"
26
Vælg 'Link til media file' i dropdown.
Husk Lightbox (billedfremviser)
Tip! Før din Ligthbox (billedfremviser) kommer til at virke skal du slå den til her: Husk Appearance->Customizer->General->Performance->Enable Lightbox
27
Vælg 'Lightbox' i Link trigger dropdown.
28
Gem ved at klikke på "Update"
VALGFRIT - Smuksering Overskrift
29
Klik på "Chocolate - a feast for the eyes" overskriften.
30
Sæt font size til 60px.
31
Klik her.
32
Sæt farven til rød.
33
Klik "Text Shadow Settings"
34
Slå tekst skygge til.
35
Klik her.
36
Vælg brun som skyggens farve.
VALGFRIT - BAGGRUNDSGRADIENT
37
Klik og marker "Row Layout" for galleriet.
38
Fold "Background Overlay Settings" ud.
39
Klik på "Gradient"
40
Sæt "Overlay Opacity" til 100%.
41
Vælg første farve til gradienten og sæt den til mørkeste af de tre baggrundsfarver.
42
Denne farve.
43
Klik her.
44
Sæt anden farve i gradienten til brun.
VALGFRIT - Divider / overgang
45
Klik på "Dividers"
46
Klik her.
47
Vælg en cool overgang til brug nederst.
VALGFRIT - White space
48
Vi vil give galleriet lidt mere luft i top og bund. Fold "Padding/Margin" ud.
49
Klik på "Top" felter og skriv 125.
50
Klik på "Bottom" feltet og sæt det til 150 px.
51
Klik på det nederste "Location" felt (for den brune farve). Juster den brune farve lidt højere op for en bedre effekt.
VALGFRIT - Indsæt spacer / divider
52
Klik her imellem overskrift og galleri.
53
Søg efter 'Divider' og indsæt en 'Spacer/Divider' block.
54
Spacer / Divider block.
55
Vælg farve for Divider.
56
Sæt den til rød.
57
Klik på "Update".
58
Klik på "View Page" og inspicer 👀
59
Tillykke! Du er nu LEVEL 5 HACKERMAN! 🤘
