Overview
Blox purposefully includes minimal default styling to ensure that content blocks merge as seamlessly as possible into the current theme. Furthermore, due to the overwhelming variety of possible content choices, any additional styling is best left to you. With the Style tab that is located on all local and global blocks, you have everything you need to master the design of your blocks. (But if you ever need a little guidance, support is just an email away)
Usage
Custom Block Classes
Easily add any number of CSS classes to the current content block. Classes must be space separated. This option is very useful if you have theme specific classes, or if you have set some global styling to target all blocks with a given custom class.
Custom Block CSS
Each block has it’s own id. In the screenshot above you can see the id is #blox_global_637
. If this were a local block, the id would be #blox_local_637
. You can use the id to specifically target the block with custom CSS. Add any custom you want to the text box and it will be rendered on the frontend. Note that if you do not use the provided block id there is a chance that your styling could affect other content. Sometimes this might be desired, but generally you should preface all styles with the id.
Disable Default CSS
Blox include minimal default styling. However, if you absolutely was no default styling whatsoever you can disable it here if this block. Default styling will still be applied to other blocks. To disable default styling globally, visit the Style tab on the settings page.
Enable Wrap
Many Genesis themes come with a wrap
selector, which is used to constrain content to a specific width. Checking this option will add this selector to the block’s frontend markup. Depending on the theme you are using this can be useful. One example might be to constrain the width of a banner image. You will need to review your theme’s setup to determine if adding the wrap
selector will actually have an effect.