Language drop-down specs

To embed an automatic language drop-down to your page use the following HTML element:

<span 
    class="bs-activator" 
    [data-drop="auto|right|left|right-top|left-top"]
    [data-theme="light|dark"]
    [data-css="https://...."]
    [data-dialog-style="...."]
    ></span>

The minimal code snippet is <span class="bs-activator"></span>.

Configuration attributes

class

"bs-activator"

To adjust the language selector button, use this class in your css.

data-drop

The direction to open the language drop-down:

  • auto - automatically select the direction

  • right - drop down to the right and below the language selector

  • left - drop down to the left and below

  • right-top - open to the right and over the language selector

  • left-top - open to the left and over the language selector

data-theme

Overall coloring theme of the widget and its activator:

  • light (default) - light background, dark text

  • dark - dark background, light text

data-css

Embed the speficic CSS file in to the drop-down iframe.

data-dialog-style

CSS inline styles for widget dialog (iframe). Useful to set z-index and similar properties.

Note: data-drop attribute controls widget position.

Last updated