Zdjęcie zamiast tła w header

[otasz]

Czy jest możliwość, aby zamiast koloru tła w nagłówku sklepu umieścić jakieś zdjęcie? Jeśli tak, to w jaki sposób to zrobić?

 

Domyślam się, że to jest kod odpowiedzialny za header?

header {
  z-index: 1;
  position: relative;
  background: #a9a9a9;
  padding-bottom: 15px; }
  header .banner {
    background: black;
    max-height: 100%; }
    header .banner .row {
      margin: 0px; }
  header .nav {
    background: #333333; }
    header .nav .row {
      margin: 0px; }
    header .nav nav {
      width: 100%; }
  header .row {
    position: relative; }
    header .row > .container {
      position: relative; }
    header .row #header_logo {
      padding-top: 15px; }
      @media (max-width: 992px) {
        header .row #header_logo {
          padding-top: 40px; } }
      @media (max-width: 767px) {
        header .row #header_logo {
          padding-top: 15px; }
          header .row #header_logo img {
            margin: 0 auto; } }
  @media (min-width: 767px) {
    header .col-sm-4 + .col-sm-4 + .col-sm-4, header .row #header_logo + .col-sm-4 + .col-sm-4, header .row .col-sm-4 + #header_logo + .col-sm-4, header .row #header_logo + #header_logo + .col-sm-4, header .row .col-sm-4 + .col-sm-4 + #header_logo, header .row #header_logo + .col-sm-4 + #header_logo, header .row .col-sm-4 + #header_logo + #header_logo, header .row #header_logo + #header_logo + #header_logo {
      float: right; } }
 

Znalazłem kilka poradników, które mówią o edycji pliku theme.css, ale ja nie mogę nigdzie takiego pliku odnaleźć.

[endriu107]

To źle znalazłeś. w pliku global.css linia 5270 tam masz zdefiniowane tło. 

Edited November 4, 2014 by endriu107 (see edit history)

[otasz]

5270 to jest właśnie ten fragmenty kodu, który wkleiłem w pierwszym poście.

Wstawiam zamiast background: #a9a9a9 z wiersza 5273 to background: #FFF url('url zdjęcia')!important; i nic się w sklepie nie zmienia. Mam dopisać coś jeszcze, czy wpisuję złą zawartość?

[endriu107]

Włączyć kompilacje, wyczyścić cache smarty etc.

[vekia]

a możesz podzielić się linkiem do sklepu?

będzie łatwiej zweryfikować problem

[otasz]

www.filaments4u.com

Edited November 4, 2014 by otasz (see edit history)

[vekia]

ja tam cały czas widzę:

header {
  z-index: 1;
  position: relative;
  background: #a9a9a9 ;
  padding-bottom: 15px; }

[vekia]

w celach testowych za pomoca firebuga zmodyfikowalem style tak jak mowiłeś, i oto efekt:

wniosek: sposób działa, tylko dzieje się coś (najprawdopodobniej) z zapisywaniem zmian lub z wgrywaniem zmodyfikowanego pliku.

masz 100% pewność, że wszystko zostało zgrane?

[otasz]

Kod jest taki jaki jest, ponieważ nie widząc efektu, zostawiłem go po staremu.

Ja korzystam z WebFTP w linuxpl.com. Otwieram w nim plik, modyfikuję, klikam zapisz i odświeżam stronę. Do tej pory wszystkie modyfikacje tak robiłem i działały.

 

Tak na prawdę to niczego nie jestem pewien na 100%. Sklep robię od tygodnia i tak właściwie tydzień temu się dowiedziałem, że istnieje coś takiego jak CSS . Nie no może coś tam kiedyś słyszałem, ale bez żadnego kontaktu z "tym". Co chciałem zmienić w wyglądzie szablonu to już raczej uzyskałem, zostało mi już właściwie chyba tylko to.

 

Możesz podać jak dokładnie ma wyglądeć ten fragment kodu z przykładowym URL, a ja spróbuję to jeszcze raz wstawić. Jakie powinien mieć wymiary taki obrazek w headerze?

Edited November 4, 2014 by otasz (see edit history)

[vekia]

header {
z-index: 1;
position: relative;
background: #FFF url('url zdjęcia')!important; 
padding-bottom: 15px; }

dokładnie tak jak powyżej,

możesz wprowadzić zmiany i dać znać, jak będą gotowe? zerknę tam i zobaczymy w czym problem :-)

[otasz]

Wklepałem to i nadal nic się nie zmieniło. Możesz sobie sprawdzić. Zdjęcie mogę gdziekolwiek wrzucić, czy do img w folderze szablonu?

 

Wkleiłem dokładnie coś takiego:

header {
z-index: 1;
position: relative;
background: #FFF url('/themes/default-bootstrap/img/baner%20filamenty.png')!important;
padding-bottom: 15px; }

 

 

Edit. 21:30:

 

Obrazek wskoczył po jakimś czasie. Jak teraz zrobić żeby ograniczyć jego szerokość do szerokości banera (1170px) i czy wtedy można będzie ustawić pozostałe tło jak tło poniżej?

Edited November 4, 2014 by otasz (see edit history)

[endriu107]

background: #FFF url('/themes/default-bootstrap/img/baner%20filamenty.png') no-repeat 90px 38px;

 

Mniej więcej tak z tym ze to sie nie sprawdzi w  innych rozdzielczościach.

[otasz]

Ok, dzięki za odpowiedzi. Działa faktycznie. Mam dwa monitory i rzeczywiście na każdym to inaczej wygląda.

Mam już wrzucone ostateczne tło. I tutaj pytanie, czy da się je "zakotwiczyć" tak, żeby zawsze było na środku i w zależności od rozdzielczości ucinało boki, bo teraz jest chyba wyrównane do lewej.

[endriu107]

Najlepiej dodaj background-position: center;

[otasz]

Udało się, dziękuję serdecznie.

[otasz]

Mama jeszcze jeden problem. Jak się pozbyć tego białego okna z wielkim pytajnikiem, który jest nad podkategoriami http://filaments4u.com/index.php?id_category=12&controller=category&id_lang=2.

[vekia]

ten pytajnik to brak zdjęcia kategorii:

http://filaments4u.com/img/c/12-category_default.jpg

 

kategoria nie ma wgranego zdjęcia?

[otasz]

Przy edycji kategorii jest możliwość wgrania zdjęcia i miniaturki. Ja k próbuję wgrać oba, to i tak wyświetla się tylko jedno z nich. I wtedy jeśli wgram zdjęcie o wymiarach miniaturki 125x125, to mam mały kafelek w oknie, w którym jest teraz pytajnik. Jak wgram zdjęcie 870x217 to wtedy w miniaturce mam niedopasowany obraz. Dlatego stwierdziłem, że lepiej w ogóle się pozbyć tego okna, o które pytam.

[otasz]

Czy to zdjęcie w kategorii musi być tym samym zdjęciem co na miniaturce tak jak jest to teraz http://filaments4u.com/index.php?id_category=12&controller=category&id_lang=2

[endriu107]

http://www.prestashop.com/forums/topic/347970-kilka-b%C5%82%C4%99d%C3%B3w-do-poprawki-jak-kategorie-produkt%C3%B3w/

 

Tu masz trochę więcej na ten temat.

[otasz]

Jestem coraz bliżej .