Как изменить дизайн сайта

Чтобы изменить дизайн сайта, нужно выбрать другую тему дизайна или изменить существующую тему. Тема дизайна — это набор HTML-, CSS- и других файлов, формирующих внешний вид страниц сайта.

1. Выбрать другую тему дизайна

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


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


2. Изменить тему дизайна

Темы дизайна можно изменять самостоятельно: с помощью настроек или редактируя исходный код файлов.

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

Если доступных настроек недостаточно, вносите изменения в исходный код файлов темы (HTML и CSS) в секции «Шаблоны».

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

Как отменить все изменения в теме дизайна »
Видео: как пользоваться редактором дизайна »

16 комментариев

  • +1
    getman398 getman398 25 ноября 2016 12:20 #

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

    • +1
      Михаил Ушенин Михаил Ушенин Webasyst 25 ноября 2016 14:34 #

      Имеются в виду права доступа к директории, в которой сохраняются изменённые вами файлы дизайна на сервере: wa-data/public/... Нужно увеличить для них права доступа или изменить настройки прав доступа для пользователей операционной системы сервера.

    • +1
      Vaycheslaff Vaycheslaff 21 сентября 2017 12:34 #

      Как можно изменить наименование магазина и режим работы (которые автоматически берутся системой в Инсталлере) на копии темы Дефолт 3 (необходимо всвязи с открытием второй витрины) Какой код и на что менять?

    • +1
      Виталий Фунтов Виталий Фунтов 22 ноября 2017 19:09 #

      Если в программировании и HTML нет понимания совсем! можно ли самому создать сайт по своим хотелкам? думал это конструктор для всех, но для большинства изменений нужно менять коды.. а без этого никак?

      • +1
        Михаил Ушенин Михаил Ушенин Webasyst 23 ноября 2017 09:53 #

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

      • +1
        Андрей С Андрей С 12 января 2018 14:55 #

        Доброго дня! Хотим приобрести Вебасист. Интересует пару моментов: как вообще удалить картинки с сайта (чтобы даже картинки по умолчанию не отображались), удалить кнопку "купить" и поставить оповещение о наличии товара на страницу с товарами. За ранее спасибо.

      • +1
        Константин Божеев Константин Божеев 17 января 2018 15:18 #

        Необходимо сделать 2 шаблона для карточки товара, как это сделать

        На сайте уже есть много товаров, и они выводятся по обычному шаблону

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

      • +1
        Карема Джахбарова Карема Джахбарова 23 января 2018 10:18 #

        Как внести изменения в дизайн сайта если в шаблоне нет файла css?

        • +1
          Михаил Ушенин Михаил Ушенин Webasyst 23 января 2018 11:24 #

          Редактируйте те файлы, которые есть в теме дизайна. Если нужно, создавайте новые файлы с помощью редактора дизайна и сохраняйте в них ваш CSS-код, чтобы не мешать его вместе с кодом HTML и Smarty.

          Возможно, в вашей теме дизайна есть CSS-файл, но его не видно в списке файлов в левой колонке. Так бывает, если разработчик темы дизайна забыл добавить имя такого файла в XML-манифест темы — файл theme.xml. Если вы знаете имя "невидимого" CSS-файла, то откройте любой видимый файл и в адресной строке браузера замените его имя на имя нужного вам CSS-файла. Если файл с таким именем есть в папке темы, от он откроется и будет доступен для редактирования.

          Если вы не знаете имя CSS-файла, поищите его в исходном коде файла index.html или других файлов, которые могут подключаться с помощью команды {include file="..."} внутри index.html.

        • +1
          Anton Anton 14 февраля 2018 10:44 #

          Добрый день. Можете ли подсказать каким образом можно добавить телефон и время работы в шапку сайта в теме Дефолт? Вроде бы объем работы должен быть небольшим, чтобы нанимать специалиста по програмированию. Можете ли дать какой-то участок кода, который нужно только вставить в шаблон для корректного отображения данной информации? В общем это важный фактор для повышения конверсии, а почему-то разработчики темы Дефолт этого до сих пор не сделали.

          • +1
            Михаил Ушенин Михаил Ушенин Webasyst 14 февраля 2018 15:38 #

            Самый простой вариант: в самом начале файла header.html добавьте

            <figure class="store-info">
                <h3>
                    <span itemprop="telephone">{$wa->shop->settings('phone')}</span>
                    {if $wh = $wa->shop->settings('workhours')}<br>
                        <span class="hint">{$wh.days_from_to}{if $wh.hours_from && $wh.hours_to} {$wh.hours_from}—{$wh.hours_to}{/if}</span>
                    {/if}
                </h3>
                <meta itemprop="address" content="{$wa->shop->settings('country')}">
                <meta itemprop="currenciesAccepted" content="{$wa->shop->currency()}">
            </figure>

            Дальше экспериментируйте.

          • +1
            Andrey And Andrey And 22 февраля 2018 23:14 #

            Здравствуйте, подскажите пожалуйста какие знания необходимы кроме HTML и CSS для создания темы с нуля? на чем написан?

            Добавить комментарий

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