Title: Vivido – Callout Boxes, Colored Notes & Dividers
Author: infyon
Published: <strong>30.09.2026</strong>
Last modified: 30.09.2026

---

Поиск плагинов

![](https://ps.w.org/vivido/assets/banner-772x250.png?rev=3721513)

![](https://ps.w.org/vivido/assets/icon-256x256.png?rev=3721513)

# Vivido – Callout Boxes, Colored Notes & Dividers

 Автор: [infyon](https://profiles.wordpress.org/infyon/)

[Скачать](https://downloads.wordpress.org/plugin/vivido.1.4.1.zip)

 * [Детали](https://ru.wordpress.org/plugins/vivido/#description)
 * [Отзывы](https://ru.wordpress.org/plugins/vivido/#reviews)
 *  [Установка](https://ru.wordpress.org/plugins/vivido/#installation)
 * [Разработка](https://ru.wordpress.org/plugins/vivido/#developers)

 [Поддержка](https://wordpress.org/support/plugin/vivido/)

## Описание

**Vivido** is a lightweight, zero-dependency WordPress plugin that helps you design
eye-catching content callouts, alert boxes, colorful dividers, syntax placers, and
colored icon list markers without touching complex CSS.

Whether you run a technical blog, documentation hub, tutorial site, or lifestyle
blog, Vivido makes your key takeaways, warnings, quotes, and code snippets scannable
and visually engaging.

### Why Use Vivido?

 * **Zero Bloat & Zero Dependencies:** Pure vanilla CSS and JavaScript. No bulky
   external frameworks or third-party fonts slowing down your page speed.
 * **Interactive Admin Builders:** Dedicated visual generators with live real-time
   previews for callouts, bullets, dividers, and code blocks.
 * **WYSIWYG & Block Ready:** Use interactive shortcodes anywhere—in Classic Editor,
   TinyMCE toolbars, Gutenberg Shortcode blocks, or page builders like Elementor.
 * **1-Click Code Copier:** Clean syntax blocks featuring automatic clipboard copying
   for commands, snippets, and scripts.

### Core Features

 * **Clean Alert & Notice Boxes (`[color_box]`):**
    - One-click presets: Tip (Green), Info (Blue), Warning (Amber), and Danger (
      Red).
    - Deep customization: Solid, dashed, dotted, or double border strokes.
    - Border options: Full-frame box or minimalist left-accent quote bar.
    - Rounded corner radius controls and optional Call-To-Action (CTA) buttons.
 * **Minimalist Quote Notes (`[color_note]`):**
    - Sleek, distraction-free notice banners with a 4px left-hand border accent.
 * **Colored Horizontal Dividers (`[color_divider]`):**
    - Custom stroke thickness (1px–10px) and line styles (solid, dashed, dotted).
    - Width scaling (20% to 100%) and alignment controls (Left, Center, Right).
 * **Colored Icon List Bullets (`[vivido_list]` & `[vivido_item]`):**
    - Replace ordinary bullet dots with expressive status icons: Checkmarks, Stars,
      Warning Triangles, Crosses, Pointers, and Colored Dots.
    - 4 Badge Styles: Flat glyph, Solid filled circle, Soft pastel tint (duotone),
      and Outlined frame.
 * **Syntax Placer with Quick Copy (`[vivido_code]`):**
    - Formatted code blocks with clean language labels (BASH, PHP, JS, Python, SQL,
      etc.).
    - Native clipboard API copy button with instant «Copied!» visual feedback and
      fallback support.

## Скриншоты

[⌊Interactive Callout Box Generator with live preview.⌉⌊Interactive Callout Box 
Generator with live preview.⌉[

Interactive Callout Box Generator with live preview.

[⌊Colored Bullet List & Badge Styler.⌉⌊Colored Bullet List & Badge Styler.⌉[

Colored Bullet List & Badge Styler.

[⌊Horizontal Divider & Separator Designer.⌉⌊Horizontal Divider & Separator Designer
.⌉[

Horizontal Divider & Separator Designer.

[⌊Code Placer Builder with One-Click Copy functionality.⌉⌊Code Placer Builder with
One-Click Copy functionality.⌉[

Code Placer Builder with One-Click Copy functionality.

## Установка

 1. Upload the `vivido` folder to the `/wp-content/plugins/` directory, or install 
    the `vivido.zip` package directly via **Plugins > Add New > Upload Plugin**.
 2. Activate the plugin through the **Plugins** screen in WordPress.
 3. Access the interactive shortcode generators under **Vivido** in your WordPress 
    admin menu.

## Часто задаваемые вопросы

### Does Vivido slow down my website?

No. Vivido does not load external web fonts or large script libraries. All styles
and scripts are lightweight vanilla assets under 10KB total.

### Can I use Vivido with Gutenberg?

Yes. You can paste generated shortcodes inside standard Gutenberg Shortcode or Paragraph
blocks. A toolbar button is also provided for inline callout wrapping.

### Can I use custom hex colors?

Yes. All shortcodes accept custom `#hex` color values for backgrounds, text, borders,
dividers, and icon badges.

### Where can I get support or request features?

Visit [Infyon.com/infyon](https://infyon.com/infyon) or post on the WordPress.org
support forum for Vivido.

## Отзывы

Нет отзывов об этом плагине.

## Участники и разработчики

«Vivido – Callout Boxes, Colored Notes & Dividers» — проект с открытым исходным 
кодом. В развитие плагина внесли свой вклад следующие участники:

Участники

 *   [ infyon ](https://profiles.wordpress.org/infyon/)

[Перевести «Vivido – Callout Boxes, Colored Notes & Dividers» на ваш язык.](https://translate.wordpress.org/projects/wp-plugins/vivido)

### Заинтересованы в разработке?

[Посмотрите код](https://plugins.trac.wordpress.org/browser/vivido/), проверьте 
[SVN репозиторий](https://plugins.svn.wordpress.org/vivido/), или подпишитесь на
[журнал разработки](https://plugins.trac.wordpress.org/log/vivido/) по [RSS](https://plugins.trac.wordpress.org/log/vivido/?limit=100&mode=stop_on_copy&format=rss).

## Журнал изменений

#### 1.4.1

 * Enqueued admin generator styles and scripts via `admin_enqueue_scripts` to meet
   WordPress.org directory standards.
 * Added `wp_kses_post` output sanitization across all shortcodes to prevent XSS
   vulnerabilities.
 * Fixed list layout container margins to maintain proper post alignment across 
   block themes.
 * Enhanced clipboard copy engine with timer protection and textarea fallback for
   non-HTTPS contexts.
 * Confirmed compatibility with WordPress 7.1.

#### 1.4.0

 * Added dedicated visual builder for Horizontal Dividers (`vivido-dividers`).
 * Added dedicated visual builder for Code Placers with live copy testing (`vivido-
   code-blocks`).

#### 1.3.0

 * Added dedicated visual builder for Colored Bullet Lists (`vivido-bullets`).
 * Added 4 distinct badge styles: Flat, Solid, Soft Tint, and Outlined.
 * Improved hex-to-rgba converter for pastel list accents.

#### 1.2.0

 * Added dedicated top-level WordPress admin menu for Vivido.
 * Added interactive Callout Box Generator with live preview.
 * Added global settings for default border styles and corner radiuses.

#### 1.0.0

 * Initial release.

## Мета

 *  Версия **1.4.1**
 *  Обновление: **20 часов назад**
 *  Активных установок: **Менее 10**
 *  Версия WordPress ** 5.8 или выше **
 *  Совместим вплоть до: **7.1.2**
 *  Версия PHP ** 7.4 или выше **
 *  Язык
 * [English (US)](https://wordpress.org/plugins/vivido/)
 * Метки:
 * [callout box](https://ru.wordpress.org/plugins/tags/callout-box/)[code block](https://ru.wordpress.org/plugins/tags/code-block/)
   [icon list](https://ru.wordpress.org/plugins/tags/icon-list/)[info box](https://ru.wordpress.org/plugins/tags/info-box/)
 *  [Дополнительно](https://ru.wordpress.org/plugins/vivido/advanced/)

## Оценки

Пока что нет ни одного отзыва.

[Ваш отзыв](https://wordpress.org/support/plugin/vivido/reviews/#new-post)

[Посмотреть всеотзывы](https://wordpress.org/support/plugin/vivido/reviews/)

## Участники

 *   [ infyon ](https://profiles.wordpress.org/infyon/)

## Поддержка

Есть что сказать? Нужна помощь?

 [Перейти в форум поддержки](https://wordpress.org/support/plugin/vivido/)

## Пожертвование

Хотите поддержать улучшение этого плагина?

 [ Пожертвовать на развитие плагина ](https://infyon.com/infyon)