ПРОГРАММА РАСКРАСКА

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


Программа подходит для любого сайта созданного на OpenCart, ocStore, MaxyStore, Magento, PrestaShop, PHPShop, OsCommerce, ZenCart, Jigoshop, WooCommerce, Joomla, WordPress, NetCat, uCoz, UMI, HostCMS, Amiro и других популярных CMS, а так же для простых сайтов созданных на HTML без использования CMS. Раскраску можно использовать на одном домене для нескольких сайтов.

  • При помощи Раскраски Вы сможете создать уникальный дизайн для Вашего сайта.
  • Все Ваши настройки сохраняются. Вы в любой момент можете запустить Раскраску снова и сделать Ваш дизайн еще лучше.
  • В программе есть вкладка "ДОБАВИТЬ", при помощи которой добавляться новые элементы на Ваш сайт.
  • Эта опция добавляет безграничные возможности для индивидуализации Вашего интернет ресурса.
  • Все изменения, которые Вы производите в панели управления Раскраски, отображаются сразу на Вашем сайте.
  • Вы можете визуально подбирать параметры для каждого элемента Вашего сайта.
  • При помощи программы Раскраска можно организовать одновременное редактирование дизайна сайта несколькими пользователями, находящиеся в разных частях света.
  • Для новичков есть прекрасная возможность без всяких сложностей окунуться в мир CSS стилей.

Для перевода видео используйте субтитры на Вашем языке.

Посмотрите это короткое видео и Вы убедитесь, как просто использовать программу Раскраску.

Посмотрите как просто добавлять новые элементы.



Посмотрите возможности программы Раскраска на примере создания одностраничного сайта.



Посмотрите возможности программы Раскраска на примере добавления Google Панорамы интерьеров.


Для работы c программой, используйте последние версии браузеров Chrome или Firefox



УСТАНОВКА


Файлы программы скопируйте на Ваш хостинг.

Подключите программу Раскраска.

Установите секретный пароль для запуска программы.

Подробная установка программы с примерами, описана в файле read.txt при покупке программы.

ЗАПУСК РАСКРАСКИ


Программа запускается прямо на Вашем сайте. Это очень удобно.

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

НАЧАЛО РАБОТЫ


  • Запустите программу Раскраска.
  • Перейдите на страницу Вашего сайта, на которой Вам будет удобно работать.
  • Поставьте галку "не переходить по ссылкам" в панели управления.
  • Кликнете по элементу, который Вы планируете изменить. Выбранный элемент подсветиться красной рамкой из точек. Селектор элемента появиться в верхнем поле.
  • Поставьте галку "подтвердить выбор селектора" в панели управления. Через несколько секунд рамка исчезнет.
  • Можно приступать к изменению элемента.

Для выбора элементов можно использовать дополнительно псевдоклассы :hover и :nth-child(n)

Псевдокласс :hover позволяет определять стиль элемента при наведении на него курсора мыши.

Псевдокласс :nth-child(n) позволяет выбрать для редактирования элементы на основе нумерации в дереве элементов.

Примеры

.box-category li:nth-child(4) выберет только четвертый элемент li

.box-category li:nth-child(1) выберет только первый элемент li

.box-category li:nth-child(3n) выберет каждый третий элемент li

.box-category li:nth-child(2n) выберет каждый второй элемент li


и тому подобное.

ЭЛЕМЕНТЫ УПРАВЛЕНИЯ


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

  • При клике на кнопке "СБРОСИТЬ ВСЕ НАСТРОЙКИ" все оформление, сделанное Вами при помощи программы Раскраска - удалиться. Добавленные Вами элементы останутся.
  • При клике на кнопке "ВЫЙТИ ИЗ РЕДАКТИРОВАНИЯ" все оформление, сделанное Вами при помощи программы Раскраска - сохраняются. Добавленные Вами элементы останутся. Программа прекращает работу. Панель управления Раскраской – скрывается.
  • При установке галки рядом со "скрыть элемент" - выбранный элемент скрывается.

ДОБАВИТЬ ЭЛЕМЕНТ


Пример:

  • Выбираем элемент (родительский) в который мы хотим добавить новый элемент.
  • Зададим относительную позицию для этого элемента. Этот шаг необязательный, но в нашем примере он позволит позиционировать новый элемент относительно родительского.
  • Переходим на вкладку ДОБАВИТЬ и в текстовой области пишем Доставка.
  • Кликаем на кнопку ДОБАВИТЬ ЭЛЕМЕНТ.
  • На сайте появился новый элемент с текстом Доставка.
  • Добавим оформление новому элементу. Для этого кликаем на кнопку
  • ПРИМЕНИТЬ -> ВЫБРАТЬ КУРСОР -> pointer
  • ЦВЕТ -> ВЫБРАТЬ ЦВЕТ ФОНА -> E55B4C
  • ОТСТУПЫ -> ОТСТУПЫ СНАРУЖИ -> сверху -> 6px
  • ОТСТУПЫ -> ОТСТУПЫ ВНУТРИ -> сверху -> 9px
  • ОТСТУПЫ -> ОТСТУПЫ ВНУТРИ -> справа -> 10px
  • ОТСТУПЫ -> ОТСТУПЫ ВНУТРИ -> внизу -> 9px
  • ОТСТУПЫ -> ОТСТУПЫ ВНУТРИ -> слева -> 10px
  • ПОЛОЖЕНИЕ -> ПОЗИЦИЯ -> абсолютная
  • ПОЛОЖЕНИЕ -> РАСПОЛОЖЕНИЕ -> сверху -> 18px
  • ПОЛОЖЕНИЕ -> РАСПОЛОЖЕНИЕ-> слева -> 222px
  • ПОЛОЖЕНИЕ -> СЛОЙ-> 2
  • ШРИФТ -> ЦВЕТ ШРИФТА -> FCFCFC
  • ШРИФТ -> ВЫРАВНИВАНИЕ ШРИФТА -> слева
  • ШРИФТ -> НАЧЕРТАНИЕ ШРИФТА -> жирный шрифт
  • Сейчас у нас выбран элемент Доставка.
  • Добавим еще один новый элемент внутрь элемента Доставка.
  • Это будет код видеоролика с youtube.
  • Добавим оформление новому элементу. Для этого кликаем на кнопку
  • На вкладке ПРИМЕНИТЬ, ставим галку -> скрыть элемент.
  • Снимаем галку с "подтвердить выбор селектора".
  • Выбираем селектор элемента Доставка .addNewel1 и дописываем .addNewel1:hover .addNewel2 где .addNewel2 селектор нового элемента, в который мы вставили ролик с youtube.
  • Ставим галку в "подтвердить выбор селектора".
  • На вкладке ПРИМЕНИТЬ ставим, а потом сразу снимаем галку в "скрыть элемент".
  • Перезагружаем страницу.
  • Сворачиваем панель управления Раскраской и смотрим что у нас получилось.
  • Примечание. Плеер с youtube стилизован при помощи бесплатного сервиса youtubecolor.ru

Справка:

В любой момент содержание добавленного блока можно изменить, кликнув по кнопке

После внесения изменений, кликните по кнопке ДОБАВИТЬ ЭЛЕМЕНТ.

Так же в любое время можно изменить оформление добавленного блока, кликнув по кнопке

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

В новые элементы можно добавлять текст или любой HTML код.

СОРТИРОВКА СТИЛЕЙ


Иногда возникает необходимость поменять местами заданные стили оформления.

Это можно сделать при помощи перетаскивания элементов.

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

ВОПРОСЫ - ОТВЕТЫ FAQ


Что необходимо делать после того как все нужные изменения были произведены и отображение элементов настроено?

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

Если мне нужно что ни будь поправить, скажем через неделю, как это сделать?

Запускаете Раскраску, выбираете элемент, который необходимо изменить и вносите коррективы.

Пожалуйста, скажите, Ваша программа Раскраска поддерживает Армянские шрифты?

Все шрифты поддерживают алфавиты на основе кириллицы и латиницы, последние пять шрифтов поддерживают все остальные алфавиты.