С чем вам помочь?

Задавайте вопрос или опишите проблему, с которой Вы столкнулись

Как добавить таблицу в текст страницы, описания или новости

При работе с текстом описания у товара, статической страницей или новостью, может возникнуть ситуация когда некоторые данные необходимо представить в виде таблицы. 

В данной статье рассмотрим 2 варианта, как можно добавить таблицу в текст. 

 

Добавление таблицы в текст через встроенный HTML редактор

Для примера, мы рассмотрим добавление в текст статической страницы.

Переходим в меню "CMS - Статические страницы" и тут, открываем на редактирование, для примера, любую страницу.

Далее, в тексте ставим курсор на то место, где нужно чтобы была таблица. (1)

Затем на панели редактора выбираем иконку "таблица" (2)

Рисунок 1. 

Появится окно настроек таблицы, тут можно сразу указать кол-во строк и колонок будущей таблицы (1). 

Указываем нужные настройки и нажимаем OK (2) 

Рисунок 2.

Готово, таблица добавлена.

Рисунок 3.

Далее вы можете вносить в неё данные, прямо в нужные ячейки. И, при необходимости, нажав правой кнопкой мыши на таблице, вносить изменения в её структуру.

Рисунок 4.

Всё готово.

 

Посмотрите так же:

Инструкция. Формирование рамки таблицы

Инструкция. Вывод всплывающего окна с текстом при нажатии на ссылку

 

Добавление таблицы в текст через чистый HTML

Существует так же альтернативный вариант добавления таблицы в текст - это добавление сразу HTML верстки таблицы в нужное место в общей HTML вёрстке. 

Обратите внимание. Для работы с чистым HTML необходим навыки работы с HTML, если вы испытываете трудности в этом вопросе, мы рекомендуем обратиться к специалисту.

И так, если рассматривать наш предыдущий пример, добавления таблицы в статическую страницу, принцип работы по шагам, будет следующий.

Для начала вставим метку, где будет наша таблица. В нужном месте, напишем текст, который будет легко найти затем в HTML, напишем, например 11111111111111111111 (строчка из повторяющихся смолов), или ААААААААААААААА, на выбор.

Рисунок 5.

Затем переключаемся в режим "Источник" и находим нашу "метку".

Рисунок 6.

Теперь в место маркера, мы вставляем HTML код нашей таблицы. 

Например вот такой:

<table border="1" cellpadding="1" cellspacing="1" style="width: 500px;">
 <tbody>
  <tr>
     <td>&nbsp;</td>
     <td>&nbsp;</td>
  </tr>
  <tr>
     <td>&nbsp;</td>
     <td>&nbsp;</td>
  </tr>
  <tr>
     <td>&nbsp;</td>
     <td>&nbsp;</td>
  </tr>
 </tbody>
</table>

 

Получится вот так

Рисунок 7.

Отлично, при переключении обратно из режима источника, в режим визуализации, мы должны увидеть таблицу. 

Рисунок 8.

Если таблицу видно, значит всё в порядке. 

Обратите внимание, что описанный принцип - это совсем базовые вещи, если нужно сделать что-то более сложное с HTML вёрсткой, мы рекомендуем обратиться за помощью к специалисту (HTML верстальщик) который поможет сделать то что нужно.

На этом всё. 

 

Посмотрите так же:

Инструкция. Формирование рамки таблицы

Инструкция. Вывод всплывающего окна с текстом при нажатии на ссылку

 

Открыть онлайн чат? Открыть
Статья оказалась полезной? Да Нет
Как мы можем улучшить статью?
Благодарим за отзыв.
Благодарим за отзыв. Мы улучшим эту статью.
Произошла ошибка.
Не нашли нужную статью? Предложить тему
Не нашли нужную статью?
Благодарим за отзыв.
Произошла ошибка.

Дизайн интернет-магазина

Работа с CSS Как изменить надписи кнопок на сайте Как изменить дизайн сайта Как изменить размер и стиль шрифта на сайте Примеры изменения CSS Как создать и загрузить свою цветовую схему в трансформер дизайна Настройка внешнего вида интернет-магазина Как загрузить свою тему в трансформер дизайна Редактирование блоков и текстов на главной странице Как создать и загрузить свой фон в трансформер дизайна Работа со статическими блоками (видео) Работа со статическими блоками (описание блоков) Вопросы авторского права на дизайн Товары на главной: добавление новинок и хитов Настройка карусели на главной странице интернет-магазина (видео) Настройка карусели на главной странице интернет-магазина Вывод изображения большего размера при нажатии изображение Вывод вплывающего окна с текстом при нажатии на ссылку Как добавить таблицу в текст страницы, описания или новости Установка якоря на странице Формирование рамки таблицы Как изменить размер фотографии (картинок) для всех сущностей в каталоге Как создать и загрузить свою тему в трансформер дизайна (Для версии 4.x и 3.x)
© AdvantShop. Платформа для открытия интернет-магазина.