A bar is a thin module which appears at the top or bottom of the browser window.

Note: the bar module does not support the headline config property.

position

Position of the bar module relative to the browser window.

position string
Value Behavior
top default module is absolutely positioned to the top of the window
top-fixed module sticks to the top of the window when scrolling
bottom-fixed module sticks to the bottom of the window when scrolling

Positions - Live Preview

Position Bar Modules




positionSelector


Optionally define the DOM selector of the parent element you would like to insert the module into an element besides the document body.


Note: Depending on which position your bar has, it may or may not "appear" within your selected element. top-fixed and bottom-fixed use the position: fixed css rule, so while the HTML for your bar will be inserted into the DOM element defined by positionSelector it will appear fixed and full width on the page.



  
    

      positionSelector string
    

    

      Value
      Behavior
    

  
  

    selector
    Javascript selector of an existing div on the page where the module should appear.
  





Custom Position - Live Preview






variant


Variant determines any extra content that may be used by the module.



  
    

      variant int
    

    

      Value
      Behavior
    

  

  

    1
    default text-only-module
  

  

    2
    module includes an image
  





image


Define the featured image you would like to use for the module.


Note: This setting is only valid for modules with a variant value of 2.



  
    

      Key
      Type
      Behavior
    

  

  

    image
    string
    URL of the image to feature
  





Image (variant 2) - Live Preview



Image Bar Module





pushDown


For top or top-fixed positioned bars, we can select an element to push down (add a top margin) so it doesn't get covered by the module. This is especially helpful for a top-aligned site navigation.



  
    

      Key
      Type
      Behavior
    

  

  

    pushDown
    string
    selector of the element that should move down with the bar
  

  





Live Preview



pushDown Bar Module