Ten poradnik przeprowadzi Cię przez „Jak dostosować górnej części strony w Divi.” Domyślnie Divi daje nam możliwość umieścić numer telefonu, e-mail i social media ikony w górnym nagłówku powyżej głównego menu. Ale nie byłoby miło, aby móc umieścić więcej linków tam z ikon niestandardowych i więcej?
Here’s the CSS I used:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
|
/*----------Customized Top Header----------*/ #top-header .et-social-icons { display : inline- block ; float : right ; } .top-phone { width : 124px !important ; } .top-phone a { color : white !important ; font-size : 16px !important ; } .top-phone:before { font-family : 'ETmodules' ; content : "\e090" ; font-size : 16px ; float : left ; } .top-quote { width : 152px !important ; } .top-quote a { color : white !important ; font-size : 16px !important ; } .top-quote:before { font-family : 'ETmodules' ; content : "\e07e" ; font-size : 16px ; float : left ; } .top-login { width : 115px !important ; } .top-login a { color : white !important ; font-size : 16px !important ; } .top-login:before { font-family : 'ETmodules' ; content : "\e070" ; font-size : 16px ; float : left ; } #top-header .et-social- icon a { font-size : 14px ; background : white ; color : #3e007f ; padding : 5px ; border-radius: 25px ; margin-top : -3px ; height : 24px ; width : 24px ; } #top-header .et-social-icons li { margin-top : -2px ; margin-left : 5px ; } #et-secondary-nav, #et-secondary-nav li { display : inline- block ; margin-right : 15px ; } @media only screen and ( max-width : 980px ) { .top-phone { width : 100% !important ; } .top-quote { width : 100% !important ; } .top-login { width : 100% !important ; } .top-phone:before { color : white ; margin-top : 10px ; margin-right : 12px ; } .top-quote:before { color : white ; margin-top : 10px ; margin-right : 12px ; } .top-login:before { color : white ; margin-top : 10px ; margin-right : 12px ; } } |
Links mentioned in video: