{ "@import": [ "../../builder/config/customizer.json", "../../styler/config/customizer.json", "../../theme-cookie/config/customizer.json", "../../theme-settings/config/customizer.json" ], "help": "https://yootheme.com", "sections": { "layout": { "title": "Layout", "priority": 10, "fields": { "layout": { "type": "menu", "items": { "site": "Site", "header": "Header", "mobile": "Mobile", "top": "Top", "sidebar": "Sidebar", "bottom": "Bottom", "footer-builder": "Footer", "system-blog": "Blog", "system-post": "Post" } } } } }, "panels": { "site": { "title": "Site", "width": 400, "fields": { "logo.text": { "label": "Logo Text", "description": "The logo text will be used, if no logo image has been picked. If an image has been picked, it will be used as an aria-label attribute on the link." }, "logo.image": { "label": "Logo Image", "type": "image" }, "logo.image_svg_inline": { "description": "Select your logo. Optionally inject an SVG logo into the markup so it adopts the text color automatically.", "type": "checkbox", "text": "Inline SVG logo" }, "logo._image_dimension": { "type": "grid", "description": "Setting just one value preserves the original proportions. The image will be resized and cropped automatically, and where possible, high resolution images will be auto-generated.", "width": "1-2", "fields": { "logo.image_width": { "label": "Width", "attrs": { "placeholder": "auto" } }, "logo.image_height": { "label": "Height", "attrs": { "placeholder": "auto" } } }, "show": "logo.image || logo.image_inverse" }, "logo.image_inverse": { "label": "Inverse Logo (Optional)", "description": "Select an alternative logo with inversed color, e.g. white, for better visibility on dark backgrounds. It will be displayed automatically, if needed.", "type": "image" }, "logo.image_mobile": { "label": "Mobile Logo (Optional)", "description": "Select an alternative logo, which will be used on small devices.", "type": "image" }, "logo._image_mobile_dimension": { "type": "grid", "description": "Setting just one value preserves the original proportions. The image will be resized and cropped automatically, and where possible, high resolution images will be auto-generated.", "width": "1-2", "fields": { "logo.image_mobile_width": { "label": "Width", "attrs": { "placeholder": "auto" } }, "logo.image_mobile_height": { "label": "Height", "attrs": { "placeholder": "auto" } } }, "show": "logo.image_mobile || logo.image_mobile_inverse" }, "logo.image_mobile_inverse": { "label": "Mobile Inverse Logo (Optional)", "description": "Select an alternative logo with inversed color, e.g. white, for better visibility on dark backgrounds. It will be displayed automatically, if needed.", "type": "image" }, "logo.image_dialog": { "label": "Dialog Logo (Optional)", "description": "Select a logo, which will be shown in offcanvas and modal dialogs of certain header layouts.", "type": "image" }, "logo._image_dialog_dimension": { "type": "grid", "description": "Setting just one value preserves the original proportions. The image will be resized and cropped automatically, and where possible, high resolution images will be auto-generated.", "width": "1-2", "fields": { "logo.image_dialog_width": { "label": "Width", "attrs": { "placeholder": "auto" } }, "logo.image_dialog_height": { "label": "Height", "attrs": { "placeholder": "auto" } } }, "show": "logo.image_dialog" }, "site.layout": { "label": "Layout", "type": "select", "options": { "Full Width": "full", "Boxed": "boxed" } }, "site.boxed.alignment": { "type": "checkbox", "text": "Center", "enable": "site.layout == 'boxed'" }, "site.boxed.margin_top": { "type": "checkbox", "text": "Add top margin", "enable": "site.layout == 'boxed'" }, "site.boxed.margin_bottom": { "type": "checkbox", "text": "Add bottom margin", "enable": "site.layout == 'boxed'" }, "site.boxed.header_outside": { "type": "checkbox", "text": "Display header outside the container", "enable": "site.layout == 'boxed'" }, "site.boxed.media": { "label": "Image", "description": "Upload an optional background image that covers the page. It will be fixed while scrolling.", "type": "image", "enable": "site.layout == 'boxed'" }, "site.boxed._media": { "type": "button-panel", "panel": "site-media", "text": "Edit Settings", "show": "site.layout == 'boxed' && site.boxed.media" }, "site.boxed.header_transparent": { "label": "Transparent Header", "description": "Make the header background transparent.", "type": "select", "options": { "None": "", "Light Text": "light", "Dark Text": "dark" }, "enable": "site.layout == 'boxed' && site.boxed.header_outside && !header.transparent" }, "site.toolbar_width": { "label": "Toolbar", "type": "select", "options": { "Default": "default", "Small": "small", "Large": "large", "X-Large": "xlarge", "Expand": "expand" } }, "site.toolbar_center": { "type": "checkbox", "text": "Center" }, "site.toolbar_transparent": { "type": "checkbox", "text": "Inherit transparency from header" }, "site.breadcrumbs": { "label": "Breadcrumbs", "type": "checkbox", "text": "Display the breadcrumb navigation" }, "site.breadcrumbs_show_current": { "text": "Show current page", "type": "checkbox", "enable": "site.breadcrumbs" }, "site.breadcrumbs_show_home": { "description": "Show or hide the home link as first item as well as the current page as last item in the breadcrumb navigation.", "text": "Show home link", "type": "checkbox", "enable": "site.breadcrumbs" }, "site.breadcrumbs_home_text": { "label": "Breadcrumbs Home Text", "description": "Enter the text for the home link.", "attrs": { "placeholder": "Home" }, "enable": "site.breadcrumbs && site.breadcrumbs_show_home" }, "site.main_section.height": { "label": "Main Section Height", "description": "On short pages, the main section can be expanded to fill the viewport. This only applies to pages which are not build with the page builder.", "text": "Expand height", "type": "checkbox" } } }, "site-media": { "title": "Image", "width": 400, "fields": { "site._image_dimension": { "type": "grid", "description": "Set the width and height in pixels (e.g. 600). Setting just one value preserves the original proportions. The image will be resized and cropped automatically.", "width": "1-2", "fields": { "site.image_width": { "label": "Width", "attrs": { "placeholder": "auto" } }, "site.image_height": { "label": "Height", "attrs": { "placeholder": "auto" } } } }, "site.image_focal_point": { "label": "Focal Point", "description": "Set a focal point to adjust the image focus when cropping.", "type": "select", "options": { "Top Left": "top-left", "Top Center": "top-center", "Top Right": "top-right", "Center Left": "center-left", "Center Center": "", "Center Right": "center-right", "Bottom Left": "bottom-left", "Bottom Center": "bottom-center", "Bottom Right": "bottom-right" } }, "site.image_size": { "label": "Image Size", "description": "Determine whether the image will fit the page dimensions by clipping it or by filling the empty areas with the background color.", "type": "select", "options": { "Auto": "", "Cover": "cover", "Contain": "contain" } }, "site.image_position": { "label": "Image Position", "description": "Set the initial background position, relative to the page layer.", "type": "select", "options": { "Top Left": "top-left", "Top Center": "top-center", "Top Right": "top-right", "Center Left": "center-left", "Center Center": "center-center", "Center Right": "center-right", "Bottom Left": "bottom-left", "Bottom Center": "bottom-center", "Bottom Right": "bottom-right" } }, "site.image_effect": { "label": "Image Effect", "description": "Add a parallax effect or fix the background with regard to the viewport while scrolling.", "type": "select", "options": { "None": "", "Parallax": "parallax", "Fixed": "fixed" } }, "site.image_parallax_bgx": { "text": "Translate X", "type": "parallax-stops", "attrs": { "min": -600, "max": 600, "step": 10 }, "show": "site.image_effect == 'parallax'" }, "site.image_parallax_bgy": { "text": "Translate Y", "type": "parallax-stops", "attrs": { "min": -600, "max": 600, "step": 10 }, "show": "site.image_effect == 'parallax'" }, "site.image_parallax_easing": { "label": "Parallax Easing", "description": "Set the animation easing. Zero transitions at an even speed, a negative value starts off quickly while a positive value starts off slowly.", "type": "range", "attrs": { "min": -2, "max": 2, "step": 0.1 }, "show": "site.image_effect == 'parallax'" }, "site.image_parallax_breakpoint": { "label": "Parallax Breakpoint", "description": "Display the parallax effect only on this device width and larger.", "type": "select", "options": { "Always": "", "Small (Phone Landscape)": "s", "Medium (Tablet Landscape)": "m", "Large (Desktop)": "l", "X-Large (Large Screens)": "x" }, "show": "site.image_effect == 'parallax'" }, "site.image_visibility": { "label": "Visibility", "description": "Display the image only on this device width and larger.", "type": "select", "options": { "Always": "", "Small (Phone Landscape)": "s", "Medium (Tablet Landscape)": "m", "Large (Desktop)": "l", "X-Large (Large Screens)": "xl" } }, "site.media_background": { "label": "Background Color", "description": "Use the background color in combination with blend modes, a transparent image or to fill the area if the image doesn't cover the whole page.", "type": "color" }, "site.media_blend_mode": { "label": "Blend Mode", "description": "Determine how the image will blend with the background color.", "type": "select", "options": { "Normal": "", "Multiply": "multiply", "Screen": "screen", "Overlay": "overlay", "Darken": "darken", "Lighten": "lighten", "Color-dodge": "color-dodge", "Color-burn": "color-burn", "Hard-light": "hard-light", "Soft-light": "soft-light", "Difference": "difference", "Exclusion": "exclusion", "Hue": "hue", "Saturation": "saturation", "Color": "color", "Luminosity": "luminosity" } }, "site.media_overlay": { "label": "Overlay Color", "description": "Set an additional transparent overlay to soften the image.", "type": "color" } } }, "header": { "title": "Header", "width": 400, "fields": { "header.layout": { "label": "Layout", "description": "Select the layout for the logo, navbar and header positions. Some layouts can split or push items of a position which are shown as ellipsis.", "title": "Select header layout", "type": "select-img", "options": { "horizontal-left": { "label": "Horizontal Left", "src": "$ASSETS/images/header/horizontal-left.svg" }, "horizontal-center": { "label": "Horizontal Center", "src": "$ASSETS/images/header/horizontal-center.svg" }, "horizontal-right": { "label": "Horizontal Right", "src": "$ASSETS/images/header/horizontal-right.svg" }, "horizontal-justify": { "label": "Horizontal Justify", "src": "$ASSETS/images/header/horizontal-justify.svg" }, "horizontal-center-logo": { "label": "Horizontal Center Logo", "src": "$ASSETS/images/header/horizontal-center-logo.svg" }, "stacked-center-a": { "label": "Stacked Center A", "src": "$ASSETS/images/header/stacked-center-a.svg" }, "stacked-center-b": { "label": "Stacked Center B", "src": "$ASSETS/images/header/stacked-center-b.svg" }, "stacked-center-c": { "label": "Stacked Center C", "src": "$ASSETS/images/header/stacked-center-c.svg" }, "stacked-center-split-a": { "label": "Stacked Center Split A", "src": "$ASSETS/images/header/stacked-center-split-a.svg" }, "stacked-center-split-b": { "label": "Stacked Center Split B", "src": "$ASSETS/images/header/stacked-center-split-b.svg" }, "stacked-left": { "label": "Stacked Left", "src": "$ASSETS/images/header/stacked-left.svg" }, "stacked-justify": { "label": "Stacked Justify", "src": "$ASSETS/images/header/stacked-justify.svg" } } }, "header.split_index": { "label": "Split Items", "description": "The logo is placed automatically between the items. Optionally, set the number of items after which the items are split.", "type": "select", "options": { "Auto": "", "After 1 Item": 1, "After 2 Items": 2, "After 3 Items": 3, "After 4 Items": 4, "After 5 Items": 5, "After 6 Items": 6, "After 7 Items": 7, "After 8 Items": 8, "After 9 Items": 9, "After 10 Items": 10 }, "show": "$match(header.layout, '^stacked-center-(split-|c)')" }, "header.push_index": { "label": "Push Items", "description": "Set the number of items after which the following items are pushed to the right.", "type": "select", "options": { "None": "", "After 1 Item": 1, "After 2 Items": 2, "After 3 Items": 3, "After 4 Items": 4, "After 5 Items": 5, "After 6 Items": 6, "After 7 Items": 7, "After 8 Items": 8, "After 9 Items": 9, "After 10 Items": 10 }, "show": "$match(header.layout, '^stacked-left')" }, "header.width": { "label": "Max Width", "type": "select", "options": { "Default": "default", "Small": "small", "Large": "large", "X-Large": "xlarge", "Expand": "expand" } }, "header.logo_padding_remove": { "description": "Set the maximum header width.", "type": "checkbox", "text": "Remove left logo padding", "enable": "header.width == 'expand' && !$match(header.layout, '^stacked|^horizontal-center-logo')" }, "navbar.sticky": { "label": "Navbar", "description": "Stick the navbar at the top of the viewport while scrolling or only when scrolling up.", "type": "select", "options": { "Static": 0, "Sticky": 1, "Sticky on scroll up": 2 } }, "navbar.style": { "label": "Navbar Style", "description": "Select the navbar style.", "type": "select", "options": { "Default": "", "Primary": "primary" } }, "navbar.dropdown_align": { "label": "Dropdown", "type": "select", "options": { "Left": "left", "Right": "right", "Center": "center" } }, "navbar.dropdown_target": { "type": "checkbox", "text": "Align to navbar" }, "navbar.dropbar": { "type": "checkbox", "text": "Enable dropbar" }, "navbar.parent_icon": { "type": "checkbox", "text": "Show parent icon" }, "navbar.dropdown_click": { "description": "Align dropdowns to their menu item or the navbar. Optionally, show them in a full-width section called dropbar, display an icon to indicate dropdowns and let text items open by click and not hover.", "type": "checkbox", "text": "Enable click mode on text items" }, "dialog.layout": { "label": "Dialog Layout", "description": "Select the layout for the dialog position. Items which can be pushed are shown as ellipsis.", "title": "Select dialog layout", "type": "select-img", "options": { "dropbar-top": { "label": "Dropbar Top", "src": "$ASSETS/images/dialog/dropbar-top.svg" }, "dropbar-center": { "label": "Dropbar Center", "src": "$ASSETS/images/dialog/dropbar-center.svg" }, "offcanvas-top": { "label": "Offcanvas Top", "src": "$ASSETS/images/dialog/offcanvas-top.svg" }, "offcanvas-center": { "label": "Offcanvas Center", "src": "$ASSETS/images/dialog/offcanvas-center.svg" }, "modal-top": { "label": "Modal Top", "src": "$ASSETS/images/dialog/modal-top.svg" }, "modal-center": { "label": "Modal Center", "src": "$ASSETS/images/dialog/modal-center.svg" } } }, "dialog.text_center": { "type": "checkbox", "text": "Center horizontally" }, "dialog.push_index": { "label": "Dialog Push Items", "description": "Set the number of items after which the following items are pushed to the bottom.", "type": "select", "options": { "None": "", "After 1 Item": 1, "After 2 Items": 2, "After 3 Items": 3, "After 4 Items": 4, "After 5 Items": 5, "After 6 Items": 6, "After 7 Items": 7, "After 8 Items": 8, "After 9 Items": 9, "After 10 Items": 10 } }, "dialog.toggle": { "label": "Dialog Toggle", "type": "select", "options": { "Navbar Start": "navbar:start", "Navbar End": "navbar:end", "Header Start": "header:start", "Header End": "header:end" } }, "dialog.toggle_text": { "type": "checkbox", "text": "Show the menu text next to the icon" }, "dialog.dropbar.animation": { "label": "Dropbar Animation", "description": "Select the animation on how the dropbar appears below the navbar.", "type": "select", "options": { "Fade": "", "Slide Top": "reveal-top", "Slide Left": "slide-left", "Slide Right": "slide-right" }, "show": "$match(dialog.layout, '^dropbar')" }, "dialog.dropbar.width": { "label": "Dropbar Width", "description": "Set the dropbar width if it slides in from the left or right.", "type": "select", "options": { "None": "", "Medium": "medium", "Large": "large", "X-Large": "xlarge", "2X-Large": "2xlarge" }, "show": "$match(dialog.layout, '^dropbar') && $match(dialog.dropbar.animation, '^slide')" }, "dialog.dropbar.content_width": { "label": "Dropbar Content Width", "description": "Set the width of the dropbar content.", "type": "select", "options": { "None": "", "Medium": "width-medium", "Large": "width-large", "X-Large": "width-xlarge", "2X-Large": "width-2xlarge", "Container Default": "container", "Container Small": "container-small", "Container Large": "container-large", "Container X-Large": "container-xlarge" }, "show": "$match(dialog.layout, '^dropbar')" }, "dialog.offcanvas.mode": { "label": "Offcanvas Mode", "type": "select", "options": { "Slide": "slide", "Reveal": "reveal", "Push": "push" }, "show": "$match(dialog.layout, '^offcanvas')" }, "dialog.offcanvas.flip": { "type": "checkbox", "text": "Display on the right", "show": "$match(dialog.layout, '^offcanvas')" }, "dialog.offcanvas.overlay": { "type": "checkbox", "text": "Overlay the site", "show": "$match(dialog.layout, '^offcanvas')" }, "dialog.modal.width": { "label": "Modal Width", "description": "Set the content width.", "type": "select", "options": { "None": "", "Small": "small", "Medium": "medium", "Large": "large", "X-Large": "xlarge", "2X-Large": "2xlarge" }, "show": "$match(dialog.layout, '^modal')" }, "header.search": { "label": "Search", "description": "Select the position that will display the search.", "type": "select", "options": { "Hide": "", "Navbar Start": "navbar:start", "Navbar End": "navbar:end", "Header Start": "header:start", "Header End": "header:end", "Dialog Start": "dialog:start", "Dialog End": "dialog:end", "Logo End": "logo:end" } }, "header.search_style": { "label": "Search Style", "description": "Select the search style.", "type": "select", "options": { "Default": "", "Modal": "modal" }, "enable": "!$match(header.search, '^dialog')" }, "header.social": { "label": "Social Icons", "type": "select", "options": { "Hide": "", "Toolbar Left Start": "toolbar-left:start", "Toolbar Left End": "toolbar-left:end", "Toolbar Right Start": "toolbar-right:start", "Toolbar Right End": "toolbar-right:end", "Navbar Start": "navbar:start", "Navbar End": "navbar:end", "Header Start": "header:start", "Header End": "header:end", "Dialog Start": "dialog:start", "Dialog End": "dialog:end", "Logo End": "logo:end" } }, "header.social_items": { "type": "button-panel", "text": "Edit Items", "panel": "social-items" }, "header.social_target": { "type": "checkbox", "text": "Open in a new window" }, "header.social_style": { "type": "checkbox", "text": "Display icons as buttons" }, "header.social_image_svg_inline": { "type": "checkbox", "text": "Make SVG stylable with CSS", "description": "Select the position that will display the social icons." }, "header.social_width": { "label": "Social Icons Size", "description": "Set the icon width.", "attrs": { "placeholder": "20" }, "show": "header.social" }, "header.social_gap": { "label": "Social Icons Gap", "description": "Set the size of the gap between the social icons.", "type": "select", "options": { "Small": "small", "Medium": "medium", "Default": "", "Large": "large", "None": "collapse" }, "show": "header.social" } } }, "social-items": { "title": "Social Icons", "width": 400, "fields": { "header.social_items": { "label": "Items", "type": "item-panel", "fields": { "link": { "label": "Link", "attrs": { "placeholder": "https://" }, "description": "Enter link to your social profile. A corresponding UIkit brand icon will be displayed automatically, if available. Links to email addresses and phone numbers, like mailto:info@example.com or tel:+491570156, are also supported." }, "link_aria_label": { "label": "Link ARIA Label", "description": "Set a different link ARIA label for this item." }, "icon": { "label": "Icon", "description": "Pick an alternative icon from the icon library.", "type": "icon", "enable": "!image" }, "image": { "label": "Image", "description": "Pick an alternative SVG image from the media manager.", "type": "image", "enable": "!icon" } } } } }, "mobile": { "title": "Mobile", "width": 400, "fields": { "mobile.breakpoint": { "label": "Visibility", "description": "Select the device size where the default header will be replaced by the mobile header.", "type": "select", "options": { "None": "", "Small (Phone Landscape)": "s", "Medium (Tablet Landscape)": "m", "Large (Desktop)": "l" } }, "mobile.header.layout": { "label": "Layout", "description": "Select the layout for the logo-mobile, navbar-mobile and header-mobile positions.", "title": "Select mobile header layout", "type": "select-img", "options": { "horizontal-left": { "label": "Horizontal Left", "src": "$ASSETS/images/mobile-header/horizontal-left.svg" }, "horizontal-center": { "label": "Horizontal Center", "src": "$ASSETS/images/mobile-header/horizontal-center.svg" }, "horizontal-right": { "label": "Horizontal Right", "src": "$ASSETS/images/mobile-header/horizontal-right.svg" }, "horizontal-center-logo": { "label": "Horizontal Center Logo", "src": "$ASSETS/images/mobile-header/horizontal-center-logo.svg" } }, "show": "mobile.breakpoint" }, "mobile.header.logo_padding_remove": { "type": "checkbox", "text": "Remove left logo padding", "show": "mobile.breakpoint && mobile.header.layout != 'horizontal-center-logo'" }, "mobile.navbar.sticky": { "label": "Navbar", "description": "Stick the navbar at the top of the viewport while scrolling or only when scrolling up.", "type": "select", "options": { "Static": 0, "Sticky": 1, "Sticky on scroll up": 2 }, "show": "mobile.breakpoint" }, "mobile.dialog.layout": { "label": "Dialog Layout", "description": "Select the layout for the dialog-mobile position. Pushed items of the position are shown as ellipsis.", "title": "Select mobile dialog layout", "type": "select-img", "options": { "dropbar-top": { "label": "Dropbar Top", "src": "$ASSETS/images/mobile-dialog/dropbar-top.svg" }, "dropbar-center": { "label": "Dropbar Center", "src": "$ASSETS/images/mobile-dialog/dropbar-center.svg" }, "offcanvas-top": { "label": "Offcanvas Top", "src": "$ASSETS/images/mobile-dialog/offcanvas-top.svg" }, "offcanvas-center": { "label": "Offcanvas Center", "src": "$ASSETS/images/mobile-dialog/offcanvas-center.svg" }, "modal-top": { "label": "Modal Top", "src": "$ASSETS/images/mobile-dialog/modal-top.svg" }, "modal-center": { "label": "Modal Center", "src": "$ASSETS/images/mobile-dialog/modal-center.svg" } }, "show": "mobile.breakpoint" }, "mobile.dialog.text_center": { "type": "checkbox", "text": "Center horizontally", "show": "mobile.breakpoint" }, "mobile.dialog.close": { "type": "checkbox", "text": "Show close button", "show": "mobile.breakpoint && $match(mobile.dialog.layout, '^offcanvas|^modal')" }, "mobile.dialog.push_index": { "label": "Dialog Push Items", "description": "Set the number of items after which the following items are pushed to the bottom.", "type": "select", "options": { "None": "", "After 1 Item": 1, "After 2 Items": 2, "After 3 Items": 3, "After 4 Items": 4, "After 5 Items": 5, "After 6 Items": 6, "After 7 Items": 7, "After 8 Items": 8, "After 9 Items": 9, "After 10 Items": 10 }, "show": "mobile.breakpoint" }, "mobile.dialog.toggle": { "label": "Dialog Toggle", "type": "select", "options": { "Navbar Start": "navbar-mobile:start", "Navbar End": "navbar-mobile:end", "Header Start": "header-mobile:start", "Header End": "header-mobile:end" }, "show": "mobile.breakpoint" }, "mobile.dialog.toggle_text": { "type": "checkbox", "text": "Show the menu text next to the icon", "show": "mobile.breakpoint" }, "mobile.dialog.offcanvas.mode": { "label": "Offcanvas Mode", "type": "select", "options": { "Slide": "slide", "Reveal": "reveal", "Push": "push" }, "show": "mobile.breakpoint && $match(mobile.dialog.layout, '^offcanvas')" }, "mobile.dialog.offcanvas.flip": { "type": "checkbox", "text": "Display on the right", "show": "mobile.breakpoint && $match(mobile.dialog.layout, '^offcanvas')" }, "mobile.dialog.modal.width": { "label": "Modal Width", "description": "Set the content width.", "type": "select", "options": { "None": "", "Small": "small", "Medium": "medium", "Large": "large", "X-Large": "xlarge", "2X-Large": "2xlarge" }, "show": "mobile.breakpoint && $match(mobile.dialog.layout, '^modal')" }, "mobile.dialog.dropbar.animation": { "label": "Dropbar Animation", "description": "Select the animation on how the dropbar appears below the navbar.", "type": "select", "options": { "Fade": "", "Slide Top": "reveal-top", "Slide Left": "slide-left", "Slide Right": "slide-right" }, "show": "mobile.breakpoint && $match(mobile.dialog.layout, '^dropbar')" }, "mobile.header.search": { "label": "Search", "description": "Select the position that will display the search.", "type": "select", "options": { "Hide": "", "Navbar Start": "navbar-mobile:start", "Navbar End": "navbar-mobile:end", "Header Start": "header-mobile:start", "Header End": "header-mobile:end", "Dialog Start": "dialog-mobile:start", "Dialog End": "dialog-mobile:end", "Logo End": "logo-mobile:end" }, "show": "mobile.breakpoint" }, "mobile.header.search_style": { "label": "Search Style", "description": "Select the search style.", "type": "select", "options": { "Default": "", "Modal": "modal" }, "show": "mobile.breakpoint", "enable": "!$match(mobile.header.search, '^dialog')" }, "mobile.header.social": { "label": "Social Icons", "type": "select", "options": { "Hide": "", "Navbar Start": "navbar-mobile:start", "Navbar End": "navbar-mobile:end", "Header Start": "header-mobile:start", "Header End": "header-mobile:end", "Dialog Start": "dialog-mobile:start", "Dialog End": "dialog-mobile:end", "Logo End": "logo-mobile:end" }, "show": "mobile.breakpoint" }, "mobile.header.social_items": { "type": "button-panel", "text": "Edit Items", "panel": "mobile.social-items", "show": "mobile.breakpoint" }, "mobile.header.social_target": { "type": "checkbox", "text": "Open in a new window", "show": "mobile.breakpoint" }, "mobile.header.social_style": { "type": "checkbox", "text": "Display icons as buttons", "show": "mobile.breakpoint" }, "mobile.social_image_svg_inline": { "type": "checkbox", "text": "Make SVG stylable with CSS", "description": "Select the position that will display the social icons. Be sure to add your social profile links or no icons can be displayed.", "show": "mobile.breakpoint" }, "mobile.header.social_width": { "label": "Social Icons Size", "description": "Set the icon width.", "attrs": { "placeholder": "20" }, "show": "mobile.breakpoint && mobile.header.social" }, "mobile.header.social_gap": { "label": "Social Icons Gap", "description": "Set the size of the gap between the social icons.", "type": "select", "options": { "Small": "small", "Medium": "medium", "Default": "", "Large": "large", "None": "collapse" }, "show": "mobile.breakpoint && mobile.header.social" } } }, "mobile.social-items": { "title": "Social Icons", "width": 400, "fields": { "mobile.header.social_items": { "label": "Items", "type": "item-panel", "fields": { "link": { "label": "Link", "attrs": { "placeholder": "https://" }, "description": "Enter link to your social profile. A corresponding UIkit brand icon will be displayed automatically, if available. Links to email addresses and phone numbers, like mailto:info@example.com or tel:+491570156, are also supported." }, "link_aria_label": { "label": "Link ARIA Label", "description": "Set a different link ARIA label for this item." }, "icon": { "label": "Icon", "description": "Pick an alternative icon from the icon library.", "type": "icon", "enable": "!image" }, "image": { "label": "Image", "description": "Pick an alternative SVG image from the media manager.", "type": "image", "enable": "!icon" } } } } }, "menu-item": { "title": "Menu Item", "width": 400, "fields": { "image": { "label": "Image", "type": "image", "enable": "!icon" }, "icon": { "label": "Icon", "description": "Instead of using a custom image, you can click on the pencil to pick an icon from the icon library.", "type": "icon", "enable": "!image" }, "image_only": { "label": "Image and Title", "description": "Only show the image or icon.", "type": "checkbox", "text": "Hide title", "enable": "image || icon" }, "subtitle": { "label": "Subtitle", "description": "Enter a subtitle that will be displayed beneath the nav item.", "type": "text", "enable": "!((image || icon) && image_only)" }, "dropdown.columns": { "label": "Dropdown Columns", "description": "Split the dropdown into columns.", "type": "select", "default": 1, "options": { "1 Column": 1, "2 Columns": 2, "3 Columns": 3, "4 Columns": 4, "5 Columns": 5 }, "show": "this.panel.item.level == 0 && !content" }, "dropdown.stretch": { "label": "Dropdown Stretch", "description": "Stretch the dropdown to the width of the navbar or the navbar container.", "type": "select", "options": { "None": "", "Navbar": "navbar", "Navbar Container": "navbar-container" }, "show": "this.panel.item.level == 0" }, "dropdown.width": { "label": "Dropdown Width", "description": "Set the dropdown width in pixels (e.g. 600).", "show": "this.panel.item.level == 0", "enable": "!dropdown.justify" }, "dropdown.size": { "label": "Dropdown Padding", "type": "checkbox", "text": "Large padding", "show": "this.panel.item.level == 0" }, "dropdown.padding_remove_horizontal": { "type": "checkbox", "text": "Remove horizontal padding", "show": "this.panel.item.level == 0 && content" }, "dropdown.padding_remove_vertical": { "type": "checkbox", "text": "Remove vertical padding", "show": "this.panel.item.level == 0 && content" }, "dropdown.align": { "label": "Dropdown Alignment", "type": "select", "options": { "Default": "", "Left": "left", "Right": "right", "Center": "center" }, "show": "this.panel.item.level == 0", "enable": "!dropdown.justify" }, "dropdown.nav_style": { "label": "Dropdown Nav Style", "description": "Select the nav style.", "type": "select", "options": { "Default": "", "Secondary": "secondary" }, "show": "this.panel.item.level == 0 && !content" } } }, "menu-position": { "title": "Position", "width": 400, "fields": { "type": { "label": "Type", "type": "select", "options": { "Default": "", "Nav": "nav", "Subnav": "subnav", "Iconnav": "iconnav" } }, "divider": { "description": "Select an alternative menu type and show optional dividers between nav or subnav items.", "type": "checkbox", "text": "Show dividers" }, "style": { "label": "Style", "description": "Select the nav style.", "type": "select", "options": { "Default": "default", "Primary": "primary", "Secondary": "secondary" }, "show": "$match(this.panel.position, '^dialog')" }, "_image_dimensions": { "type": "grid", "description": "Setting just one value preserves the original proportions. The image will be resized and cropped automatically, and where possible, high resolution images will be auto-generated.", "width": "1-2", "fields": { "image_width": { "label": "Image Width", "attrs": { "placeholder": "auto" } }, "image_height": { "label": "Image Height", "attrs": { "placeholder": "auto" } } } }, "image_svg_inline": { "label": "Inline SVG", "description": "Inject SVG images into the markup so they adopt the text color automatically.", "type": "checkbox", "text": "Make SVG stylable with CSS" }, "icon_width": { "label": "Icon Width", "description": "Set the icon width." }, "image_margin": { "label": "Image and Title", "type": "checkbox", "text": "Add margin between" }, "image_align": { "label": "Image Align", "type": "select", "options": { "Top": "top", "Center": "center" } } } }, "top": { "title": "Top", "width": 400, "fields": { "top.style": { "label": "Style", "type": "select", "options": { "Default": "default", "Muted": "muted", "Primary": "primary", "Secondary": "secondary" } }, "top.overlap": { "type": "checkbox", "description": "Sections will only overlap each other, if it's supported by the style. Otherwise it has no visual effect.", "text": "Overlap the following section" }, "top.image": { "label": "Image", "description": "Upload a background image.", "type": "image", "show": "!top.video" }, "top.video": { "label": "Video", "description": "Select a video file or enter a link from YouTube or Vimeo.", "type": "video", "show": "!top.image" }, "top.media": { "type": "button-panel", "text": "Edit Settings", "panel": "top-media", "show": "top.image || top.video" }, "top.preserve_color": { "label": "Text Color", "description": "Disable automatic text recoloring, for example when you use cards inside sections.", "type": "checkbox", "text": "Preserve color", "show": "$match(top.style, 'primary|secondary')" }, "top.text_color": { "label": "Text Color", "description": "Set light or dark color mode for text, buttons and controls.", "type": "select", "options": { "None": "", "Light": "light", "Dark": "dark" }, "show": "!$match(top.style, 'primary|secondary') && (top.image || top.video)" }, "top.width": { "label": "Max Width", "description": "Set the maximum content width.", "type": "select", "options": { "Default": "default", "Small": "small", "Large": "large", "X-Large": "xlarge", "Expand": "expand", "None": "" } }, "top.height": { "label": "Height", "description": "Enabling viewport height on a section that directly follows the header will subtract the header's height from it. On short pages, a section can be expanded to fill the viewport.", "type": "select", "options": { "None": "", "Viewport": "full", "Viewport (Minus 20%)": "percent", "Viewport (Minus the following section)": "section", "Expand": "expand" } }, "top.padding": { "label": "Padding", "description": "Set the vertical padding.", "type": "select", "options": { "Default": "", "X-Small": "xsmall", "Small": "small", "Large": "large", "X-Large": "xlarge", "None": "none" } }, "top.padding_remove_top": { "type": "checkbox", "text": "Remove top padding", "enable": "top.padding != 'none'" }, "top.padding_remove_bottom": { "type": "checkbox", "text": "Remove bottom padding", "enable": "top.padding != 'none'" }, "top.header_transparent": { "label": "Transparent Header", "type": "select", "options": { "None": "", "Light Text": "light", "Dark Text": "dark" } }, "top.header_transparent_noplaceholder": { "description": "Make the header transparent and overlay this section if it directly follows the header.", "type": "checkbox", "text": "Pull content behind header", "enable": "top.header_transparent" }, "top.column_gap": { "label": "Column Gap", "description": "Set the size of the gap between the grid columns.", "type": "select", "options": { "Small": "small", "Medium": "medium", "Default": "", "Large": "large", "None": "collapse" } }, "top.row_gap": { "label": "Row Gap", "description": "Set the size of the gap between the grid rows.", "type": "select", "options": { "Small": "small", "Medium": "medium", "Default": "", "Large": "large", "None": "collapse" } }, "top.divider": { "label": "Divider", "description": "Show a divider between grid columns.", "type": "checkbox", "text": "Show dividers", "enable": "top.column_gap != 'collapse' && top.row_gap != 'collapse'" }, "top.vertical_align": { "label": "Vertical Alignment", "description": "Align the section content vertically, if the section height is larger than the content itself.", "type": "select", "options": { "Top": "", "Middle": "middle", "Bottom": "bottom" }, "show": "$match(top.height, 'full|percent|section')" }, "top.match": { "label": "Panels", "description": "Stretch the panel to match the height of the grid cell.", "type": "checkbox", "text": "Match height" }, "top.breakpoint": { "label": "Breakpoint", "description": "Set the breakpoint from which grid items will stack.", "type": "select", "options": { "Small (Phone Landscape)": "s", "Medium (Tablet Landscape)": "m", "Large (Desktop)": "l", "X-Large (Large Screens)": "xl" } } } }, "top-media": { "title": "Image/Video", "width": 400, "fields": { "top._image_dimension": { "type": "grid", "description": "Set the width and height in pixels (e.g. 600). Setting just one value preserves the original proportions. The image will be resized and cropped automatically.", "width": "1-2", "fields": { "top.image_width": { "label": "Width", "attrs": { "placeholder": "auto" } }, "top.image_height": { "label": "Height", "attrs": { "placeholder": "auto" } } }, "show": "top.image && !top.video" }, "top.image_size": { "label": "Image Size", "description": "Determine whether the image will fit the section dimensions by clipping it or by filling the empty areas with the background color.", "type": "select", "options": { "Auto": "", "Cover": "cover", "Contain": "contain" }, "show": "top.image && !top.video" }, "top.image_position": { "label": "Image Position", "description": "Set the initial background position, relative to the section layer.", "type": "select", "options": { "Top Left": "top-left", "Top Center": "top-center", "Top Right": "top-right", "Center Left": "center-left", "Center Center": "center-center", "Center Right": "center-right", "Bottom Left": "bottom-left", "Bottom Center": "bottom-center", "Bottom Right": "bottom-right" }, "show": "top.image && !top.video" }, "top.image_fixed": { "label": "Image Attachment", "text": "Fix the background with regard to the viewport.", "type": "checkbox", "show": "top.image && !top.video" }, "top.image_visibility": { "label": "Visibility", "description": "Display the image only on this device width and larger.", "type": "select", "options": { "Always": "", "Small (Phone Landscape)": "s", "Medium (Tablet Landscape)": "m", "Large (Desktop)": "l", "X-Large (Large Screens)": "xl" }, "show": "top.image && !top.video" }, "top._video_dimension": { "type": "grid", "description": "Set the video dimensions.", "width": "1-2", "fields": { "video_width": { "label": "Width" }, "video_height": { "label": "Height" } }, "show": "top.video && !top.image" }, "top.media_background": { "label": "Background Color", "description": "Use the background color in combination with blend modes, a transparent image or to fill the area, if the image doesn't cover the whole section.", "type": "color" }, "top.media_blend_mode": { "label": "Blend Mode", "description": "Determine how the image or video will blend with the background color.", "type": "select", "options": { "Normal": "", "Multiply": "multiply", "Screen": "screen", "Overlay": "overlay", "Darken": "darken", "Lighten": "lighten", "Color-dodge": "color-dodge", "Color-burn": "color-burn", "Hard-light": "hard-light", "Soft-light": "soft-light", "Difference": "difference", "Exclusion": "exclusion", "Hue": "hue", "Saturation": "saturation", "Color": "color", "Luminosity": "luminosity" } }, "top.media_overlay": { "label": "Overlay Color", "description": "Set an additional transparent overlay to soften the image or video.", "type": "color" } } }, "sidebar": { "title": "Sidebar", "width": 400, "fields": { "main_sidebar.width": { "label": "Width", "description": "Set a sidebar width in percent and the content column will adjust accordingly. The width will not go below the Sidebar's min-width, which you can set in the Style section.", "type": "select", "options": { "20%": "1-5", "25%": "1-4", "33%": "1-3", "40%": "2-5", "50%": "1-2" } }, "main_sidebar.breakpoint": { "label": "Breakpoint", "description": "Set the breakpoint from which the sidebar and content will stack.", "type": "select", "options": { "Small (Phone Landscape)": "s", "Medium (Tablet Landscape)": "m", "Large (Desktop)": "l" } }, "main_sidebar.first": { "label": "Order", "type": "checkbox", "text": "Move the sidebar to the left of the content" }, "main_sidebar.gutter": { "label": "Gap", "description": "Set the padding between sidebar and content.", "type": "select", "options": { "Default": "", "Small": "small", "Large": "large", "None": "collapse" } }, "main_sidebar.divider": { "label": "Divider", "type": "checkbox", "text": "Display a divider between sidebar and content" } } }, "bottom": { "title": "Bottom", "width": 400, "fields": { "bottom.style": { "label": "Style", "type": "select", "options": { "Default": "default", "Muted": "muted", "Primary": "primary", "Secondary": "secondary" } }, "bottom.overlap": { "type": "checkbox", "description": "Sections will only overlap each other, if it's supported by the style. Otherwise it has no visual effect.", "text": "Overlap the following section" }, "bottom.image": { "label": "Image", "description": "Upload a background image.", "type": "image", "show": "!bottom.video" }, "bottom.video": { "label": "Video", "description": "Select a video file or enter a link from YouTube or Vimeo.", "type": "video", "show": "!bottom.image" }, "bottom.media": { "type": "button-panel", "text": "Edit Settings", "panel": "bottom-media", "show": "bottom.image || bottom.video" }, "bottom.preserve_color": { "label": "Text Color", "description": "Disable automatic text recoloring, for example when you use cards inside sections.", "type": "checkbox", "text": "Preserve color", "show": "$match(bottom.style, 'primary|secondary')" }, "bottom.text_color": { "label": "Text Color", "description": "Set light or dark color mode for text, buttons and controls.", "type": "select", "options": { "None": "", "Light": "light", "Dark": "dark" }, "show": "!$match(bottom.style, 'primary|secondary') && (bottom.image || bottom.video)" }, "bottom.width": { "label": "Max Width", "description": "Set the maximum content width.", "type": "select", "options": { "Default": "default", "Small": "small", "Large": "large", "X-Large": "xlarge", "Expand": "expand", "None": "" } }, "bottom.height": { "label": "Height", "description": "Enabling viewport height on a section that directly follows the header will subtract the header's height from it. On short pages, a section can be expanded to fill the viewport.", "type": "select", "options": { "None": "", "Viewport": "full", "Viewport (Minus 20%)": "percent", "Viewport (Minus the following section)": "section", "Expand": "expand" } }, "bottom.padding": { "label": "Padding", "description": "Set the vertical padding.", "type": "select", "options": { "Default": "", "X-Small": "xsmall", "Small": "small", "Large": "large", "X-Large": "xlarge", "None": "none" } }, "bottom.padding_remove_top": { "type": "checkbox", "text": "Remove top padding", "enable": "bottom.padding != 'none'" }, "bottom.padding_remove_bottom": { "type": "checkbox", "text": "Remove bottom padding", "enable": "bottom.padding != 'none'" }, "bottom.column_gap": { "label": "Column Gap", "description": "Set the size of the gap between the grid columns.", "type": "select", "options": { "Small": "small", "Medium": "medium", "Default": "", "Large": "large", "None": "collapse" } }, "bottom.row_gap": { "label": "Row Gap", "description": "Set the size of the gap between the grid rows.", "type": "select", "options": { "Small": "small", "Medium": "medium", "Default": "", "Large": "large", "None": "collapse" } }, "bottom.divider": { "label": "Divider", "description": "Show a divider between grid columns.", "type": "checkbox", "text": "Show dividers", "enable": "bottom.column_gap != 'collapse' && bottom.row_gap != 'collapse'" }, "bottom.vertical_align": { "label": "Vertical Alignment", "description": "Align the section content vertically, if the section height is larger than the content itself.", "type": "select", "options": { "Top": "", "Middle": "middle", "Bottom": "bottom" }, "show": "$match(bottom.height, 'full|percent|section')" }, "bottom.match": { "label": "Panels", "description": "Stretch the panel to match the height of the grid cell.", "type": "checkbox", "text": "Match height" }, "bottom.breakpoint": { "label": "Breakpoint", "description": "Set the breakpoint from which grid items will stack.", "type": "select", "options": { "Small (Phone Landscape)": "s", "Medium (Tablet Landscape)": "m", "Large (Desktop)": "l", "X-Large (Large Screens)": "xl" } } } }, "bottom-media": { "title": "Image/Video", "width": 400, "fields": { "bottom._image_dimension": { "type": "grid", "description": "Set the width and height in pixels (e.g. 600). Setting just one value preserves the original proportions. The image will be resized and cropped automatically.", "width": "1-2", "fields": { "bottom.image_width": { "label": "Width", "attrs": { "placeholder": "auto" } }, "bottom.image_height": { "label": "Height", "attrs": { "placeholder": "auto" } } }, "show": "bottom.image && !bottom.video" }, "bottom.image_size": { "label": "Image Size", "description": "Determine whether the image will fit the section dimensions by clipping it or by filling the empty areas with the background color.", "type": "select", "options": { "Auto": "", "Cover": "cover", "Contain": "contain" }, "show": "bottom.image && !bottom.video" }, "bottom.image_position": { "label": "Image Position", "description": "Set the initial background position, relative to the section layer.", "type": "select", "options": { "Top Left": "top-left", "Top Center": "top-center", "Top Right": "top-right", "Center Left": "center-left", "Center Center": "center-center", "Center Right": "center-right", "Bottom Left": "bottom-left", "Bottom Center": "bottom-center", "Bottom Right": "bottom-right" }, "show": "bottom.image && !bottom.video" }, "bottom.image_fixed": { "label": "Image Attachment", "text": "Fix the background with regard to the viewport.", "type": "checkbox", "show": "bottom.image && !bottom.video" }, "bottom.image_visibility": { "label": "Visibility", "description": "Display the image only on this device width and larger.", "type": "select", "options": { "Always": "", "Small (Phone Landscape)": "s", "Medium (Tablet Landscape)": "m", "Large (Desktop)": "l", "X-Large (Large Screens)": "xl" }, "show": "bottom.image && !bottom.video" }, "bottom._video_dimension": { "type": "grid", "description": "Set the video dimensions.", "width": "1-2", "fields": { "video_width": { "label": "Width" }, "video_height": { "label": "Height" } }, "show": "bottom.video && !bottom.image" }, "bottom.media_background": { "label": "Background Color", "description": "Use the background color in combination with blend modes, a transparent image or to fill the area, if the image doesn't cover the whole section.", "type": "color" }, "bottom.media_blend_mode": { "label": "Blend Mode", "description": "Determine how the image or video will blend with the background color.", "type": "select", "options": { "Normal": "", "Multiply": "multiply", "Screen": "screen", "Overlay": "overlay", "Darken": "darken", "Lighten": "lighten", "Color-dodge": "color-dodge", "Color-burn": "color-burn", "Hard-light": "hard-light", "Soft-light": "soft-light", "Difference": "difference", "Exclusion": "exclusion", "Hue": "hue", "Saturation": "saturation", "Color": "color", "Luminosity": "luminosity" } }, "bottom.media_overlay": { "label": "Overlay Color", "description": "Set an additional transparent overlay to soften the image or video.", "type": "color" } } }, "footer-builder": { "title": "Builder", "heading": false, "width": 500 } } }