Documentation/  

UI.X 2

Global Settings

General

Hide elements during javascript loading - Enabling this setting will prevent JavaScript-dependent components from running until the JavaScript has finished running.

  • Enabling this will help to prevent "flashes of unstyled content" during page load.
  • Enabling this can sometimes cause issues with cacheing. Some CDN's may also be affected.

Remove what’s new buttons - Removes the whats's new buttons both from the visitor tabs location as well as the call to action buton on the forum list route.

Remove Title from Forum Index - Enabling this setting removes the Titlebar component from the forum index.

  • This setting only removes the Titlebar component if there are no other components that use this location
  • We suggest using this setting in conjunction with Remove forum list page actions. If Page Action buttons are present, the Titlebar will not hide.

Remove forum list page actions - Enabling this setting removes the page actions from the forum list. By default these are New Posts and Post New Thread.

List of additional css templates to include - Links CSS and LESS templates to the theme. Format requires comma separated list, as well as the file suffix (.css or .less). Example: uix.less, tactical.less, tactical_light.less

Force scrolling notices to all be primary notices - This allows you to force all scrolling notices to follow the primary notices style.

Social Media

Social media position - Choose the location for the Social Media component.

Copyright row (footer)
Staff bar
Header row
Backstretch

Enabling Backstretch allows an image or images to appear as a background. To enable backstretch, navigate to Appearance > Styles > Style Properties: Global Settings. Check the box next to Backstretch.

Backstretch images - Sets the images that you would like to use in the backstretch function.

  • Your images must be wrapped in quotes
  • Every line must be followed by a comma "," except the last image.
  • EX: "@xf-uix_imagePath/images/bg/1.jpg", "@xf-uix_imagePath/images/bg/2.jpg", "@xf-uix_imagePath/images/bg/3.jpg"

Backstretch selector - CSS selector for where to apply Backstretch. The following is a list of common locations:

  • Body: body
  • Welcome section: .uix_welcomeSection__inner
  • Header: .uix_headerContainer

Backstretch fade - Sets the speed (in milliseconds) that the images fade out/in.

Backstretch duration - Sets the amount of time (in milliseconds) that each image will be visible.

Elevation (box-shadow)

Elevation refers to the perceived depth of a component relative to the rest of the page. Box shadows are used to show that components are on top of/above other components on the page.

Elevation 1 - Set the box shadow for components that are at "elevation 1". Commonly used for things such as buttons, cards, nodes widgets, etc.

Elevation 2 - Set the box shadow for components that are at "elevation 2". Commonly used for things such as modals, off-canvases, sticky components, and hover states for components that are already elevated.

Parallax

Enable Parallax - Adds an image to a selector with a parallax effect.

Parallax image - Sets the image for tha parallax function.

Enable Selector - Sets the selector for the parallax function.

Javascript Path - The path to the theme's javascript directory relative to /js/themehouse/ . Allows for multiple versions of UI.X and/or Audentio.com products to be installed and not share the same javascript functions. Only change this if you are certain you should be.

Main page tabs

Main page tabs - Enables the main page tab component

Main tabbar location - Choose the location for the main tabbar component.

Main tabs sticky - Makes the main tabs sticky. Note: This is only applicable when the main tabs are in the header position.

Sticky tabs height - Sets the height of the sticky tab bar. (Note: This is important for calculating sticky heights.)

Javascript Path - The path to the theme's javascript directory relative to /js/themehouse/ . Allows for multiple versions of UI.X and/or Audentio.com products to be installed and not share the same javascript functions. We recommend leaving this setting untouched unless advised otherwise.

Theme

UI.X Version - This is for development only, and should not ever be changed.

Beta Mode - For development and bug-finding purposes. DO NOT enable on a live site please.

Copyright © 2024 Audentio, LLC. All Rights Reserved.