1. Main Color
- Theme Options Title: “Main Color”
- Option Name: wp_estate_main_color
- CSS Variable: –wp-estate-main-color-option
- Purpose: Primary theme color used for main accents, buttons, and important UI elements
- Default Value: #004274
SCSS Usage:
.element {
color: var(--wp-estate-main-color-option, var(--wp-estate-main-color));
}
2. Secondary Color
- Theme Options Title: “Second Color”
- Option Name: wp_estate_second_color
- CSS Variable: –wp-estate-second-color-option
- Purpose: Secondary theme color for hovers and complementary elements
- Default Value: #b881fc
SCSS Usage:
.element {
color: var(--wp-estate-second-color-option, var(--wp-estate-second-color));
}
3. Main Grid Content Width
- Theme Options Title: “Main Grid Width in px”
- Option Name: wp_estate_main_grid_content_width
- CSS Variable: –wp-estate-main-grid-content-width-option
- Unit: px
- Purpose: Defines the main content width. Default value is 1200px
- Default Value: 1200
SCSS Usage:
.container {
width: var(--wp-estate-main-grid-content-width-option, var(--wp-estate-main-grid-content-width));
}
4. Content Width
- Theme Options Title: “Content Width (In Percent)”
- Option Name: wp_estate_main_content_width
- CSS Variable: –wp-estate-main-content-width-option
- Unit: %
- Purpose: Width of the content in percent. Sidebar will occupy the rest
- Default Value: 70
SCSS Usage:
.content {
width: var(--wp-estate-main-content-width-option, var(--wp-estate-main-content-width));
}
5. Content Area Internal Padding Top
- Theme Options Title: “Content Area Internal Padding Top”
- Option Name: wp_estate_contentarea_internal_padding_top
- CSS Variable: –wp-estate-contentarea-internal-padding-top-option
- Unit: px
- Purpose: Controls top padding of content area
- Default Value: 30
SCSS Usage:
.content-area {
padding-top: var(--wp-estate-contentarea-internal-padding-top-option, var(--wp-estate-contentarea-internal-padding-top));
}
6. Content Area Internal Padding Left
- Theme Options Title: “Content Area Internal Padding Left”
- Option Name: wp_estate_contentarea_internal_padding_left
- CSS Variable: –wp-estate-contentarea-internal-padding-left-option
- Unit: px
- Purpose: Controls left padding of content area
- Default Value: 30
SCSS Usage:
.content-area {
padding-left: var(--wp-estate-contentarea-internal-padding-left-option, var(--wp-estate-contentarea-internal-padding-left));
}
7. Content Area Internal Padding Bottom
- Theme Options Title: “Content Area Internal Padding Bottom”
- Option Name: wp_estate_contentarea_internal_padding_bottom
- CSS Variable: –wp-estate-contentarea-internal-padding-bottom-option
- Unit: px
- Purpose: Controls bottom padding of content area
- Default Value: 30
SCSS Usage:
.content-area {
padding-bottom: var(--wp-estate-contentarea-internal-padding-bottom-option, var(--wp-estate-contentarea-internal-padding-bottom));
}
8. Content Area Internal Padding Right
- Theme Options Title: “Content Area Internal Padding Right”
- Option Name: wp_estate_contentarea_internal_padding_right
- CSS Variable: –wp-estate-contentarea-internal-padding-right-option
- Unit: px
- Purpose: Controls right padding of content area
- Default Value: 30
SCSS Usage:
.content-area {
padding-right: var(--wp-estate-contentarea-internal-padding-right-option, var(--wp-estate-contentarea-internal-padding-right));
}
9. Content Area Background Color
- Theme Options Title: “Content Area Background Color”
- Option Name: wp_estate_content_area_back_color
- CSS Variable: –wp-estate-content-area-back-color-option
- Purpose: Background color for the main content area
- Default Value: #ffffff
SCSS Usage:
.content-area {
background-color: var(--wp-estate-content-area-back-color-option, var(--wp-estate-content-area-back-color));
}
10. Border Corner Radius
- Theme Options Title: “Border Corner Radius”
- Option Name: wp_estate_border_radius_corner
- CSS Variable: –wp-estate-border-radius-corner-option
- Unit: px
- Purpose: Border radius for elements like property unit, agent unit or blog unit
- Default Value: 4
SCSS Usage:
.rounded-element {
border-radius: var(--wp-estate-border-radius-corner-option, var(--wp-estate-border-radius-corner));
}
11. Box Shadow
- Theme Options Title: “Box Shadow on elements like property unit”
- Option Name: wp_estate_cssbox_shadow
- CSS Variable: –wp-estate-cssbox-shadow-option
- Purpose: Box shadow effect on property units and similar elements
- Default Value: 0px 2px 0px 0px rgba(227, 228, 231, 1)
SCSS Usage:
.property-unit {
box-shadow: var(--wp-estate-cssbox-shadow-option, var(--wp-estate-cssbox-shadow));
}
12. Logo Maximum Height
- Theme Options Title: “Maximum height for the logo in px”
- Option Name: wp_estate_logo_max_height
- CSS Variable: –wp-estate-logo-max-height-option
- Unit: px
- Purpose: Controls maximum height of the logo
- Default Value: 60
SCSS Usage:
.logo img {
max-height: var(--wp-estate-logo-max-height-option, var(--wp-estate-logo-max-height));
}
13. Logo Maximum Width
- Theme Options Title: “Maximum width for the logo in px”
- Option Name: wp_estate_logo_max_width
- CSS Variable: –wp-estate-logo-max-width-option
- Unit: px
- Purpose: Controls maximum width of the logo
- Default Value: 200
SCSS Usage:
.logo img {
max-width: var(--wp-estate-logo-max-width-option, var(--wp-estate-logo-max-width));
}
14. Logo Margin
- Theme Options Title: “Margin top for logo in px”
- Option Name: wp_estate_logo_margin
- CSS Variable: –wp-estate-logo-margin-option
- Unit: px
- Purpose: Controls top margin for logo
- Default Value: 0
SCSS Usage:
.logo img {
margin-top: var(--wp-estate-logo-margin-option, var(--wp-estate-logo-margin));
}
15. Header Height
- Theme Options Title: “Header Height”
- Option Name: wp_estate_header_height
- CSS Variable: –wp-estate-header-height-option
- Unit: px
- Purpose: Controls header height in pixels
- Default Value: 90
SCSS Usage:
.header-wrapper {
height: var(--wp-estate-header-height-option, var(--wp-estate-header-height));
}
16. Sticky Header Height
- Theme Options Title: “Sticky Header Height”
- Option Name: wp_estate_sticky_header_height
- CSS Variable: –wp-estate-sticky-header-height-option
- Unit: px
- Purpose: Controls sticky header height in pixels
- Default Value: 70
SCSS Usage:
.header-wrapper.sticky-header {
height: var(--wp-estate-sticky-header-height-option, var(--wp-estate-sticky-header-height));
}
17. Top Menu Font Size
- Theme Options Title: “Top Menu Font Size”
- Option Name: wp_estate_top_menu_font_size
- CSS Variable: –wp-estate-top-menu-font-size-option
- Unit: px
- Purpose: Controls font size of top menu items
- Default Value: 14
SCSS Usage:
.top-menu-item {
font-size: var(--wp-estate-top-menu-font-size-option, var(--wp-estate-top-menu-font-size));
}
18. Menu Item Font Size
- Theme Options Title: “Menu Item Font Size”
- Option Name: wp_estate_menu_item_font_size
- CSS Variable: –wp-estate-menu-item-font-size-option
- Unit: px
- Purpose: Controls font size of main menu items
- Default Value: 14
SCSS Usage:
.menu-item {
font-size: var(--wp-estate-menu-item-font-size-option, var(--wp-estate-menu-item-font-size));
}
19. Border Bottom Header
- Theme Options Title: “Height of the border below header (in pixels)”
- Option Name: wp_estate_border_bottom_header
- CSS Variable: –wp-estate-border-bottom-header-option
- Unit: px
- Purpose: Controls the height of border below header
- Default Value: 0
SCSS Usage:
.header-wrapper {
border-bottom-width: var(--wp-estate-border-bottom-header-option, var(--wp-estate-border-bottom-header));
}
20. Sticky Border Bottom Header
- Theme Options Title: “Height of the border below sticky header (in pixels)”
- Option Name: wp_estate_sticky_border_bottom_header
- CSS Variable: –wp-estate-sticky-border-bottom-header-option
- Unit: px
- Purpose: Controls the height of border below sticky header
- Default Value: 0
SCSS Usage:
.header-wrapper.sticky-header {
border-bottom-width: var(--wp-estate-sticky-border-bottom-header-option, var(--wp-estate-sticky-border-bottom-header));
}
