Box With Button

Creates a colorful ribbon that accepts text, a background image and a link embedded on a button.

WARNING avoid special symbols such as (, ), [, ] and similar in the texts of this component because it could break the look&feel

Input variables:

href: str
title: str
line: str
button_text: str

And accepts the following input variable as optional:

background_url: Optional[str]

Example of use:

s.plt.html(
    order=0,
    html=s.html_components.box_with_button(
        href='https://cutt.ly/qJANGcX',
        title='Success case',
        line='AI Explained',
        button_text='Visit now!',
    )
)
You can add text with t a very nice background to highlight and use as an indication of what will be linked in the button. A new window will open with the link.

You can resize, and change position at will, for example:

s.plt.html(
    order=0, cols_size=5, padding='1,0,0,6',
    html=s.html_components.box_with_button(
        href='https://cutt.ly/qJANGcX',
        title='Success case',
        line='AI Explained',
        button_text='Visit now!',
    )
)
Note the use of cols_size=5, padding='1,0,0,6', that change the size and position of the component. The order of spaces is Top, Right, Bottom, Left.

More on how to use the Grid.

Video demonstration

Last updated

Was this helpful?