Message Boxes.
You can have the following four message boxes error, info, alert, success with or without close icon.
If you wish to use the close icon then make sure you add an attribute close with true value as shown below in the code.
[demo_space height=”20px”]
[info close=”false”]Information: This is Error message box![/info]
[error close=”true”]Error: This is Error message box![/error]
[alert close=”true”]Alert: This is Alert message box![/alert]
[success close=”true”]Success: This is Success message box![/success]
[divider style=”thin” margin=”60px 0 40px 0″]
Get The Code:
[demo_space height=”20px”]
[info close="false"]Content Here...[/info]
[error close="true"]Content Here...[/error]
[alert close="true"]Content Here...[/alert]
[success close="true"]Content Here...[/success]
[divider style=”thin” margin=”40px 0 40px 0″]
Customization Options and Features:
[demo_space height=”20px”]
[list style=”square” color=”black”]
- Message Type: Choose the Message Box Type Error, Notice, Success and info.
- Message Text: Type the content you wish to display for the message box.
- Close: If You checked close Button Display.
[/list]
[divider style=”thin” margin=”60px 0 60px 0″]
Note Box
[note title=”Title Here:”]Vestibulum posuere at justo non sagittis. Sed non tristique est. Nam vitae nisl eget dui aliquam ornare. Nulla aliquet tincidunt diam, sed imperdiet mauris vulputate sit amet. Etiam ac dui viverra arcu condimentum fermentum.[/note]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ac mauris a eros vehicula blandit a pharetra urna. Vivamus venenatis libero in arcu dapibus varius. Sed interdum posuere odio et ornare. Morbi eleifend mauris id suscipit venenatis. Duis eget nibh nec urna lobortis mollis et volutpat massa. Vestibulum hendrerit commodo massa, quis scelerisque sapien tristique ut. Curabitur laoreet porttitor leo nec venenatis. Sed in felis nec metus vehicula accumsan. Suspendisse in nisl varius, interdum nisl et, laoreet nulla. Etiam iaculis nisi elit.
[note align=”right” width=”30%” title=”Note Box:”]Vestibulum posuere at justo non sagittis. Sed non tristique est. Nam vitae nisl eget dui aliquam ornare. Nulla aliquet tincidunt diam, sed imperdiet mauris vulputate sit amet. Etiam ac dui viverra arcu condimentum fermentum.[/note]Vestibulum posuere at justo non sagittis. Sed non tristique est. Nam vitae nisl eget dui aliquam ornare. Nulla aliquet tincidunt diam, sed imperdiet mauris vulputate sit amet. Etiam ac dui viverra arcu condimentum fermentum. Nunc malesuada, urna a viverra tempus, nisl mi mollis nisi, at imperdiet velit lectus in dui. Ut mauris elit, pharetra id nisi ac, vestibulum rutrum nulla. Fusce risus odio, placerat vel sem bibendum, sagittis porttitor justo. Fusce ac consectetur odio, eget bibendum velit.
Morbi lobortis, risus ac ultrices sodales, metus urna tincidunt urna, vitae pretium ante purus consequat lectus. Mauris molestie felis non nisi imperdiet cursus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Pellentesque massa purus, tincidunt sed risus eu, scelerisque ullamcorper augue. Maecenas sed odio eget sapien pellentesque pulvinar a eget dui. Sed sagittis lorem non odio laoreet molestie. Ut interdum eros et ultricies placerat. Aenean tempor dolor ut odio rutrum, eget laoreet purus porta. In semper eu elit in fermentum.
[divider style=”thin” margin=”60px 0 40px 0″]
Get The Code:
[demo_space height=”20px”]
[note align="right" width="30%" title="Title here"]Content Here...[/note]
[divider style=”thin” margin=”40px 0 40px 0″]
Customization Options and Features:
[demo_space height=”20px”]
[list style=”square” color=”black”]
- Title: Enter the title you want to display..
- Alignment: Choose content to align from left ,right or center.
- Width: Define width for note box in % or px.
- Message Text: Type the content you wish to display for the message..
[/list]