-
Notifications
You must be signed in to change notification settings - Fork 0
/
ctl-header-nav.php
212 lines (187 loc) · 7.44 KB
/
ctl-header-nav.php
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
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
<?php
///////////////////////////////////////////
/* Menu items setup for parent / child ? */
///////////////////////////////////////////
/* Get top ancestor ID */
function get_top_ancestor_id() {
global $post;
if ($post->post_parent) {
$ancestors = array_reverse(get_post_ancestors($post->ID));
return $ancestors[0];
}
return $post->ID;
}
/* Does page have children? */
function has_children() {
global $post;
$pages = get_pages('child_of=' . $post->ID);
return count($pages);
}
/////////////////////////////////////////
/* Customize Appearance Options header */
/////////////////////////////////////////
function header_nav( $wp_customize ) {
/* Create section */
$wp_customize->add_section('header_nav', array(
'title' => __('Header - Nav', 'qbytesworld_WordPress'),
'priority' => 163,
));
/* ************************************************************ */
/* ************************************************************ */
/* ************************************************************ */
/* ************************************************************ */
// Add font size setting and control
$wp_customize->add_setting( 'header_nav_size', array(
'default' => '16',
'transport' => 'refresh',
) );
$wp_customize->add_control( 'header_nav_size', array(
'section' => 'header_nav',
'settings' => 'header_nav_size',
'label' => __( 'Nav Font Size', 'qbytesworld_WordPress' ),
'description' => __( 'Adjust the font size for title.', 'qbytesworld_WordPress' ),
'type' => 'range',
'priority' => 10,
'input_attrs' => array(
'min' => '3',
'max' => '30',
'step' => '1',
),
) );
/* ************************************************************ */
// Add spacing control
$wp_customize->add_setting( 'header_nav_spacing', array(
'default' => '0',
'transport' => 'refresh',
) );
$wp_customize->add_control( 'header_nav_spacing_control', array(
'section' => 'header_nav',
'settings' => 'header_nav_spacing',
'label' => __( 'Title Spacing', 'qbytesworld_WordPress' ),
'description'=> __( 'Adjust the font space of the title', 'qbytesworld_WordPress' ),
'type' => 'range',
'priority' => 10,
'input_attrs' => array(
'min' => '0',
'max' => '50',
'step' => '1',
),
) );
/* Text color */
$wp_customize->add_setting('header_nav_color', array(
'default' => '#dddddd',
'sanitize_callback' => 'sanitize_hex_color',
'transport' => 'refresh',
));
$wp_customize->add_control( new WP_Customize_Color_Control( $wp_customize, 'header_nav_color_control', array(
'label' => __('Text Color', 'qbytesworld_WordPress'),
'section' => 'header_nav',
'settings' => 'header_nav_color',
'description'=> __( 'Color for Nav Item', 'qbytesworld_WordPress' ),
) ) );
/* Text hover color */
$wp_customize->add_setting('header_nav_color_hover', array(
'default' => '#ffffff',
'sanitize_callback' => 'sanitize_hex_color',
'transport' => 'refresh',
));
$wp_customize->add_control( new WP_Customize_Color_Control( $wp_customize, 'header_nav_color_hover_control', array(
'label' => __('Text Hover Color', 'qbytesworld_WordPress'),
'section' => 'header_nav',
'settings' => 'header_nav_color_hover',
'description'=> __( 'Mouse Nav Item Hover color', 'qbytesworld_WordPress' ),
) ) );
/* background color */
$wp_customize->add_setting('header_nav_background', array(
'default' => '#aa0000',
'sanitize_callback' => 'sanitize_hex_color',
'transport' => 'refresh',
));
$wp_customize->add_control( new WP_Customize_Color_Control( $wp_customize, 'header_nav_background_control', array(
'label' => __('Background Color', 'qbytesworld_WordPress'),
'section' => 'header_nav',
'settings' => 'header_nav_background',
'description'=> __( 'Set the Nav Background color', 'qbytesworld_WordPress' ),
) ) );
/* Button Active color */
$wp_customize->add_setting('header_nav_color_active', array(
'default' => '#dddddd',
'sanitize_callback' => 'sanitize_hex_color',
'transport' => 'refresh',
));
$wp_customize->add_control( new WP_Customize_Color_Control( $wp_customize, 'header_nav_color_active_control', array(
'label' => __('Button Active Color', 'qbytesworld_WordPress'),
'section' => 'header_nav',
'settings' => 'header_nav_color_active',
'description'=> __( 'Active Nav Item color', 'qbytesworld_WordPress' ),
) ) );
/* Button background active color */
$wp_customize->add_setting('header_nav_background_active', array(
'default' => '#aa0000',
'sanitize_callback' => 'sanitize_hex_color',
'transport' => 'refresh',
));
$wp_customize->add_control( new WP_Customize_Color_Control( $wp_customize, 'header_nav_background_active_control', array(
'label' => __('Button Active Background Color', 'qbytesworld_WordPress'),
'section' => 'header_nav',
'settings' => 'header_nav_background_active',
'description'=> __( 'Active Nav Item background color', 'qbytesworld_WordPress' ),
) ) );
}
add_action('customize_register', 'header_nav');
///////////////////////////////////////////////
/* Output Customize CSS to support controls */
///////////////////////////////////////////////
function header_nav_css() { ?>
<style type="text/css">
/* Font Size & Spacing*/
header nav a{
font-size: clamp(3px, 2vw, <?php echo get_theme_mod('header_nav_size') ?>px) !important;
}
header nav li{
padding-left: <?php echo get_theme_mod('header_nav_spacing'); ?>px;
padding-right: <?php echo get_theme_mod('header_nav_spacing'); ?>px;
}
header nav a {
color: <?php echo get_theme_mod('header_nav_color'); ?>;
}
header nav a:hover {
color: <?php echo get_theme_mod('header_nav_color_hover'); ?>;
}
/* apply the effect on hover */
ul#menu-header li.menu-item a:hover::before,
ul#menu-header li.menu-item a:hover::after,
ul#menu-header-links li.menu-item a:hover::before,
ul#menu-header-links li.menu-item a:hover::after {
background-color: <?php echo get_theme_mod('header_nav_color_hover'); ?>;
}
header nav li.current-menu-item:not(current-menu-item ),
header nav li.current-page-ancestor,
header nav li.current_page_item {
background-color: <?php echo get_theme_mod('header_nav_background_active'); ?>;
}
header nav li.current-menu-item a:not(current-menu-item ),
header nav li.current-page-ancestor a,
header nav li.current_page_item a {
color: <?php echo get_theme_mod('header_nav_color_active'); ?>;
}
header div.site-nav {
background-color: <?php echo get_theme_mod('header_nav_background'); ?>;
border-bottom: <?php echo get_theme_mod('header_order_border_size'); ?>px solid <?php echo get_theme_mod('header_order_border_color'); ?> ;
}
header li.menu-item:not(.current-menu-item) a:before,
.hover-10:before {
background-color:<?php echo get_theme_mod('header_nav_color_hover'); ?>;
}
header li.menu-item:not(.current-menu-item) a:after,
.hover-10:after {
background-color: <?php echo get_theme_mod('header_nav_color_hover'); ?>;
}
header li.menu-item:not(.current-menu-item):before,
.hvr-bounce-to-top:before {
background: <?php echo get_theme_mod('header_nav_background_active'); ?>;
}
</style>
<?php }
add_action('wp_head', 'header_nav_css');
?>