Как создать сайт на битриксе самому бесплатно пошаговая инструкция

В Битрикс24 вы можете создать сайт без помощи программиста. Вам не придётся прописывать десятки строк кода, просто выберите нужные блоки в конструкторе или используйте готовый шаблон для вашего бизнеса.

Как создать сайт

В меню портала слева выберите Сайты и Магазины. Во вкладке Сайты нажмите Создать.

Определитесь с шаблоном

Выберите готовое решение из каталога или используйте пустой шаблон:

Добавьте или измените блоки

Для создания блока кликните + Добавить блок там, где вы хотите его разместить.

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

Редактирование блоков

Если вы определились с шаблоном и хотите внести изменения в блок, то при наведении на него появятся две следующие панели.

Редактировать — основные настройки блока и его содержания.

Суперблок — режим, в котором можно управлять элементами внутри блоков сайта.

Дизайн — редактирование внешнего вида блока. Здесь вы также можете добавить изображение, созданное AI.

В меню Действия есть следующий список операций:

Опубликуйте сайт

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

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

Проверьте, как будет выглядеть ваш сайт на различных устройствах — мобильном телефоне, планшете и веб-версии.

Как только вы закончили редактирование, кликните Опубликовать сайт и ваш сайт станет доступен в сети. Если включён режим Автопубликация, то публиковать сайт не нужно.

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

Конструкторов сайтов огромное количество. Особенно, если мы говорим о зарубежных рынках. Что касается российского сегмента, то одной из популярных платформ остается Bitrix 24. Сегодня расскажем, кому она больше всего подойдет и как самостоятельно создать сайт на Битрикс 24.

На самом деле платформа хорошо подходит для бизнеса разных масштабов и отраслей. Битрикс хорошо подходит для любой организации, которой нужен инструмент, способный расти и меняться.  Помимо того, что на площадке Битрикс можно создавать сайты, вам также будет доступна CRM-система и другие функции для эффективной работы. 

Как создать интернет-магазин на Битрикс?

Есть несколько тарифов. Мы рассмотрим подробнее функционал бесплатного тарифа.

Введите email и нажмите «Начать бесплатно». Далее вы увидите следующую картинку:

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

Битрикс сделал создание интернет-магазина максимально легким для пользователя, правда, придется немного подождать.

Все необходимые функции здесь уже предусмотрены (в том числе, адаптивность для мобильных устройств и так далее). На первом этапе от вас потребуется только заполнить небольшую форму. Данные в ней можно будет потом при необходимости поменять:

Далее платформа покажет, как будут выглядеть карточки товаров.

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

Итак, после этого этапа мы получили готовую платформу магазина. Теперь можно ее настраивать под собственный стиль, загружать товары и так далее.

Дизайн главной страницы

В разделе «Магазины» в меню Битрикса у нас появился вновь созданный магазин. Нажимаем на него.

Здесь мы видим все существующие на данный момент разделы магазина. Начнем с главной.

В разделе редактирование будет возможность изменить изображение, цвет, добавить нужные блоки или удалить существующие, настроить шрифт и так далее.

Наполнение сайта товарами

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

Рассмотрим, как добавить на сайт товары. Для этого в главном меню Битрикс выбираем созданный магазин и нажимаем на раздел «Товары».

Нажимаем на «Создать товар» и далее появляется раздел, в котором необходимо заполнить данные о товаре, добавить картинки, цену и другую информацию.

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

Создание и настройка каталога товаров

Настройка детальной страницы товара

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

Настройка магазина

Для перехода к настройкам магазина нажмите на кнопку:

На вкладке с интернет-магазином у вас также будет доступен раздел CRM-маркетинг. Там вы можете организовать рассылку по клиентам, настроить сбор аудитории по пикселям или подобрать look-alike аудиторию, а также настроить рекламную кампанию (например, с целью повторных продаж).

Создание сайта

Помимо интернет-магазина на Битрикс можно создавать лендинги. Причем на платформе уже есть множество готовых шаблонов различных тематик.

Плюсы и минусы платформы

Начнем с минусов:

Вывод

Платформа Битрикс24 по своим возможностям является отличным вариантом для создания сайта. Битрикс подходит как для создания корпоративных сайтов, так и для сайтов электронной коммерции – интернет-магазинов. Система постоянно развивается и регулярно обновляется. Ее возможности со временем только расширяются и увеличиваются, в результате платформа хорошо подойдет и для тех компаний, которые планируют в будущем расширять свой бизнес и увеличивать трафик на сайт.

Хотите получать статьи и новости в удобном формате? Подписывайтесь на наш Телеграм-канал

10 октября этого года в Битрикс24 появилось новое обновление — Токио. Поменялся внешний вид карточек, добавили новые функции, но главное — в Битрикс24 появился конструктор сайтов. Про него и пойдет речь в этой статье.

Конструктор сайтов — механизм, который помогает сделать сайт, даже если вы ничего не знаете о программировании и веб-технологиях. Основная идея: есть заранее составленные шаблоны страниц, которые можно менять так, как это нужно. Если чего-то в шаблоне не хватает — добавляем, если лишнее — убираем. Вы «мышкой» перетаскиваете блоки и элементы страницы, меняете цвета и дизайн, пишете свои тексты вместо заготовок. В итоге получаете полноценный сайт, который вам нужен.

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

Свой домен — адрес вида vashakompaniya.ru. На платных тарифах можно сделать так, чтобы ваши сайты имели вид: nazvanie.vashakompaniya.ru, где nazvanie — название вашего битрикс-сайта. На бесплатном Битриксе это будет так: nazvanie.bitrix24.site. Смысл привязки своего домена в том, чтобы сразу было понятно, что новый сайт относится к вашей компании.

Зачем вам нужен битрикс24 сайт?

Сайты нужны для того, чтобы сообщить людям о том, что вы делаете. При этом неважно, продаете вы щебень вагонами или чините компьютеры на дому — в любом случае вам есть, что сказать клиентам. Наверное, вы и сами замечали, что за новой информацией мы идем в интернет. Точно так же делают ваши клиенты, когда хотят решить свои проблемы. Грубо говоря, если вас нет в сети — о вас не узнают и не придут к вам.

Сайт — это необязательно интернет-магазин или крупный региональный портал, иногда достаточно и одной страницы. Даже она сообщит клиентам, чем вы им можете быть полезны. Если человек ищет, где заказать вкусные торты на свадьбу ручной работы из марципана, а вы как раз про это рассказываете на сайте, он вам позвонит. Сайт — дополнительный и неограниченно мощный источник входящих обращений в компанию.

Если у вас есть свой бизнес или вы оказываете услуги — вам нужен сайт. Без него создать стабильный поток клиентов не получится.

С чего начать?

После обновления Токио у вас два варианта: заказать сайт в интернет-агентстве или сделать его самому сразу из Битрикс24. Рассмотрим второй вариант.

Чтобы сделать свой сайт, вам будут нужны две вещи: свой портал Битрикс24 и доступ в Интернет. Если у вашей компании еще нет портала, зарегистрируйте его. Теперь заходим в свой Битрикс24, в левом главном меню, ближе к концу, будет ссылка на Сайты. По ней попадаем в раздел, где видим кнопку создания сайта и те страницы, которые мы уже сделали. Выбираем Создать сайт.

Система сразу предложит все шаблоны, которые у нее есть. Выбираем тот, который лучше всего всего подходит для наших задач. Их все, кстати, делали те же ребята из компании 1С-Битрикс, которая продает лицензии на профессиональные системы управления сайтами. Поэтому с точки зрения дизайна и внешнего вида они все выглядят сбалансированно и адекватно.

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

Остановимся на шаблоне с недвижимостью.

Сразу появляется уже готовый сайт с заготовками текста и шаблонными фотографиями. Наша задача — наполнить страницу своими текстами и изменить фотографии на свои.

Первая страница выглядит пока так:

Теперь пройдем все по порядку, начиная с самого верхнего меню.

Настройки

Мы видим, что находимся в разделе Мои сайты, наш сайт называется Недвижимость и первая страница на нем тоже называется Недвижимость. Все эти названия можно заменить на свои в настройках сайта и страницы.

Дальше идут три переключателя режимов представления. Можно сразу посмотреть, как увидят сайт посетители с планшетами или на телефоне.

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

Следующий пункт меню — настройки страницы. Значок карандашика означает, что этот текст или значение можно изменять.

Что тут можно сделать:

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

Последнее — самое крутое. Это значит, что если вам что-то не нравится в шаблонном дизайне или вы хотите, чтобы вид страницы был похож на ваш основной сайт, то это можно сделать. Единственный минус: нужно знать веб-программирование и CSS или обратиться к специалистам, они сделают, как нужно.

По большому счету, этих настроек достаточно, чтобы сделать сайт таким, как вам хочется. И в этом особенность Битрикс.сайтов — работать становится проще.

Посмотрим теперь настройки самого сайта (Действия → Настроить сайт):

И вот здесь можно донастроить все остальное: аналитику, настройки робота, подключить виджет обратной связи (уже связанный с вашей CRM) и ключи от карт Google, и выбрать вид конкретной страницы.

Редактирование страниц

В чем основная функция конструктора сайтов? В том, чтобы дать человеку возможность сделать все, что он хочет, со своим сайтом. И в Битрикс24.Сайтах это есть.

Хотите поменять цвет фона — пожалуйста, не нужен целый раздел — убирайте. Это значит, что все, что не нравится на сайте, можно убрать, а все, что нужно — оставить или добавить.

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

В каждом блоке можно:

• менять содержимое;
• менять дизайн;
• менять блоки местами;
• скрывать блоки или удалять их.

Когда наводим мышку на любой блок, видим кнопки управления: добавление блока, режим дизайна и редактуры, кнопки порядка блоков и действий с ними.

Начнем с дизайна.

Видимость блока на устройствах нужна для того, чтобы, например, с компьютера и планшета этот раздел был виден, а с телефона — нет. Это полезно, когда вы знаете, что с телефона блок будет выглядеть некрасиво, мелко или неудобно им будет пользоваться. Чтобы не портить впечатление от всего сайта, такой блок можно показывать тем, кто смотрит сайт на большом экране и скрывать для всех остальных.

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

Редактура содержимого. Тут все круто, просто и понятно, прицепиться не к чему. Менять можно практически все.

Любой текст можно форматировать, менять цвет, оформление и стиль.

Даже если это сложный блок с обилием информации, его тоже можно править. Рассмотрим на примере этого блока с карточками:

Посмотрим, что можно изменить или настроить:

Как видим, настраивается каждый элемент отдельной карточки вплоть до выбора того, в каком окне открывать новую страницу. И в этом вся мощь Битрикс24.Сайтов — тонкая настройка каждого элемента. А если что-то не получается в конструкторе сделать так, как хочется, вспоминаем, что есть CSS, где можно прописать любые изменения.

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

Блоки сгруппированы по смыслу, в каждой группе несколько вариантов. Есть из чего выбрать.

Например, мы хотим добавить раздел с нашими преимуществами. Выбираем из большого списка тот, что нам больше всего понравился.

Если нужно, он точно так же настраивается, как и остальные, чтобы все смотрелось в едином стиле.

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

Блоки можно двигать вверх и вниз, нажимая на эти стрелки:

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

Если одной страницы мало, создавайте еще. Для этого снова идём в боковой раздел Сайты, выбираем наш сайт и нажимаем Новую страницу.

С ней можно делать все то же самое, что и с первой страницей: наполнять нужным вам текстом и настраивать внешний вид. При этом шаблон можно выбрать другой.

Интеграция с CRM

Здесь все тоже просто: все формы и чаты на сайте уже связаны с вашей CRM.

Когда кто-то напишет вам в чат, закажет звонок или заполнит форму обратной связи — он сразу попадет в вашу базу. Теперь у вас есть его данные и есть все возможности, чтобы с Битрикс24.CRM сделать его своим клиентом.

Посмотрим на примере формы с заказом:

У каждого блока с формой свои настройки:

Можно использовать ваш дизайн формы:

Если выберем этот вариант, форма будет выглядеть точно так же, как у вас на основном сайте:

Можно поменять внешний вид формы и ее поведение:

Что будет, если выберем вариант Скачивание учебника:

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

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

Битрикс.Сайты – потрясающе мощный и бесплатный инструмент для повышения продаж. Начинайте его использовать уже сейчас.

И еще. 

Для тех кто хочет попробовать bitirx24 сайты, но не хочет тратить время и разбираться в том, как правильно их настраивать и оформлять можно просто заполнить форму внизу. Специалисты Веб-Центр помогут вам создать свой битрикс24 сайт.

Веб-разработчик, запустил более 20 крупных проектов, включая онлайн-франчайзинг «Позитроника», сайт фабрики «Яршинторг» и многие другие.

ВРЕМЯ ПРОСМОТРА

1 ч. 16 мин.

• 55% компаний в России используют 1С‑Битрикс — услуги разработчиков на этой платформе востребованы.
• Быстрое решение типовых задач и уже готовые решения от Битрикса. Например, онлайн-кассы легко интегрируются с платёжными системами и сервисами доставки.
• Много возможностей. Битрикс включает в себя блоги, форумы, каталоги разных видов, интеграцию с социальными сетями и многое другое. Также есть библиотеки, которые позволяют додумывать и создавать свои расширения.
• Сжатые сроки изучения. Чтобы начать работать с Битриксом, достаточно за 2,5–3 месяца пройти теорию — и можно сразу практиковаться, работая с реальными сайтами и наращивая свои знания.
• Универсальность. На Битриксе создаются и сайты-визитки, и крупные интернет-магазины.
• Документация на русском языке. Она есть в открытом доступе, её легко изучать.
• Большое комьюнити специалистов. Новичку всегда легко найти ответы на свои вопросы или дополнительную информацию, а значит, легче развиваться.

Представьте команду разработчиков, которая решила создать интернет-магазин. Она разработала сайт на чистом PHP, но потом взялась за новый. Тогда команда поняла, что часть функций и модулей уже написаны для первого сайта.

Фреймворк — структура, в которой отдельными модулями выделены, например, визуальная составляющая и функциональный код. Когда есть фреймворк, можно не писать сайт с нуля, а управлять им с помощью уже готовых блоков. Этот продукт представляет собой CMS — систему управления контентом на сайте.

Все сайты на Битриксе состоят из трёх компонентов:

• Модель — функции и классы, которые обращаются к базе данных.
• Представление — шаблон, с помощью которого на страницы выводится то содержимое, которое мы хотим увидеть, когда обращаемся к базам данных.
• Контроллер — сама страница сайта с компонентами.

Поработаем с демосайтом 1С-Битрикс. Перейдите по ссылке bitrixlabs.ru, нажмите «Создать демосайт», укажите «Интернет-магазин» и установите. После окончания установки увидите вот такую страницу. Это ваш первый интернет-магазин на 1С-Битрикс.

Здесь редактируется любой элемент. Например, наведите курсор на логотип и нажмите на «Изменить область».

В открывшемся окне замените логотип. Таким образом можно отредактировать все элементы на странице.

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

Цель разработчика на 1С-Битрикс — настроить работу сайта так, чтобы администратору сайта или владельцу бизнеса было легко вносить небольшие изменения: редактировать цены и описания товаров, размещать контент, управлять внешним видом и так далее.

Познакомимся с системой изнутри. На панели сверху выберите раздел «Администрирование».

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

Этот раздел состоит из нескольких десятков элементов. Рассмотрим наиболее важные.

Здесь показана структура файлов, где можно редактировать их содержимое и так далее.

Здесь расположены товары и категории.

Чтобы перейти в конкретный товар, выберите категорию и нажмите на название. У товаров есть различные свойства, они уже прописаны в системе.

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

В демоверсии интернет-магазина на 1С-Битрикс в «Маркетинг» загружены все основные модули для решения маркетинговых задач: пульс конверсии,
А/В-тестирование, email-маркетинг и так далее.

Чтобы поставить подобный набор, к примеру, на WordPress, нужно найти хорошее решение, протестировать его, настроить под свой сайт. В Битриксе эти решения уже готовы — это удобно и для разработчиков, и для владельцев бизнеса.

Этот раздел доступен только для интернет-магазинов. Здесь есть вся информация по заказам, оплатам, поставкам, налогам и многое другое. А ещё — уже настроенная онлайн-касса.

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

Тут легко посмотреть и проанализировать данные о посещаемости сайта и эффективности рекламных кампаний. На практике аналитикой в 1С-Битрикс практически не пользуются, потому что Google Analytics имеет больше возможностей.

Здесь находится каталог решений для 1С-Битрикс: различные модули, инструменты, готовые интернет-магазины. Разработчик может создать какое-либо решение для Битрикса и выставить его на продажу через маркетплейс.

Здесь представлен полный список настроек сайта: валюты, серверы, масштабирование, производительность, поиск по сайту и многое другое.

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

Благодаря встроенным решениям работу с Битриксом легко освоить. Рассмотрим несколько простых действий с системой.

Перейдите во вкладку «Сайт → Создать страницу».

Введите заголовок страницы и отметьте нужные пункты:

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

В следующем окне добавляются описание страницы и ключевые слова, Title и файлы robots — эти данные влияют на поисковую оптимизацию сайта.

Далее откроется окно редактирования страницы. Здесь размещают контент — текст, видео, фотографии, а также встроенные решения, сервисы и инструменты.

Чтобы открыть встроенные компоненты и сниппеты Битрикса, нажмите на указатель сбоку. Когда панель сниппетов скрыта, указатель находится там, куда направлена стрелка на скриншоте.

Разработчик будет работать с кодом PHP. Чтобы перейти в код, нажмите на иконку слева и выберите соответствующий вид редактора, как показано на скриншоте.

Мы разобрали базовые навыки работы с 1С‑Битрикс. Теперь рассмотрим, какие ошибки чаще всего допускают новички и почему.

• Переоценивать книги. Книга не даст обратной связи, не ответит на вопросы, не решит проблему.
• Думать, что одно решение подходит под разные задачи. Не все решения Битрикса стоит принимать как верные, всегда нужно учитывать нюансы конкретного интернет-магазина. В документации указано не всё, понимание этих нюансов приходит только с опытом.
• Терять время на неэффективное обучение. Чтобы стать хорошим разработчиком без посторонней помощи, потребуется 6–7 лет и очень много удачи.

Как зарабатывать больше с помощью нейросетей?
Бесплатный вебинар: 15 экспертов, 7 топ-нейросетей. Научитесь использовать ИИ в своей работе и увеличьте доход.
Узнать больше