Дизайн #1728

Дизайн #1728

1. Как изменить шапку сайта?

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

Название вашего сайта — текст, который будет отображаться в переменной $SITE_NAME$. Чтобы изменить его требуется перейти в Панель управления → Настройки → Общие настройки и изменить поле “Название вашего сайта” на необходимое.

Если же вместо текста нужно изображение тогда перейдите в Панель управления → Дизайн → Редактор → Глобальные блоки → Верхняя часть сайта найдите 6 строку кода:

<a href="$HOME_PAGE_LINK$" class="site-n">$SITE_NAME$</a>

и вместо $SITE_NAME$ пропишите:

<img src="ссылка на логотип">

где "ссылка на логотип" – пропишите ссылку, которую вы можете получить, осуществляя:

1) Логотип загружается в файловый менеджер сайта (Панель управления → Инструменты.)

2) После загрузки изображения, просто кликните на название изображение и вы получите заветную ссылку.

Изменить фон шапки сайта можно в Панель управления → Дизайн → Редактор → Таблица стилей (CSS). Вам потребуется перейти к 44 строке кода:

#header{background-color:rgba(7,74,140,0.93);color:#dae7f2}

rgba(7,74,140,0.93) – фон шапки сайта. Его можно изменить на любой другой html-цвет.

2. Как изменить промо-блок?

Промо-блок сайта состоит из слайдера и 3 информативных блоков, для их изменения перейдите в Панель управления → Дизайн → Редактор → Глобальные блоки → PROMO.  

Для изменения слайдера найдите следующие участки кода 4-12, 13-21, 22-30, 31-39 и в каждом замените:

Изображение:

<img src="/.s/t/1728/promo1.jpg" alt="">

где /.s/t/1728/promo1.jpg – является ссылкой на изображение. Вместо него можно указать свою ссылку на свое изображение, предварительно загрузив его в Файловый менеджер сайта.

Текст:

<span class="promo-title">Lorem ipsum dolor sit amet consectetur</span>

Кнопка:

<a href="#" type="button">Read more</a>

где Read more – вы можете изменить на любой свой текст, а вместо # укажите ссылку для перехода. Для каждого из информационных блоков вы можете изменять информацию на свою или же выводить в них информеры. В первом случае найдите следующие из участков кода 42-56, 57-71, 72-86 и в каждом замените:

Изображение:

<div class="img-wrapper"><img src="/.s/t/1728/promo3.jpg" alt=""></div>

где /.s/t/1728/promo3.jpg – является ссылкой на изображение. Вместо него можно указать свою ссылку на свое изображение, предварительно загрузив его в Файловый менеджер сайта.

Заголовок:

<h4><a href="">Lorem ipsum dolor sit amet consectetur adipisicing elit.</a></h4>

Текст

<div class="promo-message">Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aperiam, aspernaturcum Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aperiam,aspernatur cum</div>

Кнопка:

<div class="link-holder"><a href="#" type="button">Read more</a></div>

где Read more – вы можете изменить на любой свой текст, а вместо # укажите ссылку для перехода.

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

Тогда в коде шаблона удаляем строки 42-86 и вместо них пропишите код необходимого созданного информера $MYINF_1$  

При создании или редактировании информера необходимыми параметрами являются:  

  • Тип данных: Материалы
  • Количество материалов: 4
  • Количество колонок: 1

А шаблон информера будет иметь вид:  

<div class="promo-i">

<div class="img-wrapper"><img src="$IMG_URL1$" alt=""></div>

<div class="news-descr">

<div class="title"><h4>$TITLE$</h4></div>

<div class="promo-message">$MESSAGE$</div>

<div class="link-holder"><a href="$ENTRY_URL$">Read more</a></div>

</div> </div>

Более детально с тем, как создать и настроить информер вы можете ознакомится здесь: https://www.ucoz.ru/help/tools/informery

3. Как сделать, чтобы промо-блок отображался не только на главной странице?

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

Для этого необходимо перейти в Панель управления → Дизайн → Редактор → PROMO в 1 строке указать ID необходимых страниц  модулей в условии

<?if($URI_ID$='page1')?> <?endif?>

или добавить условие для вывода в нужных модулях:

<?if($MODULE_ID$='forum')?> <?endif?> 

Также вы можете удалить данные условные операторы для отображения во всех модулях и страницах.

4. Как изменить цвет  блоков?

Для изменений перейдите в Панель управления → Дизайн → Редактор → Таблица стилей (CSS), найдите там 176 строку:

.sidebox {margin:0 0 15px; padding:20px 30px 30px; background: rgba(255,255,255,0.93); font-size:1rem;color:#4f535f}

rgba(255,255,255,0.93) – это и есть цвет блока. rgba(255,255,255,0.93) можете заменить на любой другой цвет html.

5. Как изменить фон шаблона?

Фоном шаблона является изображение:

Для его изменения перейдите в Панель управления → Дизайн → Редактор → Таблица стилей (CSS), после чего необходимо найдите там 4 строку:

.main-body{margin:0;background:url(/.s/t/1728/background.jpg) no-repeat fixed center; background-size: cover;min-height: 100vh;display:flex; flex-direction:column}

/.s/t/1728/background.jpg – является ссылкой на данное изображение. Вместо него можно указать свою ссылку на свое изображение, предварительно загрузив его в Файловый менеджер сайта.

6. Какой цвет основных элементов сайта?

Цветом цветом основных элементов сайта является #0b72d9.

Если требуется сменить цветовую гамму, то воспользуйтесь заменой #0b72d9 на любой свой html-цвет, используя замену внутри шаблона Таблица стилей CSS.

Дизайн #1728