З розвитком web-додатків та SaaS , які мають різні тарифні плани, ми стали бачити таблиці, які компанії використовують, щоб показати, які можливості включені в кожен тариф.
Думаю, вперше ми побачили такі таблиці на сайтах хостинг-компаній, оскільки вони мали багато параметрів, які потрібно було показати. Часто провайдер виділяв один тариф як " найкращий вибір " або " найпопулярніший " і намагався привернути увагу потенційних покупців до нього - це можна зробити за допомогою іншого кольору або більшого розміру.

Днями я побачив безкоштовний плагін під назвою Pricing Table , який дозволяє створювати таблиці тарифів WordPress та додавати їх за допомогою шорткоду. У цьому огляді ми розглянемо, як встановити та налаштувати цей плагін.
Якщо вам потрібно, є також версія pro з більшими можливостями.

Завантажити Pricing Table безкоштовно | Завантажити Pricing Table Pro за $10
Установка плагіна
Завантажте плагін за посиланнями, завантажте його на ваш сайт і активуйте в Консолі. Якщо ви не знаєте, що таке плагіни та як їх встановлювати, перегляньте цей урок.
Відразу після активації плагіна ви побачите новий пункт меню Консолі: Pricing Table.

Додавання таблиці тарифів
Натисніть " Add New " і ви зможете почати створювати таблицю тарифів. На сторінці " Add New " ви побачите деякі опції: ви можете додати параметр (" Add Feature ") та додати тариф (" Add Package "):

Почніть з додавання параметрів , які ви хочете використовувати, ви побачите, що за замовчуванням вже є: ціна , подробиці , URL кнопки та текст кнопки . Інші параметри залежать від продукту. Тут ми додали кілька параметрів, які можуть бути включені для веб-хостингу:

Як тільки ви додали всі ваші параметри, ви можете почати додавати тарифи. Натисніть " Add Package ", і з'являться поля, які потрібно заповнити даними для тарифу:

Ви можете додати тут стільки тарифів, скільки захочете, коли закінчите, натисніть кнопку " Publish ".

Відображення таблиці тарифів
Якщо ви клацнете на пункт " All Pricing Tables ", ви побачите таблицю, яку щойно створили, а також шорткод у форматі:
[ahm-pricing-table id=18]
Цей код можна використовувати на сторінці або в записі, і таблиця з'явиться. Ви також можете додати параметр в кінці для того, щоб вибрати між сірою та зеленою таблицею, ось так:
[ahm-pricing-table id=18 template=green]
[ahm-pricing-table id=18 template=gray]
Створіть сторінку та додайте шорткод ось так:

Таблиці виглядатимуть приблизно так.
Зелена :

Сіра :

Висновок
Це досить простий спосіб додати таблицю тарифів на ваш WordPress сайт - установка дійсно проста, тому ні в кого з нею проблем бути не повинно.
Дизайн сірої таблиці досить симпатичний, і, на мою думку, вона може підійти під багато колірних схем і шаблонів. Зелена, правда, досить посередня, як ви бачите на зображенні вище, але ви можете купити версію pro і отримати більше колірних схем, які можуть бути кращими і більш відповідними вашому сайту. Якщо ви знаєте CSS, ви можете навіть більше змінити їх, щоб вони підійшли до теми вашого сайту.





















Коментарі до запису: 7
Підкажіть: як змінити значок/символ долара на значення іншої валюти?
Потрібно знайти код у файлах цього плагіна, який відповідає за виведення цього значка, та поміняти його на інший ідентифікатор. Спробуйте виконати пошук файлів плагіна.
А чи можна змінити колірний фон? якщо я наприклад хочу сірий та чорний
чи тільки в коді потрібно?
У стилях CSS можна змінити колір будь-якої.
Доброго дня, підкажіть а чи є плагін щоб з блогу створити інтернет магазин або хоча б щоб поставити картинку і під нею опис (що б не було як у блозі, підписів тощо) і чи реально це зробити, щоб не втратити ті розділи які зараз на сайті(блозі)???
Прайс англійською мовою? навіщо він потрібен?
Всім здоров'я!
Запитання до знавців.
Сайт на платформі woocommerce, в магазині є категорії товарів від шт до упаковки.
Питання: Як зробити так, щоб ця таблиця в карті товару пропонувала, наприклад, купити упаковку 100 руб, купити ящик 10,000р, купити вагон 500,000. Проблема в тому, як зробити або знайти посилання, яке вставляється в Button url і при натисканні давала команду покласти в кошик товар у кількості обраному покупцем. Сподіваюся суть питання буде зрозуміла )