Excel на сайте в 2026: как вывести таблицу и собирать заявки

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

Что именно вы хотите связать

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

• Показать посетителям данные, которые вы ведёте в таблице (прайс, расписание, наличие), причём так, чтобы страница обновлялась вместе с ней.
• Один раз перенести готовый файл в вёрстку: состав, характеристики, тарифы, которые меняются раз в полгода.
• Собирать в таблицу то, что люди заполняют на сайте: заявки, записи, ответы анкеты.
• Отдать сам файл на скачивание или заменить таблицу калькулятором на странице.

Сама вёрстка таблицы (шапка, границы, сортировка, поведение на телефоне) разобрана отдельно, в материале про таблицу на странице сайта. Здесь речь про файл и таблицу как источник и приёмник данных.

Показать таблицу на сайте: публикация ссылкой

Самый быстрый путь без кода: держать данные в Google Таблицах и опубликовать лист в интернете. На странице окажется живая копия, которая меняется вместе с оригиналом.

1. Откройте таблицу и выберите «Файл» → «Опубликовать» → «Опубликовать в интернете».
2. Укажите, что публикуете: всю книгу или один лист, и выберите формат публикации.
3. Перейдите на вкладку встраивания и скопируйте готовый код <iframe>.
4. Вставьте код в то место страницы, где должна стоять таблица, и задайте width="100%".
5. Проверьте страницу на телефоне: если таблица шире экрана, оберните <iframe> в блок с overflow-x: auto, чтобы ездила она, а не вся страница.

Изменения в исходной таблице автоматически попадают в опубликованную копию, автопубликацию можно отключить, а саму публикацию отменить в разделе «Опубликованные материалы и настройки» (справка Google). Если аккаунт рабочий или учебный, публикацию файлов может запретить администратор.

У Microsoft есть похожая кнопка: у книги, которая лежит в OneDrive, в веб-интерфейсе появляется пункт встраивания с генерацией <iframe> (инструкция Microsoft). Из России путь неудобный: оплатить подписку российской картой не выйдет, а корпоративные аккаунты компания отключала от облачных сервисов ещё в 2024 году (РБК).

Данные из таблицы своим кодом: ссылка на CSV

Встроенная таблица так и выглядит на странице: вставкой со своими шрифтами и рамками. Если данные должны быть частью дизайна, забирайте их в формате CSV и рисуйте таблицу своей вёрсткой.

У таблицы Google есть служебный адрес выгрузки листа:

https://docs.google.com/spreadsheets/d/ИДЕНТИФИКАТОР/export?format=csv&gid=0

Идентификатор берётся из адреса таблицы, gid это номер листа (он тоже виден в адресе). Чтобы ссылка открывалась без входа в аккаунт, у таблицы должен быть доступ по ссылке или публикация.

Разбирать полученный текст руками не нужно, это делает библиотека Papa Parse: она скачивает файл по адресу и отдаёт готовый массив строк (papaparse.com).

Papa.parse(url, {
  download: true,
  header: true,
  complete: function (res) {
    render(res.data); // ваша функция отрисовки таблицы
  }
});

Если исходник это именно файл .xlsx, а не CSV, его читает SheetJS: библиотека разбирает книгу Excel прямо в браузере и отдаёт содержимое листов в виде обычных объектов. Открытая версия распространяется под лицензией Apache 2.0, а браузерная сборка раздаётся с собственного CDN проекта, а не из npm (репозиторий SheetJS).

Писать код с нуля не обязательно: задача формулируется одним абзацем, ИИ-агент собирает страницу целиком:

Есть ссылка на CSV с колонками: Товар, Цена, Наличие.
Сделай на странице таблицу: заголовки из первой строки,
поиск по названию, сортировка по цене, адаптив под телефон.
Данные грузить один раз при открытии, пока грузятся показывать
надпись «Загружаем». Если ссылка недоступна, показать сообщение,
а не пустую таблицу.

По теме: Запрет сайта: как закрыть доступ и индексацию в 2026

Файл превратить в готовую таблицу один раз

Когда данные меняются раз в полгода, тянуть их скриптом незачем: проще один раз получить готовую разметку и вставить её в страницу.

• Десктопный Excel умеет сам: «Файл» → «Сохранить как» → тип «Веб-страница». Разметка получается тяжёлой, со служебными стилями Office, которые приходится чистить.
• Скопировать диапазон и вставить в чат нейросети с просьбой сверстать таблицу. Рабочий вариант для нескольких десятков строк.
• Отдать нейросети сам файл: современные модели читают .xlsx и .csv, ограничения по объёму и форматам мы собирали в разборе работы нейросети с файлами.

У разового переноса есть плюс: такая таблица это обычный текст страницы, поисковики видят её содержимое. Внутри <iframe> данные для них чужая страница.

Обратный путь: заявки с сайта попадают в таблицу

Вторая половина задачи зеркальна: человек заполняет форму на сайте, а строка появляется у вас в таблице. Четыре способа по возрастанию сложности.

1. Google Форма. В редакторе на вкладке ответов привяжите таблицу (новую или существующую), дальше каждый ответ падает отдельной строкой. Форма встраивается на страницу тем же <iframe>.
2. Яндекс Формы. Ответы видны в интерфейсе, выгружаются файлом и складываются на Яндекс Диск, а в интеграциях настраивается HTTP-запрос на ваш адрес (справка Яндекс Форм).
3. Своя форма на сайте плюс обработчик в Google Apps Script: скрипт с функцией doPost публикуется как веб-приложение и получает данные формы обычным POST-запросом (документация Apps Script).
4. Готовые интеграции конструктора или сервиса автоматизации: если форма уже стоит на платформе, у неё обычно есть отправка вебхука или прямая связка с таблицами.

Обработчик для третьего варианта помещается в несколько строк:

function doPost(e) {
  const sheet = SpreadsheetApp.openById('ID_ТАБЛИЦЫ').getSheets()[0];
  const data = JSON.parse(e.postData.contents);
  sheet.appendRow([new Date(), data.name, data.phone, data.comment]);
  return ContentService.createTextOutput('ok');
}

Заведите отдельный лист для сырых строк, куда скрипт пишет данные как есть, и второй для формул и сводок. Через месяц захочется поменять расчёты, и приём заявок при этом не сломается.

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

По теме: Программа для создания сайта в 2026: что ставить на компьютер

Скачать файл и калькулятор вместо таблицы

Иногда от сайта нужно не показать данные, а отдать файл: прайс, шаблон, бланк. Часть простая, но и в ней есть мелочи.

• Положите файл рядом со страницами (например, в папку /files/) и поставьте ссылку <a href="/files/price.xlsx" download>Скачать прайс</a>. Атрибут download просит браузер сохранить файл, а не пытаться его открыть.
• Подпишите рядом формат и вес («xlsx, 240 КБ»): с мобильного интернета по этой строке решают, качать сейчас или нет.
• Публичная ссылка Яндекс Диска годится как временное решение, но без платного тарифа у неё есть суточный лимит скачиваний (справка Яндекс 360).
• Обновляя файл, меняйте имя (price-2026-08.xlsx), иначе часть посетителей получит старую версию из кэша браузера.

Отдельная развилка: если таблица нужна человеку только чтобы посчитать (стоимость доставки, метраж, платёж), показывать её незачем. Формула переносится в форму с полями и результатом, и разбираться в чужих ячейках не приходится. Такую страницу ИИ-агент собирает за один заход:

Собери калькулятор стоимости на одной странице: поле «площадь»
и выбор покрытия из трёх вариантов с разной ценой за метр.
Результат пересчитывается сразу при вводе, без кнопки.
Цены вынеси в один объект в начале скрипта, чтобы я правил их сам.

Кириллица, кодировка и лишние данные

Почти все проблемы этой связки приходятся на две вещи: кодировку файла и данные, которых в открытом доступе быть не должно.

• Русский Excel по умолчанию сохраняет CSV в кодировке Windows-1251 и с разделителем «точка с запятой». Скрипт на странице ждёт UTF-8 и запятую, поэтому кириллица превращается в нечитаемые символы. При сохранении выбирайте вариант с UTF-8 (разбор кодировок в Excel).
• Обратная сторона: файл в UTF-8 без BOM сам Excel открывает как Windows-1251, и кириллица ломается уже у получателя. Файл для людей сохраняйте в UTF-8 с BOM, файл для скрипта без него.
• Разделитель задавайте в коде явно, а не надейтесь на угадывание.
• Персональные данные (телефоны, адреса, ФИО клиентов) в опубликованную таблицу класть нельзя: публикация открывает файл любому по ссылке, а такие страницы попадают в индекс поисковиков. Публичные ссылки на чаты нейросетей находились в поиске ровно поэтому (пример).
• Публикуйте отдельный лист-витрину, а не рабочий файл: в опубликованный лист попадает всё, что на нём есть, включая черновые строки внизу и колонку с себестоимостью.
• Если сайт принимает данные людей, нужны согласие на обработку и политика конфиденциальности, это разобрано в материале про регистрацию и формы на сайте.

Частые вопросы

Можно ли вставить сам файл xlsx, чтобы он открывался прямо на странице?

Нет, файл .xlsx браузер скачивает, а не показывает. На странице открывается либо опубликованная онлайн-копия, либо таблица, которую нарисовал ваш код по данным из файла.

Данные на сайте будут обновляться сами?

Через публикацию и через ссылку на CSV, да: вы правите исходник, страница показывает новые значения. Через разовую вставку разметки, нет: таблицу придётся переносить заново.

Нужен ли для этого хостинг, сервер и база данных?

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

Что делать, если сервисами Google пользоваться нельзя?

Ведите данные в Яндекс Документах или в обычном файле, выгружайте .csv в UTF-8 и кладите его рядом с сайтом. Скрипт на странице читает такой файл по адресу вида /data/price.csv точно так же, а обновление данных превращается в замену одного файла.