Замена фона шапки

ЕСТЬ РЕШЕНИЕ ЗАКРЫТО
#1 5 февраля 2022 в 13:22

Всем здравствуйте. Подскажите пожалуйста как сменить фон в верхней шапке сайта и фон самого сайта, шаблона modern на фоновое изображение? Я понимаю что это делается в css, но не получается. Использую функцию background-image, указываю url к изображению, но ничего не меняется. Может быть не там делаю. Подскажите пожалуйста. 

Правки делаю в файле theme.css вот тут icms-content-header>.icms-content-header__banner{background-image: url изображения; color:#ffffff}

#2 5 февраля 2022 в 15:43

сменить фон в верхней шапке сайта и фон самого сайта, шаблона modern на фоновое изображение?

Valodar

Будьте любезны, загляните сюда:
instantcms.ru/forum/izmenjaem-shablon-modern.html#post-348269

#3 5 февраля 2022 в 17:23

сменить фон в верхней шапке сайта и фон самого сайта, шаблона modern на фоновое изображение?

Valodar

Будьте любезны, загляните сюда:
instantcms.ru/forum/izmenjaem-shablon-modern.html#post-348269

DeDja

Создал стиль отдельный в _custom.scss. Но получается просто белый фон.

Добавлено спустя 27 минут

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

...
#4 5 февраля 2022 в 17:43

Вот так стиль написал

Valodar

Стиль это CSS, а не HTML.

Просто добавьте в \templates\modern\scss\theme\_custom.scss вот это:

  1. .shapka {
  2. background-image:url (/templates/modern/images/banner.jpg);
  3. background-repeat: no-repeat;
  4. background-position: -40px 0px;
  5. background-size: cover;
  6. }

После этого, в настройках темы в админке «Сохранить и скомпилировать».

#5 5 февраля 2022 в 17:53

Вот так стиль написал

Valodar

Стиль это CSS, а не HTML.

Просто добавьте в \templates\modern\scss\theme\_custom.scss вот это:

  1. .shapka {
  2. background-image:url (/templates/modern/images/banner.jpg);
  3. background-repeat: no-repeat;
  4. background-position: -40px 0px;
  5. background-size: cover;
  6. }

После этого, в настройках темы в админке «Сохранить и скомпилировать».

Ris

Я так делал, единственное не сделал «сохранить и скомпилировать». Сейчас все переделал, нажал — сохранить и скомпилировать. Захожу в виджеты и страницы и в виджете «лого + меню пользователя» меняю «CSS класс родительского тега ряда» и ничего не происходит, так же просто белый фон.Изображение

#6 5 февраля 2022 в 18:10

так же просто белый фон.

Valodar

Ткните в белый фон правой кнопкой мыши «Посмотреть код».

Раз фон белый, а не по умолчанию — стиль сработал.

Раз картинки нет — неправильно указан путь к картинке.

#7 5 февраля 2022 в 18:58

так же просто белый фон.

Valodar

Ткните в белый фон правой кнопкой мыши «Посмотреть код».

Раз фон белый, а не по умолчанию — стиль сработал.

Раз картинки нет — неправильно указан путь к картинке.

Ris

Вам полностью код скинуть?

Добавлено спустя 8 минут

Изображение

#8 5 февраля 2022 в 19:07

Вам полностью код скинуть?

Valodar

Нет, вон у вас где <div class=«shapka»     три точки.

Ткните в них.

#9 5 февраля 2022 в 19:16

Вам полностью код скинуть?

Valodar

Нет, вон у вас где <div class=«shapka»     три точки.

Ткните в них.

Ris

Изображение

#10 5 февраля 2022 в 19:18

 Valodar

Это всё html.

А стили для блока shapka панель разработчика какие показывает?

#11 5 февраля 2022 в 19:21

 Valodar

Это всё html.

А стили для блока shapka панель разработчика какие показывает?

Ris
element.style {
 
}
 
theme.css?1641641576:7
*, *::before, *::after {
  box-sizing: border-box;
}
 
 
user agent stylesheet
div {
  display: block;
}
 
Inherited from body#desktop_device_type.d-flex.flex-column.min-vh-100.icms-frontpage
 
theme.css?1641641576:7
body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, «Segoe UI», Roboto, «Helvetica Neue», Arial, «Noto Sans», «Liberation Sans», sans-serif, «Apple Color Emoji», «Segoe UI Emoji», «Segoe UI Symbol», «Noto Color Emoji»;
  font-size: 0.9375rem;
  font-weight: 400;
  line-height: 1.5;
  color: #2d3436;
  text-align: left;
  background-color: #ffffff;
}
 
Inherited from html.min-vh-100
 
theme.css?1641641576:7
:root {
  --blue: #3867d6;
  --indigo: #786fa6;
  --purple: #596275;
  --pink: #f78fb3;
  --red: #e66767;
  --orange: #f19066;
  --yellow: #f5cd79;
  --green: #33bd66;
  --teal: #3bd4c2;
  --cyan: #0abde3;
  --white: #ffffff;
  --gray: #888888;
  --gray-dark: #2d3436;
  --primary: #3867d6;
  --secondary: #888888;
  --success: #33bd66;
  --info: #0abde3;
  --warning: #f5cd79;
  --danger: #e66767;
  --light: #f8f9fa;
  --dark: #1e2224;
  --breakpoint-xs: 0;
  --breakpoint-sm: 576px;
  --breakpoint-md: 768px;
  --breakpoint-lg: 992px;
  --breakpoint-xl: 1200px;
  --font-family-sans-serif: -apple-system, BlinkMacSystemFont, «Segoe UI», Roboto, «Helvetica Neue», Arial, «Noto Sans», «Liberation Sans», sans-serif, «Apple Color Emoji», «Segoe UI Emoji», «Segoe UI Symbol», «Noto Color Emoji»;
  --font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, «Liberation Mono», «Courier New», monospace;
}
 
 
theme.css?1641641576:7
html {
  font-family: sans-serif;
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: rgba(26, 26, 26, 0);
}
 
Pseudo ::before element
 
theme.css?1641641576:7
*, *::before, *::after {
  box-sizing: border-box;
}
 
Pseudo ::after element
 
theme.css?1641641576:7
*, *::before, *::after {
  box-sizing: border-box;
}
 
Pseudo ::selection element
 
theme.css?1641641576:7
::selection {
  background: #3867d6;
  color: #ffffff;
  text-shadow: none;
}

Это?

#12 5 февраля 2022 в 19:24

Это?

Valodar

Не это, конечно.

Должно выгkядеть, как 

shapka:

background-image: ...

Я вам там в личку написал. Конверт вверху моргает. Ткните, если не трудно.

#13 5 февраля 2022 в 19:29

Я вам ответил.

#14 6 февраля 2022 в 19:36

Проблема решена

Используя этот сайт, вы соглашаетесь с тем, что мы используем файлы cookie.