Здравствуйте, дорогие читатели SeoKos.ru! Сегодня мы поговорим о том, как вставить таблицу в wordpress блог. Думаю, каждый блоггер связывался с такой проблемой, ведь одним кликом это не предусмотрено. Сейчас мы поговорим о двух способах вставки таблицы.
Ни для кого не секрет, что в данный момент я выполняю один заказ – создание блога (подробнее о нем я скажу в отчете за январь). Так вот при выкладывании материалов на блог, я столкнулся с проблемой, как вставить таблицу в wordpress. К сожалению, в стандартном окне редактирования записей нет волшебной кнопки «Таблицы».
Немного походив по Рунету я все же нашел способ – сделать с помощью специального плагина (об этом ниже Способ №2). Но мы же знаем, что плагины значительно нагружают блог и снижают скорость загрузки сайта. Поэтому я решил поискать еще что-либо и нашел очень легкий способ без всяких накруток. Нужно лишь выполнить пару команд и отредактировать с помощью html.
Для чего нужны таблицы?
Глупый конечно вопрос для чего нужны таблицы в блоге, но все же давайте разберем. Таблицы служат для компоновки каких-либо данных. Для их сортировки и красивому отображению. Давайте, как всегда взглянем на примеры:
- Вы ведете блог своей компании. На нем выкладываете статьи с картинками, текстом и прайс-листом. Прайс-лист – это документ, в котором написаны цена на товар, услуги и т.д. Так вот, принято прайс-лист делать в виде таблицы. Во-первых, это удобно, а во-вторых, очень красиво выглядит.
- Вы решили провести конкурс на блоге. По окончанию конкурса, результаты необходимо вписать в отдельную статью. Как Вы думаете, будет лучше сделать: вписывать просто текстом (друг за другом) или же сделать красивую таблицу и аккуратно вписать результаты? Однозначно, лучше сделать таблицу!
Думаю я Вас убедил, что использовании таблицы очень важно! А теперь приступим непосредственно к главному – как сделать таблицу в wordpress в блог.
Как сделать таблицу в WordPress: Способ №1
Первым делом мы разберем способ создания таблицы без плагина. Для этого необходимо сделать нужную Вам таблицу в программе Microsoft Word
Далее нужно выделить (CTRL+A) и скопировать ее (CTRL+C)
После чего заходим в окно редактирования записи в WordPress и нажимаем на кнопку «Вставить из Word», вставляем туда содержимое буфер обмена (CTRL+V) и нажимаем «Вставить»
После чего таблица вставляется, но очень корявая и некрасивая. Это необходимо исправить! Для этого заходим в редактирование записи через html, находим таблицу и делаем следующие:
1. Находим строчку <table width="***" (вместо звездочек какой-то число) border="1" cellspacing="0" cellpadding="0">
2. И перед ней (строчкой) вставляем тег <p style="text-align: center;">
3. Далее находим тег, который закрывает таблицу </table> и вставляем после него </p>
Теперь сохраняем запись и радуемся. Таблица в статье готова!
Как сделать таблицу в WordPress: Способ №2
Этот способ так же рабочий и эффективный! Отличается лишь тем, что необходима установка плагина MCE Table Buttons. А как нам уже известно плагины нагружают блог. Кстати, в скором времени собираюсь начать выпускать серию статей «Как ускорить блог: Избавляемся от плагинов"
- Скачиваем плагин по ссылке
- Устанавливаем и активируем его
- Ничего настраивать не нужно, можно переходить сразу к созданию таблиц. Переходим в визуальный редактор записи и видим, что появились специальные значки
- Чтобы начать создание таблицы, нужно нажать на первую кнопку в этом строке. После чего открывается окно создания таблицы
- Настраиваем поля:
Columns — Количество колонок
Rows — Количество строк
Cell Padding — Отступы от ячеек до содержимого
Cell Spacing — Расстояние между ячейками
Alignmen — Выравнивание таблицы
Border — Толщина
Width — Ширина
Height— Высота
Table Caption — Заголовок таблицы
Background Image — Фоновое изображение
Frame — Отображение рамки
Rules — Внутренняя сетка таблицы
Border Color — Цвет обводки
Background Color - Фон таблицы
Вот и все, таблица готова! Только стоит помнить, что для нее необходимо наличие плагина. Если плагин удалить, то все таблицы перестанут отображаться. Поэтому рекомендую использовать первый способ.
На этом данная статья подходит к концу! Теперь мы знаем, как сделать таблицу в wordpress в блог и умеем это делать. Поздравляю! Да, кстати, чуть не забыл – посмотри на пример:
| Пример1 | Пример2 | Пример3 | Пример4 | Пример5 | Пример6 |
| Пример1 | Пример2 | Пример3 | Пример4 | Пример5 | Пример6 |
Если возникнут какие-то вопросы, пишите в комментариях – с удовольствием отвечу! До скорого!
P.S. Если Вам интересно почему и где я пропадал целую неделю, подписывайтесь на обновление! Завтра напишу отчет за месяц и свою историю исчезновения.
Также советую прочитать следующие статьи:
С уважением, Томский школьник!
(1 голос, в среднем: 5.00 из 5)
Loading...
Хороший пост, спасибо Константин. Мне пока что не было необходимости пользоваться таблицами, но кто знает, может завтра и понадобится.
Полезная статья, правда полезная.
Предпочитаю писать код вручную — хотя и долго, но зато вся таблица под контролем. С плагином конечно проще, но если их по каждому пустяку ставить — на блог места не останется
Интересно. И выглядит симпатично! Спасибо, как нибудь применю!
Думаю, на первое время можно и плагином обойтись, а потом ,и с кодом можно разобраться
Очень пригодится такая штука для новостного какого нибудь блога
Хороший плагин, но пока я могу работать ручками, буду работать
Мишко , Если может — пожалуйста! Это даже лучше будет
Когда-то нужна была таблица, но обошлась без нее. Теперь буду знать, где искать
Добрый день, подскажите пожалуйста, Есть форма поиска товаров по другому сайту, заключенная в (для фона). Как этот код HTML вставить на страницу WordPress?? И куда затем размещать скрипты. Спасибо!
Людмила, Извините, но с этим вопросом лучше обратиться к фрилансерам!
Здравствуйте! Подскажите, пожалуйста, возможно ли наименования столбцов развернуть вертикально? а то таблица не помещается по ширине...
Антон, Думаю что можно! Просто нужно настроить внешний вид таблицы через CSS
Ах внешний вид через CSS... Спасибо, но мне это пока что слишком сложно. я вовсе не знаю Css.
Хороший вариант.
Но мне как-то ближе внутренний метод через редактор в любое место.
Ну как говорится каждому своё.
Для меня даже это было чуть чуть удивительно что так можно.
Не пользовался, да и совсем забыл про этот метод.
Добрый день! У меня нет такой строки, данной Вами в п.1, таблица получилась корявая и перекошенная.
я так понял нужно было просто отцентрировать таблицу кодом и все?
Евгений Крыжановский, Не только...
Первый способ заинтересовал, когда понадобиться вставка таблицы в статью, обязательно им воспользуюсь, тем более никаких плагинов устанавливать не нужно. Ещё бы понять как красиво код в статью вставлять...
P.S. Видео жесть! Нужно было ещё подписать — слабонервным не смотреть!
Я сначала пишу статьи в Microsoft Word и сразу устанавливаю там же таблицу, заполняю её, то есть делаю законченную статью. Затем выделяю всю статью вместе с таблицей, иду в редактор, и жму левой кнопкой мыши — «вставить». Таблица получается немного корявая, это правда. Я просто захожу в HTML, и ставлю везде одинаковое значение ширины и высоты ячеек, а так же центрирую её, и всё, таблица получается ровненькая. А в начало кода таблицы и в конец ничего не добавляла, то есть не ставила, просто
и так далее. И проблем пока не было.
Забыла, что в комментариях кусочки кода не отображаются, я хотела показать, что просто окружаю таблицу тегом div
{div align="center"}
{table border="2" cellspacing="0" cellpadding="0"}
Так наверное видно будет.
Спасибо большое за статью, и за столь замечательный плагин!
Спасибо за статью, но на выходе таблица все равно корявая, так как большая по длине и ширине. Сейчас думаю: то ли исправить ширину в каждом столбце, то ли просто обрезать часть данных?
Это у Вас скорее всего проблема в файле style.css (может немного отличаться название). Найдите класс .table и посмотрите какое значение стоит в свойстве width (ширина)!
У меня не задан border, но все равно границы отображаются. Что сделать, чтобы их убрать??
Мне пока что не приходилось в своей работе использовать таблицы в вордресс но информацию намотал на ус
теперь если что буду знать где найти подробную статью на данную тему.
Дуже потрібна інформація. Я тобою захоплююсь звідки можна стільки знати.
Спасибо за хорошую статью. Очень помогла в работе.
Спасибо. Я уже думал искать плагины, но потом все в Excel и сделал и все стало чудесно.
Хорошая статья , спасибо Константин.Как всегда всё очень подробно изложил.
В MaxSite CMS та же проблема — буду использовать первый вариант.
А мне вот прямо сейчас понадобилась таблица в статье. Так что спасибо. Хотела обойтись без плагина, но у меня почему-то в редакторе WP нет кнопки вставить из Word. Может шаблон не поддерживает? Бывает такое? Придется кажется ставить плагин. А если его деактивировать после того, как таблицу сделаешь она пропадет из статьи?
Статья полезна. Но уважаемый автор, у меня такая проблема: как сделать чтоб таблица была прозрачной? Ну, как в ворде таблицы невидно, а текст есть. Спасибо
Добрый день. Нужно в файле style.css найти table и изменить параметр border по своему вкусу. Если хотите полностью отключить границы, то поставьте значение 0.
А кто знает как в вордпрес в визуальном редакторе вставить фоновую картинку на таблицу, строку или ячейку в таблице? А еще расширение для встваки в код блока если кто знает подскажите. может нужно плагины какие добавлять? Просто с вордпрес не работал давно, а ща столкнулся, вот в других движках в редакторе это предусмотрено. а здесь что то не могу найти. Можно конечно и в ручную прописать но это не совсем удобно каждый раз искать пути для картинок. тем более они там все скопом почемуто грузятся и возможности разложить по своим папкам кстати тоже не нашол...
День добрый помогите пожалуйста! Где исправлять этот код из первого варианта? У меня движок вордпресс и в разделе добавить запись видно визуальный редактор и просто текст- там где текст исправлять? Кстати код там получился такой
Уральский рекс
Бурманская кошка
Ориентальная длинношерстная кошка
а последняя строчка стерается всегда когда я переключаюсь между визуальным редактором и текст
Блин код стерся не покажу, вообщем как можно сделать что бы картинки\фото оставались в таблице???
как сделать такую красивую нумерацию как у вас «Рекомендую к прочтению» ?
Доброго времени суток, Константин. Случайно не знаете, как отключить адаптивный дизайн в вордпресс?(тема Jolene).Хотя бы примерно? Нужно чтоб сайт отображался одинаково на всех платформах: пк, смартфонах, планшетах. Уже месяц не могу найти ответ на этот вопрос...
Спасибо
Что могло бы быть проще, если бы в панели редактирования Вордпресса была возможность вставлять таблицы в пост. Но к сожалению WP не обладает таким нужным и простым функционалом.
Смотри-ка получилось с первого раза с этим плагином. Вот только сетка не отображается. Там есть такая функция? Поставил отображение рамки, но и её нет...
Хорошая статья, отличный способ вставить таблицу без плагина
Пробовал разные варианты вставки таблицы, ничего не получалось. Здесь наконец то просто и ясно. Автору спасибо за полезную информацию.