Перейти к содержанию
Vladi0Mir

Замена фона на картинку

Рекомендуемые сообщения

Добрый день. Я знаю, что таких тем много и я их прочитал, и все делал как написано, но не получается.

У меня магазин Version 1.5.1.3.

Как и советовали менял в stylesheet.css

body {
background-color: #ffffff;
color: #000000;

на разные вариаты

1.

background-color: url('../image/fon.png')

(а так же jpg) ставил top left а так же no-repeat center fixed

2.

background: url('../image/fon.png')

(а так же jpg)

3.

background: url('тут писал полный адрес/image/fon.png')

(а так же jpg)

4. и даже что то еще уже не помню.

Фото которое хочу поставить 2480*3500 размер 1 мб. (знаю что много, но я хотел пока попробовать, потом сжал бы.)

Фото лежит в html/catalog/view/theme/default/image/ а так же пробовал фото в image/data/ где все фото лежат.

И ничего не меняется. Как все работало с белым фоном, так и работает.

Спасибо, если кто поможет...

Изменено пользователем tim21701
пишите на форуме код (любой) в теге [CODE]

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Вот мой код css:

body {
width: 100%;
font: 12px/18px Tahoma, Arial, Verdana, sans-serif;
position: absolute;
background: #ffffff url("../image/vichy.jpg");
background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
background-attachment: fixed;
color: #262626;
}

Сама картинка 1024*705, за счет стиля "cover" растягивается на весь экран, "весит" 140 кБ. Установите подобный код и ОБЯЗАТЕЛЬНО почистите кеш браузера! Картинка лежит в папке image шаблона, т.е. html/catalog/view/theme/default/image/

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

background-color: url('../image/fon.png')

(а так же jpg) ставил top left а так же no-repeat center fixed

Вот вы пишите, что поставили jpg. А почему в коде png?

Дайте ссылку на сайт.

Изменено пользователем 12strun

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

12strun

Я говорю что ставил и jpg и png.

Сайт www.originaltoy.ru

Кстати, принимаю критику.

Strelez

полностью у меня в файле стоит

body {
background-color: #ffffff;
color: #000000;
font-family: Arial, Helvetica, sans-serif;
margin: 0px;
padding: 0px;
}

margin и padding мне оставлять, или только то что ты мне написал?.

Кстати, там в файле полно где стоит background.

Его менять в самом начале? Там где именно Body? Может какой еще background отвечает за фон?

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Нужно так

background: #ffffff url("../image/fon.png");

Цвет #ffffff пишется для того, чтобы в случае сбоя при загрузке картинки фон имел альтернативный цвет, в данном случае - белый. margin и padding оставляй как хочешь (это отступы). Про кеш браузера не забудь.

Это

background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
background-attachment: fixed;

по пунктам:

нет повтора фона

картинка центрируется сверху по центру

про cover я писал

фон неподвижный, не прокручивается вместе с сайтом.

А вообще htmlbook.ru тебе в помощь.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Попробую. Я про кэш не очень то знаю, где это, но разберусь.

Но я пробовал несколькими браузерами до этого (для проверки), и не работало.

Кстати, как это правильно писать

"пишите на форуме код (любой) в теге

"  ?[/size][/font][/color]

Я совсем кофейник

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

А это нажимаешь вот на эту кнопочку code.png?t=B8DJ5M3 в редакторе :-)

Кэш в Опере: Меню - Настройки - Удалить личные данные - Ставишь галку только на кэш - Удалить

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

1. У вас в stylesheet.css сейчас

background-color: #ffffff;

Замените на

background: #ffffff url("../image/fon.png");

как описывалось 2-мя постами выше.

2. загрузите изображение с именем fon.png в catalog/view/theme/default/image

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
body {
background-color: #FFF;
background-image:url('../image/fon.png');
background-repeat:no-repeat;
background-position: center top;
color: #000;
margin: 0px;
padding: 0px;
}

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Спасибо что откликнулись. Но...

Попробовал все поменять, эффекта 0.

Вот что поставил, как в общем то все и советовали

background: #ffffff url("../image/fon.png");

Ничего.

Но, если поменять просто цвет, все работает. Причем цвет менял и в изначальном коде, и в новом (который выше).

Фон лежит в папке, где и должен html/catalog/view/theme/default/image/

Я не понимаю......

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

AWARO

АААА, получилось. Слушайте историю глупости. Я думал, что не важно, с большой буквы начинается имя файла или с маленькой. Как в почте.

А разница есть.

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

P.S

http://originaltoy.ru Ну хоть в двух словах оцените. Может какие то очень страшные вещи есть неправильные, и их нужно исправить. Только учтите, что я совсем не профи а любитель.

Спасибо.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Так ссылка не рабочая что то

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Рабочая. Видимо иногда отрубается, потому что на хостинге сейчас какие то работы идут.

А так рабочая. Смотрите.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

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

27e038822787t.jpg

Да, и, если не используется карусель, зачем на главной от нее "хвосты" в виде зеленых стрелок (предыдущая, следующая)?

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

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

Так я не знаю как это сделать. Как говориться, я не волшебник, я только учусъ.

Наверное так было бы хорошо.

И как хвосты убрать пока не знаю. Не добрался до этого. Но конечно надо.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

В файле stylesheet.css:160 строка найти

#content {
margin-bottom: 25px;
min-height: 400px;
}

Заменить на

#content {
background-color: #fff;
border: 1px solid #DBDEE1;
padding: 5px 10px;
margin-bottom: 25px;
min-height: 400px;
}

Если каруселью не планируете пользоваться удалите ее в админке и посмотрите, останутся ли "хвосты"?

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Еще раз спасибо. Чем смогу помочь, обращайтесь.

А я создаю тему в другом разделе, выскочила еще одна проблема, будет интерес, посмотрите.

https://opencartforum.com/topic/18750-cms-%D0%BD%D0%B5-%D0%B2%D0%B8%D0%B4%D0%B8%D1%82-%D1%84%D0%B0%D0%B9%D0%BB%D1%8B-%D0%BA%D0%B0%D1%80%D1%82%D0%B8%D0%BD%D0%BE%D0%BA/

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Доброго времени суток. Интересная и актуальная для меня тема. Воспользовался мудростью и получилось почти все.

body {
width: 100%;
background: #ffffff url("../image/fon.png");
background-repeat: no-repeat;
   background-position: top center;
   background-size: cover;
background-attachment: fixed;
color: #262626;

Но почему то, обрезает картинку, никак не пойму почему. Картинка с разрешением 1024*400... Обрезает по краям и с низу. Подскажите пожалуйста, а то новую тему создавать придется...

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Доброго времени суток, уважаемые форумчане. Подскажите пожалуйста где в v 2.0.3.1 "Русская сборка" поменять фон на картинку.
Буду благодарен за Ваши ответы.
 

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

где в v 2.0.3.1 "Русская сборка" поменять фон на картинку

 

В стилях, Ватсон.

1. Что это за сборка (и почему бы не спросить у автора или на сайте автора)

2. Что там за шаблон

3. попробуйте по инструкции, она универсальна и вам подойдёт https://opencartforum.com/topic/23339-vopros-po-tcvetu-v-kataloge-tovara/?do=findComment&comment=176997

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Большое спасибо за ответ :-) , это как бы новый opencart http://opencart-russia.ru/ . С адаптивным шаблоном по умолчанию.
просто таким методом меня отправляет www/catalog/view/javascript/bootstrap/css/bootstrap.min.css
Вот и зациклил меня вопрос: Разве в javascript может такое быть?
 

Задал вопрос разработчикам молчат вторые сутки :-)

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Замена фона на картинку в v 2.0.3.1 "Русская сборка" решено !!!
  Оказывается если Вы не находите в stylesheet.css строк с background-image
надо самому после тега body { в следующей строке дописать: background-image: url('../image/fon.png');

 Где fon.png Ваша картинка или фото предварительно загруженое в /catalog/view/theme/default/image
в формате PNG

 Всем спасибо за помощь. Без Ваших ссылок на решение проблемы мог бы и не разобраться.
     
 

Изменено пользователем Colt

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

 

Задал вопрос разработчикам молчат вторые сутки :-)

 

А ВРАТЬ не хорошо. Вопрос задан в час ночи и утром вам уже ответили!! При том что ответ спокойно ищется в поиске и не только по форуму. Так зачем вводить людей в заблуждение??

Изменено пользователем my2you

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Для публикации сообщений создайте учётную запись или авторизуйтесь

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

Создать учетную запись

Зарегистрируйте новую учётную запись в нашем сообществе. Это очень просто!

Регистрация нового пользователя

Войти

Уже есть аккаунт? Войти в систему.

Войти

  • Последние посетители   0 пользователей онлайн

    Ни одного зарегистрированного пользователя не просматривает данную страницу

×

Важная информация

На нашем сайте используются файлы cookie и происходит обработка некоторых персональных данных пользователей, чтобы улучшить пользовательский интерфейс. Чтобы узнать для чего и какие персональные данные мы обрабатываем перейдите по ссылке. Если Вы нажмете «Я даю согласие», это означает, что Вы понимаете и принимаете все условия, указанные в этом Уведомлении о Конфиденциальности.