How to set margin or border color for Note Shortcode

Hi @prajwaldesai,

navigate to Dashboard - Shortcodes - Note. All available color options are there.

Alternatively, you can style the shortcode using custom CSS code. Here a quick start guide – https://docs.getshortcodes.com/article/33-custom-css-editor.

Thanks for the response. I have tried with some ways to add border or margin color for box but it doesn’t work. It would be great if you can help me with how to set border color.

It would be great if you could post here what you already have for the box.

[su_note note_color=”#dff0d8″ text_color=”#3c763d” border_color=”#336633 radius=”0″]Success[/su_note]

[su_note note_color=”#dff0d8″ text_color=”#3c763d” border-color=”#336633 radius=”0″]Success[/su_note]

[su_note note_color=”#dff0d8″ text_color=”#3c763d” bordercolor=”#336633 radius=”0″]Success[/su_note]

The only options available for box shortcode are – note_color, text_color, radius and class. How can i set a border color ?.

Navigate to Dashboard - Shortcodes - Settings and paste the following code into Custom CSS code field:

.su-note.note-with-custom-border {
  border-color: orangered !important;
}

Then, add custom CSS class to your notes:

[su_note class="note-with-custom-border"]Note text[/su_note]

Thank you. So if i have got four note presets like success, info, danger and alert, i have to define 4 classes and use them in every shortcode ?.I wish there was a border color option when using Note shortcode.

I’ll think about adding the border_color option to [su_note] and [su_box].

Thank you so much Vladimir. You are the best !!