Как вставить таблицу в блог на WordPress

Привет всем! Вчера, публикую статью «Рейтинг SEO-блогов мира»(если честно, то статья получилась хреновая),  я столкнулся с проблемой добавления таблиц в статьях. Проанализировав все возможные варианты, я нашел для себя несколько вариантов решения этой проблемы.

1)  Плагин WP-Table Reloaded – с помощью этого плагина можно создавать и управлять таблицами непосредственно в самой админке WordPress (поддерживается версия 2.8 и выше). Таблицы можно импортировать и экспортировать из/в HTML, CSV и XML форматы. Вот ссылка, по которой можно скачать этот плагин.

Теперь поподробней о настройках WP-Table Reloaded. После его активации переходим по ссылке Инструменты-> WP-Table Reloaded. Главное меню плагина WP-Table Reloaded выглядит вот так:

Убедитесь что пункты меню отображаются на русском языке. Если это не так, то заходим в настройки плагина и внизу страницы находим пункт Язык плагина и изменяем его на русский(ru_RU) . Смотрим также , чтобы в настройках внешнего вида были отмечены эти пункты:

Не забываем Сохранить опции.

Если у Вас есть уже готовая таблица Excel, то её нужно сохранить в формате csv. После этого выбираем пункт Импортировать таблицу и указываем путь к нашему файлу.

Переходим в пункт Отобразить таблицы, где видим нашу загруженную таблицу. Нажимаем Предварительный просмотр, чтобы посмотреть, как выглядит итоговый результат. Если все нормально, то можно вставить таблицу в статью, для этого нужно всего лишь вставить строчку (вместо ID водим на номер таблицы, который указан возле таблицы)

[table id=<ID> /]

Поскольку мне не часто приходится вставлять таблицы в посты, то я решил не устанавливать этот плагин (чем меньше плагинов стоит у вас на блоге, тем лучше). Я решил выбрать один из следующих вариантов добавления таблицы в статью.

2) Вставить таблицу можно с помощью html и css. Не буду рассказывать все подробности этого метода, расскажу только про основы.

Для того, чтобы создать таблицу , нам потребуются 3 тега (html):

<table>…</table> этот тег означает начало и конец таблицы;

<tr>…</tr> обозначает начало и конец каждой строчки таблицы;

<td>…</td> обозначает начало и конец каждой ячейки в строчке.

Создадим для примера таблицу 3*3. Для этого переходим в редактор кода html:

И вставляем туда такой код:

<table border=”1″ cellspacing=”0″ cellpadding=”0″ width=”50px”>
<tr>
<td> Ячейка1  </td>
<td> Ячейка2 </td>
<td> Ячейка3 </td>
</tr>
<tr>
<td> Ячейка3  </td>
<td> Ячейка4 </td>
<td> Ячейка5 </td>
</tr>
<tr>
<td> Ячейка6  </td>
<td> Ячейка7 </td>
<td> Ячейка8 </td>
</tr>
</table>

Где border=”1″ означает что толщина границ в таблице равна 1 пикселю; cellspacing и cellpadding – расстояние между ячейками таблицы и отступы между содержанием ячейки и границей ячейки, width=”50px” – ширина таблицы равна 50 пикселям. В итоге получим такую вот табличку:

Таблицу можно оформить намного красивее с помощью css. Интересные материалы как можно использовать css Вы найдете на блоге Шакина.

3) Таблицу можно сделать за 2 минуты в онлайн-генераторах HTML-таблиц. Последним вариантом я как раз и воспользовался.

Надеюсь Вам помогла эта информация. Если будут вопросы — задавайте)

P.S. Хотите узнать, какие плагины я использую на своем seo блоге? Тогда читаем вот этот пост.

Понравилась статья? Подписывайтесь на RSS, чтобы быть в курсе всех самых интересных новостей моего блога!

Sidash

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