Дизайн
В данном разделе Вы можете настроить внешний вид модулей ValueHost API.
Основным инструментом управления дизайном явлется CSS шаблон, который Вы можете перезаписывать.
- Логотип на домашней странице - изображение логотипа, которое будет отображаться в модуле /hosting/
- Логотип на обычных страницах - изображение логотипа, которое будет отображаться во всех остальных модулях, как правило, оно меньше, чем логотип на домашней странице
- Фавикон - иконка сайта
- Аватар по-умолчанию - изображение, используемое в качестве аватара пользователе, если он его задал
- Цвет фона - платформа ValueHost 2.0 динамически создает изображение (SVG) из исходного цвета (Цвет фона) и сама подбирает цвет шрифта на изображении.
- Собственные стили CSS - стили страниц
Как это работает?
Сначала подгружается основной стиль по умолчанию.
Подгружается стиль, который Вы создали. Все данные, которые Вы укажете в своем стиле будут записаны поверх стандартных.
Таким образом, Вы сможете изменить как просто цвет шрифтов, так и расположение и наличие елемнтов модулей целиком.
Пример стилей
body{
background-color:#fff;
}
/* Убираем панель и подвал */
#IOSbar,footer{display:none;}
/* Задаем цвет "подсвеченных" елементов */
.services_h:hover, tr.services_h:hover, td.services_h, .h, .wc_instr, .wc_todd, .win{
background-color: #c0d7dd;
}
/* Выравниваем контент панели управления по центру */
#webcontrol{
margin:auto;
}
/* Задаем цвет заголовков */
h1,h2,h3,h4{
color:#34717f;
}
#NavTop,#NavBottom{
white-space: nowrap;
}
/* Настраиваем левую кнопку в панели управления */
#webcontrol_exit{
padding-left: 0px;
}
/* Убираем стрелки для списков в модуле /hosting/ */
#indexPage ul li{
background:none;
padding:0;
}
/* Убираем изображения девушек в модуле /hosting/ */
#indexPage_bottom_left{
background-position:500px 500px;
}
background-color:#fff;
}
/* Убираем панель и подвал */
#IOSbar,footer{display:none;}
/* Задаем цвет "подсвеченных" елементов */
.services_h:hover, tr.services_h:hover, td.services_h, .h, .wc_instr, .wc_todd, .win{
background-color: #c0d7dd;
}
/* Выравниваем контент панели управления по центру */
#webcontrol{
margin:auto;
}
/* Задаем цвет заголовков */
h1,h2,h3,h4{
color:#34717f;
}
#NavTop,#NavBottom{
white-space: nowrap;
}
/* Настраиваем левую кнопку в панели управления */
#webcontrol_exit{
padding-left: 0px;
}
/* Убираем стрелки для списков в модуле /hosting/ */
#indexPage ul li{
background:none;
padding:0;
}
/* Убираем изображения девушек в модуле /hosting/ */
#indexPage_bottom_left{
background-position:500px 500px;
}
Также, Вы можете подгрузить внешний стиль:
@import 'https://www.valuehost.ru/hostix/inc/vhs_h.css';
Логотип на технических страницах
Логотип, который отображается на технических страницах с ошибками, например 404, а также на страницах, которые создаются по умолчанию при создании нового аккаунта и "Услуга приостановлена" должен быть расположен:
YOUR_BRAND/images/hostix_api_logo.gif