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