Как вставить таблицу из ворда в joomla
Обновлено: 04.07.2024
В предыдущей статье мы определились с тем, что создавать текст материала лучше в редакторе операционной системы компьютера. Это может быть, например, Word. Но при работе с сайтом есть специфические моменты, с которыми можно работать только в редакторе Joomla. В этой статье я расскажу про основные инструменты JCE по работе с текстом, изображениями и кодом.
Хочу заметить, что JCE содержит гораздо больше инструментов, чем я описал ниже, но рассказывать о простейших функциях, знакомых из Word’а, я не считаю нужным. В статье рассказывается только про уникальные для работы с html-редактором инструменты.JCE. Инструменты для работы с текстом.
Начнем с инструментов для работы с текстом. Предполагается, что исходный текст у нас уже готов и написан в Word’e. Прежде всего нужно запомнить, что простым копированием переносить текст из Word’ a в JCE нельзя! Это связанно с тем, что Word вносит в текст собственное, уникальное форматирование, которое, при простом копировании в JCE, вызовет хаос. Так как же тогда переносить текст? С этим вопросом мы подходим к первому инструменту JCE – «Вставка текста».
В редакторе этот инструмент выглядит следующим образом:
При клике по кнопке выпадает подменю, содержащие две опции:
- Paste – используется для вставки текста из Word’а и других редакторов. Вид редактора определяется автоматически. (В предыдущих версиях JCE кнопок вставки текста было несколько – для каждого из распространенных редакторов).
- Pasteasplaintext – вставка в виде плоского текста. При использовании этой опции все символы форматирования будут удалены при вставке, т.е. получится просто сплошной текст, что-то вроде вставки в блокнот.
После выбора опции откроется окно, как на рисунке:
В это окно мы вставляем наш текст из Word’а и жмем кнопку «Insert».
После этого текст с максимальным сохранением форматирования будет вставлен в JCE.
Следующим важным инструментом является выпадающий список с текстом «Paragraph»:
Важен он потому, что позволяет обрамлять нужные части текста нужными тэгами. Это, как считается, важно для SEO-оптимизации сайта. Из важных опций здесь:
- Paragraph – текст, к которому применена эта опция, обрамляется тегами <p></p>, что означает, что текст относится к текущему параграфу. Подобными тегами автоматически обрамляются все параграфы текста, вставленного из Word.
- Div – текст, к которому применена эта опция, помещается в контейнер Div. Применений у этой опции много, но людям, не знакомым с html и css, можно не обращать на нее внимания.
- Heading – текст, к которому применена эта опция, обрамляется тегами h1, h2, h3 и.т.д. Это означает, что данный текст является заголовком. Для поисковой оптимизации текста, все его заголовки и подзаголовки рекомендуют помещать в теги h.
Последним, крайне важным инструментом, являются таблицы. К счастью, JCE текущей версии уже умеет переносить таблицы из word’а автоматически, создавая при этом весь необходимый код. Функция эта, по истине замечательная. Кто уже имеет опыт работы с html-редакторами, прекрасно понимает почему. Для остальных расскажу. Раньше, когда этой функции не было, редактор не умел автоматически создавать таблицы и вместо них вставлялся просто текст ячеек. Т.е. для вставки таблицы приходилось создавать ее вручную, а затем заново заполнять данными. И хорошо, если таблица небольшая, но ведь она могла содержать и сотню строк. Тогда работа превращалась в ужас. Никому не хотелось создавать таблицы в html-редакторе вручную. При этом стали придумываться некоторые способы полуавтоматизации. Например, был способ с копированием таблицы из word’а в Excel с хитрым преобразованием ее в html-код. Сегодня, слава Богу, все эти хитрости уже не нужны. Процесс автоматизирован. Но иногда может быть удобно создать небольшую табличку прямо в html-редакторе, так что ниже рассмотрим инструмент для создания таблиц.
Создать таблицу можно с помощью кнопки «Inserts a new table»:
При клике по ней открывается следующее окно:
Здесь мы можем установить следующие опции таблицы:
- Cols – количество столбцов таблицы
- Rows – количество строк таблицы
Стоит заметить, что таблицу в html можно строить только однотипную. Т.е. количество ячеек в каждой строке будет одинаково. Если вам нужно, чтобы в первой строке было, например, 2 ячейки, а во второй – 3, то сначала нужно создать таблицу 2х2, а потом, во второй строке, в одну из ячеек вставить таблицу 1х2(1 строка, 2 столбца). Не очень удобно, но ничего не поделать. Таков язык html для таблиц.
- Cellpadding – расстояние от границы ячейки до ее содержимого
- Cellspacing – расстояние между ячейками таблицы
Опции Cellpadding и Cellspacing для таблиц аналогичны опциям margin и padding для div’ов.
- Alignment – определяет выравнивание содержимого таблицы(по левому краю, по центру, по правому краю)
- Border – ширина рамки таблицы
- Width – ширина таблицы
- Height – высота таблицы
- Class – CSS-класс, применяемый к таблице
- Tablecaption – место для заголовка таблицы. Если галочка установлена, над таблицей будет создана дополнительная строка, состоящая из одной ячейки, в которой предполагается размещение заголовка таблицы
Вкладка «Advanced» (в этой вкладке все опции не знакомы мне самому, поэтому опишу только основные):
- Id – уникальный идентификатор таблицы. Применяется в CSS;
- Style – CSS-стиль таблицы, заданный прямо в ее коде;
- Backgroundimage – изображение, которое будет использовано в качестве фона таблицы;
- Border color – цвет рамки таблицы;
- Backgroundcolor – цвет фона таблицы.
JCE. Инструменты для работы с кодом.
Первым, и самым главным инструментом для работы с кодом, который я очень люблю, является «Edit Code»:
При клике по этой кнопке открывается редактор html-кода с подсветкой:
Это крайне удобная штука, которая наглядно показывает структуру вашей страницы. Бывает, что у редактора происходит глюк и что-то отображается на сайте неправильно. В этом случае можно посмотреть html-код. Благодаря подсветке он читается легко и найти ошибку не составит труда. Это, конечно, относится лишь к тем, кто знаком с html и CSS.
Вторым инструментом, который, к сожалению, не входит в стандартный состав JCE, но многим будет крайне удобен, является JCE-плагин «RJ_InsertCode». Данный плагин позволяет вставлять в статью пример кода, оформленного в соответствии с языком, на котором он написан. Например, выше можно видеть, как отображает код плагин «Edit Code». Он красиво подсвечен и структурирован. Чтобы просто так вставить такой код в статью(под словом «вставить» я сейчас понимаю код, как текст, т.е. вставка не для исполнения кода, а для его показа пользователям) потребуется много усилий для работы со стилями. Плагин «RJ_InsertCode» применит все стили автоматически в соответствии с выбранным языком программирования(к которому относится код) и вставит его в красивом окошке с нумерацией строк. Выглядит это примерно так:
Плагин распространяется бесплатно и доступен здесь.
JCE. Инструменты для работы с изображениями.
Теперь перейдем, наверное, к самой интересной для web-мастеров функции JCE – вставке изображений. Эта тема действительно волнует многих, а также вызывает наибольшее количество проблем при использовании редактора.
Начнем с того, что в отличие от Word’a, в JCE, как впрочем и в любой другой html-редактор, нельзя просто так вставить изображение. Перед вставкой оно должно быть загружено на сервер в одну из папок Joomla. Это правило. Если его нарушить, изображение не будет показано. Конечно, соединяться с сайтом по FTP каждый раз, когда нужно вставить на сайт картинку, крайне неудобно. К счастью в JCE есть возможность этого не делать. Рассмотрим ее ниже.
Вставка изображений в JCE вызывается кнопкой «Insert/Edit Image», либо кликом правой кнопкой мыши по месту вставки изображения и выбором «Insert/Edit Image»:
При клике открывается следующее окно:
Функции, представленные здесь, довольно удобны и значительно облегчают работу по вставке изображений.
Прежде всего изображения нужно загрузить на сервер и «разложить по полочкам». В нижней части окна мы видим некоторое подобие файлового менеджера, в котором содержится файловая структура и файлы папки «images\stories» Joomla. Для редактора изображений JCE эта папка является корневой, но можно выбрать и другую корневую папку, задав ее в настройках JCE (подробнее об этом будет рассказано в одной из следующих статей про JCE). Справа есть 3 кнопки:
Благодаря им мы можем создавать подпапки и загружать изображения на сайт без использования FTP.
Для загрузки изображений нажимаем кнопку «Загрузить», при этом открывается следующее окно:
Здесь мы можем выбрать одно или несколько изображений, находящихся на локальном компьютере, задать, что делать в случае совпадения имен загружаемого и находящегося на сервере изображений(заменить или создать загружаемому уникальное имя), ну и, собственно, загрузить их.
После того, как изображения для сайта будут загружены, мы можем приступить к их вставки на сайт.
За один раз можно вставить только одно изображение. Если необходимо вставить сразу несколько изображений, следующих друг за другом, возможно, удобнее будет вставить одно, а затем, перейдя в просмотр html-кода, скопировать его код, вставить его и изменить имена файлов.
Но вернемся к вставке одного изображения. Раньше, чтобы вставить изображение, приходилось прописывать путь к нему на сервере. Это отнимало много времени и часто возникали ошибки, приводящие к потере еще большего количества времени. С JCE ситуация кардинально изменилась. Теперь достаточно лишь кликнуть по изображению, которое необходимо вставить в файловом менеджере изображений, и путь к нему будет прописан автоматически:
Теперь рассмотрим остальные опции:
Вкладка «Изображение»:
- URL – путь к изображению. Заполняется автоматически при клике по файлу изображения;
- AlternateText – альтернативный текст. Будет показан вместо изображения у пользователей, которые отключили изображения в браузере. Кроме того, считается, что этот текст положительно влияет на поисковую оптимизацию статьи;
- Dimensions – размер или разрешение изображения. Здесь вы можете задать размеры, которые будет иметь изображение в статье. Я советую вам выбрать для себя какую-то одну ширину всех изображений для сайта. Таким образом вы убьете сразу двух зайцев. Во-первых, вам не нужно будет беспокоится о том, что новое изображение может нарушить верстку сайта и вылезти за пределы экрана. Достаточно протестировать сайт с каким-то одним размером изображения, а в дальнейшем применять его ко всем новым, а во-вторых, когда все изображения одинаковой ширины, статьи выглядят гораздо аккуратнее. Кроме того, поставив галочку «Proportional» высота вашего изображения изменится автоматически, не нарушая его пропорции.
- Выравнивание – данную опцию лично я использую только тогда, когда требуется сделать обтекание изображения текстом. Как например картинка в самом начале статьи. Выравнивание изображения относительно страницы проще делать точно также, как и выравнивание текста – специальными кнопками редактора.
- Margin – отступ изображения от текста. Задается со всех четырех сторон. Если установлена галочка «Equal Values», достаточно задать только один отступ. Остальные три автоматически будут заполнены тем же самым значением.
- Граница – здесь определяется все, что связанно с границей изображения.
Вкладка «Rollover»(интересная вкладка, опции которой я хоть и понимаю как работают, но совершенно не представляю, для чего это может понадобиться):
Прежде всего, для активации нужно установить галочку в опции «Разрешить».
- Mouseover – путь к изображению, которое будет показано вместо текущего(выбранного во вкладке «Изображение»), при наведении на него курсора мыши.
- Mouseout – путь к изображению, которое будет показано при ВЫведении с него курсора мыши. Здесь нужно указывать путь первоначального изображения(выбранного во вкладке «Изображение»)
В обеих вышеописанных опциях пути можно указать автоматически, кликнув по файлам соответствующих изображений ниже.
При переносе документов из Word Office в Joomla я столкнулся с проблемой – при копировании документа таблицы ни в какую не хотят копироваться.
Раньше меня это не особо заботило, в подобных случаях я создавал пустую таблицу и поячеечно переносил информацию из Word-а.
Однако недавно мне пришлось обработать таблицу из нескольких сотен строк. Понятно, что ни о каком ручном переносе в этом случае не могло быть и речи.
Решение пришло само собой – нужно перегнать таблицу в HTML текст и вставить ее в режиме "Edit SRC Source” в Joomla документ. При сохранении doc файла в html создается слишком много мусорной информации, удалять которую не многим проще, чем пояеечно переносить таблицу.
Воспользуемся другим методом. Загрузим нашу таблицу в Excel, благо дело тут копирование работает как надо. Допустим, что у нас таблица состоит из трех ячеек, которые находятся в колонках A,B и C.
Функция СЦЕПИТЬ() объединяет строки, которые разделяются точкой с запятой. Как видите, мы формируем HTML код перемешивая теги с данными из первых трех колонок. Тег <tr> начинает новую строку, тег </tr> - заканчивает ее. Тег <td> начинает новую ячейку, тег </td> заканчивает ее.
После ввода формулы щелкаем указателем мыши по ячейке E1. У правом нижнем углу ячейки появится маленький квадратик. Перетаскиваем его вниз до конца таблицы. Выделяем всю колонку E и копируем ее. Открываем блокнот. Пишем <table> и вставляем скопированный текст, пишем </table>. Выделяем и копируем весь текст в блокноте.
Теперь переходим в редактор Joomla. На месте где должна быть таблица вводим текст «АААААААА» и нажимаем кнопку "Edit SRC Source” . Находим в исходном тексте нашей Joomla страницы слово АААААААА, удаляем его и вставляем текст из блокнота. Нажимаем кнопку Update. Все. Таблица вставлена.
В сегодняшнем уроке мы научимся добавлять на сайт, управляемый CMS Joomla, файлы формата pdf, webp, docx, xlsx, zip и т. д. А также рассмотрим вопрос как вставить файл в материал. То есть сделаем в материале ссылку на файл, чтобы пользователь мог, перейдя по этой ссылке, скачать документ, или архив.
К уроку прилагается видео. Посмотрев этот ролик, вы наглядно можете посмотреть, как всё выполняется на сайте Joomla с использованием редактора JCE. Но если у вас установлен по умолчанию какой-нибудь другой редактор, то принцип действий остаётся неизменным.
Также, в этом уроке, мы подробно рассмотрим каждый параметр настройки медиа-менеджера Joomla.
Видео как в Joomla прикрепить файл к материалу для скачивания пользователями
Медиа-менеджер Joomla. Настройка
По умолчанию Joomla поддерживает загрузку многих популярных форматов файлов и изображений: bmp, csv, doc, gif, ico, jpg, jpeg, odg, odp, ods, odt, pdf, png, ppt, txt, xcf, xls. Но как видите, загрузка современных форматов файлов, таких как webp, docx, или xlsx в Joomla по умолчанию не поддерживается. Так как же реализовать возможность загрузки этих форматов файлов на сайт? Давайте я опишу всё пошагово.
Шаг 1
В административной панели Joomla переходим в раздел «Медиа-менеджер»
Шаг 2
В медиа-менеджере переходим в раздел «Настройки»
Шаг 3
В поле «Разрешённые расширения» вводим через запятую без пробелов те расширения файлов, которые нам нужно разрешить для загрузки на сайт Joomla. То есть webp, docx, xlsx. Причём делаем это два раза. Сначала прописываем расширения с маленькой буквы, а затем те же расширения, только с большой буквы.
Шаг 4
Если возникает ошибка «Обнаружены недопустимые mime-типы», то необходимо в настройках установить значение «Проверять тип файла (MIME)» – Нет.
Давайте ещё более подробно рассмотрим каждый параметр настройки медиа-менеджера Joomla и разберёмся для чего предназначен и за что отвечает каждый пункт этих настроек:
Путь к каталогу с файлами (Path to Files Folder): путь, где расположены медиа-файлы, не относящиеся к изображениям, включая видео и файлы документов. По умолчанию это «/images». Вы можете создать новую папку для использования в Media Manager (Медиа-менеджере) и ввести здесь путь к этой папке.
Предупреждение . Не удаляйте и не переименовывайте существующую папку «/images» на вашем сервере. Эта папка и ее подпапки «images/banners», «images/M_images», «images/smiles» и «images/stories» используются Joomla. Удаление или переименование этих папок может привести к ошибкам.
Путь к каталогу с изображениями (Path to Images Folder): путь, где хранятся изображения. По умолчанию это «/images». Вы можете создать новую папку для использования в Media Manager и ввести путь к этой папке здесь. Если вы хотите получить доступ к этой папке из Media Manager, либо используйте значение по умолчанию, либо сделайте новую папку подпапкой папки «/images» в Media Manager.
Предупреждение : не удаляйте и не переименовывайте существующую папку «/images» на вашем сервере. Эта папка используется Joomla и удаление или переименование приведет к ошибкам.
Ограничение загрузки (Restrict Uploads): Эта функция ограничивает загрузку для пользователя с правами ниже «Менеджера». Значением по умолчанию является Да.
Проверять тип файла (MIME) (Check MIME Types): При этом используется MIME Magic или Fileinfo для проверки файлов. Значением по умолчанию является Да. Проверяя информацию MIME, вы помогаете пользователям не загружать вредоносные файлы на ваш сайт. Если получены недопустимые ошибки типа MIME, измените настройку на Нет.
Разрешённые расширения изображений (Legal Images Extensions): Это позволяет вам ограничивать типы изображений, которые могут быть загружены. Он работает путем проверки заголовков файлов изображений. По умолчанию Joomla! позволяет только BMP, GIF, JPG, PNG.
Запрещённые расширения файлов (Ignored Extensions): устанавливает, какие расширения игнорируются при проверке типа MIME и ограничивает загрузку. По умолчанию никакие расширения не игнорируются.
Разрешённые типы файлов (MIME) (Legal MIME Types): устанавливает список допустимых типов MIME для загрузки. По умолчанию Joomla автоматически включает некоторые стандартные типы файлов. Рекомендуется не трогать этот параметр, если вы не знаете, что делаете.
Недопустимые типы файлов (MIME) (Illegal MIME Types): устанавливает список недопустимых типов MIME для загрузки. По умолчанию Joomla автоматически блокирует типы text/html. Рекомендуется не трогать этот параметр, если вы не знаете, что делаете.
Эта статья будет посвящена разбору возможностей создания и вставки таблиц, в том числе таблиц excel на сайт.
Сначала рассмотрим, как сделать и вставить таблицу на сайте с помощью дополнений. Потом обратим внимание на отдельные онлайн сервисы для создания таблиц. Следующим шагом рассмотрим сервис, позволяющий делать таблицы более красивыми.
Далее посмотрим, как вставить на сайт таблицу из уже готового файла Excel. И в завершении создадим адаптивные таблицы для сайта с помощью сервисов Гугл и Onedrive, чтобы вставлять на сайт таблицы excel любого размера.
Прежде всего, хочется заметить, что не может быть одного единственного универсального решения для создания и вставки таблиц на сайте, который бы подходил для любых сайтов. Разные движки (Вордпресс, Джумла и т.п.), разные темы или шаблоны со своим дизайном, а также разные задачи, под которые создаются таблицы и разные размеры таблиц вынуждают каждого вебмастера подыскивать свой вариант создания таблиц.
И цель данной статьи состоит в том, чтобы помочь разобраться в разных возможностях, увидеть преимущества и недостатки каждого вида создания и добавления таблиц на сайте. И уже потом решать, какой вариант использовать в своем конкретном случае.
Плагины для создания и вставки таблиц на сайт
Для разных движков, будь то это WordPress, Joomla или любой другой, существуют дополнения или плагины, расширяющие возможности оформления страниц сайта. В зависимости от того, какой движок у вашего сайта, вы можете просто в поисковике набрать что-то типа: таблица в Водпресс или как создать таблицу в Joomla и получить кучу сайтов, которые делают подробный разбор разных плагинов.
Для движка Вордпресс, например, один из самых популярных плагинов для создания таблиц, это плагин TablePress.У каждого плагина есть свои собственные преимущества. Одни могут позволять быстро создавать простые таблицы на сайте, в других же придется повозиться, чтобы сделать красивые таблицы для сайта.
Но, также необходимо понимать, что у плагинов есть и свои недостатки.
Так, чем больше разных плагинов установлено на сайте, тем более нагруженным и уязвимым становится сайт.
Кроме того, не все плагины будут корректно работать с разными темами (шаблонами). Вот, к примеру, даже такой популярный плагин, как расширенный текстовый редактор CKEditor, тоже работает не безупречно.
В нем, конечно, есть много ценных возможностей, таких как изменение шрифта и его размера, а также выделение текста разным цветом. И, что касается нашей темы, то в этом плагине есть возможность создания и вставки таблиц:
Удобный плагин-редактор, что и говорить! Но, как я уже говорил, есть и недостаток у него с некоторыми темами. Например, при сохранении страниц в некоторых темах добавляются лишние переносы строк и убираются они только в режиме HTML. Конечно, можно приспособиться, но, если не хватает внимательности, то можно это пропустить и в оформлении страниц будут лишние переносы строк.
Также данный плагин не «дружит» с некоторыми другими плагинами, которые добавляют свои кнопки в стандартную панель редактора для быстрого и удобного вывода функций.
Вот, к примеру, есть плагин WP-Опросы для удобного создания и ведения опросов на сайте. При установке он автоматически встраивает кнопку Вставить опрос :
При нажатии по кнопке появляется дополнительное окно, в котором можно просто поставить ID опроса и нажать ОК :
Опрос вставится в то место страницы, где стоял курсор.
А узнать ID опроса можно в разделе, где находятся все созданные опросы:
Достаточно удобно! Но, при добавлении расширенного редактора CKEditor данная кнопка не работает, т.е. не выводит всплывающее окно (по крайней мере, в некоторых темах).
Конечно, здесь тоже можно приспособиться, просто вставляя вручную код , где цифра 2, это ID опроса.
Этот пример лишь подчеркивает, что не все может быть гладко с разными плагинами. И если в них действительно есть необходимость, то нужно выбирать, какой подойдет и можно ли приспособиться к некорректной работе, если она появится.
И, что касается создания и вставки таблиц, так уж ли необходимо использовать плагины или можно воспользоваться другими способами?! Рассмотрим другие способы.
Сайты для создания таблиц. Генераторы таблиц
Чтобы не тратить время на поиск, установку и вникание в функционал того или иного плагина для создания таблиц можно воспользоваться онлайн сервисами, которые формируют необходимую таблицу и предоставляют код таблицы для сайта.
Вот один из таких бесплатных сайтов для создания таблиц: Онлайн генератор html таблиц для сайта:
Функционал здесь минимален, но зато можно сразу же заполнить необходимые ячейки, а также объединить нужные ячейки в таблице.
И еще обратим внимание на один русскоязычный онлайн генератор таблиц :
Как видно на снимке выше, в этом генераторе даже можно задавать цвет и доп. эффекты!
Если захочется поэкспериментировать с созданием таблиц и этих сервисов будет недостаточно то, вот еще один сервис для создания таблиц: HTML Table Generator . Этот генератор таблиц англоязычный, но разобраться в нем просто, а если еще пользоваться браузером с автопереводчиком , то вообще никаких проблем.
Как вставить таблицу Excel на сайт
Что касается таблиц, то довольно часто бывает необходимо вставить уже готовую таблицу, созданную, например, в OpenOffice, Microsoft Excel, или Microsoft Word. Если таблица не слишком большая в ширину и нет объединенных ячеек, то можно воспользоваться бесплатным онлайн сервисом Tableizer .
Суть работы сервиса простая. Нужно выделить и скопировать необходимую готовую таблицу или ее часть:
Далее, нужно зайти в вышеупомянутый сервис, вставить скопированную таблицу и сгенерировать html код таблицы:
Затем смотрим, как будет выглядеть таблица, копируем готовый код таблицы:
И вставляем к себе на сайт.
Если таблица небольшая, то проблем не должно быть. Но если таблица широкая, в таком случае мы сталкиваемся с серьезным недостатком размещения таблиц на сайте, а именно с тем, что широкие таблицы могут не помещаться на странице.
Вот как это может выглядеть:
Как видно на снимке, таблица выходит на границы сайта.
Кстати и даже не слишком большие таблицы при просмотре сайта на мобильном устройстве (если сайт адаптивный) тоже могут выходить за рамки страницы.
Ну и как тогда быть с такими широкими таблицами и отображением таблиц на адаптивных сайтах?
Один из способов, это просто загружать готовые файлы на сайт и приводить ссылки для скачивания этих файлов с таблицами.
Но, есть более интересный способ, который рассмотрим далее.
Адаптивные таблицы для сайта через Гугл Диск
Загружаем в Гугл Диск нужный нам файл с таблицей (Создать -> Загрузить файл) и открываем доступ:
Включаем доступ по ссылке и копируем ее:
Теперь можно разместить на сайте, например, так:
Расписание Саратовского автовокзала (нажмите для просмотра)
И для самого владельца сайта использование Гугл Диска делает удобным добавление таблиц на сайт, ведь проще создать сложную таблицу в Excelе, чем «мучится» с их созданием на сайте с помощью разных кодов html.
Более того Гугл дает возможность использовать не просто ссылки на скачивание файлов, но также можно таблицы вставлять прямо на страницы сайта.
Заходим в Меню -> Публикация в Интернете:
Копируем предоставленный код во вкладке Встроить:
И размещаем на своем сайте в нужно месте.
Итак, размещаем код таблицы для сайта на странице и вот что получается (воспользуйтесь вкладками и областями прокруток):
Вот это уже очень даже красивая таблица получается! И пользоваться удобно, и в случае необходимости ее можно открыть в отдельном окне и вообще даже скачать к себе на компьютер.
Улучшаем использование таблиц
Если на одной странице необходимо вставить много таблиц, то для более удобного их использования посетителями можно воспользоваться плагином Shortcodes Ultimate и заключить таблицы в аккордион:
Адаптивные таблицы для сайта через Onedrive
По аналогии сервиса Гугл Диск, встроить таблицу на сайт можно с помощью сервиса от Майкрософт Onedrive .
Можно также воспользоваться дополнительными настройками внешнего вида таблицы ( 2 ):
Вот как выглядит встроенная таблица на сайте с помощью сервиса Onedrive:
Конечно, встраивание таблиц с помощью сервиса Onedrive уступает Гуглу из-за нестабильности и некорректного отображения некоторых элементов таблиц, но, возможно, в будущем Майкрософт улучшится в этом отношении.
Читайте также: