1. Forum używa plików Cookies. Dowiedz się więcej o celu ich używania i możliwości zmiany ustawień Cookies w przeglądarce. Czytaj więcej...

W TRAKCIE MENU - obrazki obok nazw kategorii

Dyskusja w 'Zmiana wyglądu sklepu i edycja zaawansowana' rozpoczęta przez użytkownika Bagazniki.pl, 13 Październik 2018.

  1. Bagazniki.pl

    Bagazniki.pl Praktyk

    Wiadomości:
    31
    Docenione treści:
    1
    Witam

    czy można jakimś sposobem dodać do nazw kategorii w menu obrazek ( gif, jpg ) .

    W załączeniu zdjęcie jakby to miało wyglądać .

    Pozdrawiam
     

    Załączone pliki:

  2. Bagazniki.pl

    Bagazniki.pl Praktyk

    Wiadomości:
    31
    Docenione treści:
    1
    myślałem aby gdzieś wywoływać zdjęcie poprzez instrukcje do kategorii ID13 daj zdjęcie "XXX"
     
  3. Grzesiek

    Grzesiek BOK home.pl home.pl Administrator forum

    Wiadomości:
    3 341
    Docenione treści:
    315
    Nie mam żadnego gotowca, dawno w temacie sklepu sam nic nie tworzyłem. A może zamiast edytować szablon skorzystasz z gotowego rozwiązania? https://pomoc.home.pl/baza-wiedzy/kategorie-obrazkowe

    Zawsze możesz edytować pliki .tpl skórki i dodać nowe elementy. Każda kategoria ma swoje własne ID więc nie powinno być problemy z identyfikacją jej, więc pozostaje tylko zbudować kod. Jeśli nikt na forum nie ma gotowego rozwiązania, pozostaje pomoc agencji lub w/w aplikacja. Polecam. @LukaszC @PawelS pomogą Ci wdrożyć aplikację, chociaż pełny opis masz w Centrum Pomocy.
     
  4. papux

    papux Fachowiec

    Wiadomości:
    383
    Docenione treści:
    104
    Ustaw sobie dla każdej kategorii jako background.
    Kod dotyczy oczywiście własnej konfiguracji CSS.
    Określ obiekt i przypisz mu parametr background. Dla każdego z osobna.

    Kod:
    background: url('../../styles/../images/user/obrazek.jpg') no-repeat 46% 0% transparent;
    Obrazek wrzucasz do konfiguracja, wygląd, pliki graficzne
     
    Grzesiek lubi to.
  5. Bagazniki.pl

    Bagazniki.pl Praktyk

    Wiadomości:
    31
    Docenione treści:
    1
    to faktycznie ma sens , czyli wywoływać w CSS a jak składnia cała musiała by wyglądać ? Wywołanie background do np kategoria 5 ? Z góry wielkie dzięki za pomoc .

    p.s. świetne masz przejścia ( ładowanie strony ) . Zdradzisz czy da się coś takiego w clickshopie zrobić ?
     
  6. papux

    papux Fachowiec

    Wiadomości:
    383
    Docenione treści:
    104
    Kod:
    li#category_19 {
    background: url('../../styles/../images/user/obrazek.jpg') no-repeat 46% 0% transparent; }
    
    Składnia według kategorii
    czyli pierwsza kategoria BAGAŻNIKI BAZOWE - dobierz do samochodu ma znaczniki li#category_19.
    Każda kategoria ma swój więc trzeba samemu sprawdzić badając elementy na własnej stronie.
     
  7. Bagazniki.pl

    Bagazniki.pl Praktyk

    Wiadomości:
    31
    Docenione treści:
    1
    nie chce się obrazek załadować wpisałem w css :


    li#category_19 {
    background: url('../images/user/bazowe.gif') no-repeat 46% 0% transparent; }
     
  8. Bagazniki.pl

    Bagazniki.pl Praktyk

    Wiadomości:
    31
    Docenione treści:
    1
    odwołuje , działa :D , teraz tylko grafiką posterować aby ładnie wpasowało się :D
    dzięki !
     
  9. Bagazniki.pl

    Bagazniki.pl Praktyk

    Wiadomości:
    31
    Docenione treści:
    1
    jeszcze próbuje sobie poradzić aby background pozostał po kliknięciu na kategorię ale niestety słabo mi idzie . Można liczyć na wsparcie ?

    mój kod css :
    #menu (max-width: 480px)
    .shop_index .rwd .main {
    z-index: 1;
    }
    #box_menu .boxhead {
    background: url('../images/hbox_header.png') left top repeat-x;
    }

    #box_menu .boxhead .leftside {
    background: url('../images/hbox_headerleft.png') left top no-repeat;
    }

    #box_menu .boxhead .rightside {
    background: url('../images/hbox_headerright.png') right top no-repeat;
    }


    #box_menu ul li.current a {
    font-weight: bold;
    color: black;
    font-size:13px;
    }




    #box_menu ul li li {
    background: url('../images/menu_subdot.png') left 4px no-repeat;
    font-size:14px;
    color:black;
    font-weight: bold;
    background-color: #b5b5b5; /* kolor menu wybrane */
    }


    #box_menu ul li a {
    color: black; /* kolor czarny * kolor czcionki nieaktywnego menu*/
    font-size:12px;

    }






    li#category_19 {
    background: url('../images/user/bazowe.gif') no-repeat 46% 0% transparent; }
     
  10. papux

    papux Fachowiec

    Wiadomości:
    383
    Docenione treści:
    104
    Pobaw się selektrem
    hover

    hover umieszczasz zawsze na końcu kodu obiektu po dwukropku bez spacji
    np
    #box_menu ul li a:hover

    Odpowiada to za obiekt aktywny w danym momencie lub przy najechaniu na jego myszką.

    A więc musisz osobno ustawić selektory dla obiektu aktywnego i nieaktywnego.
     
  11. Bagazniki.pl

    Bagazniki.pl Praktyk

    Wiadomości:
    31
    Docenione treści:
    1
    powinienem to stosować razem :
    li#category_19 {
    background: url('../images/user/bazowe.gif') no-repeat 46% 0% transparent; }

    czy gdzie indziej
     
  12. LukaszC

    LukaszC eCommerce Team home.pl Moderator forum

    Wiadomości:
    694
    Docenione treści:
    80
    Wykonujesz to mniej więcej tak:
    Kod:
    li#category_19:hover
    {
    background: url('../images/user/bazowe.gif') no-repeat 46% 0% transparent; }
     
  13. Bagazniki.pl

    Bagazniki.pl Praktyk

    Wiadomości:
    31
    Docenione treści:
    1
    próbowałem tej składni ale niestety przy niej wogóle znika background
     
  14. LukaszC

    LukaszC eCommerce Team home.pl Moderator forum

    Wiadomości:
    694
    Docenione treści:
    80
    Ale musisz zrobić kod dla li#category_19 i dla li#category_19:hover
     
  15. Bagazniki.pl

    Bagazniki.pl Praktyk

    Wiadomości:
    31
    Docenione treści:
    1
    mam taką składnie:

    li#category_19
    {
    background: url('../images/user/bazowe.gif') no-repeat 100% 0% transparent; }

    li#category_19:hover
    {
    background: url('../images/user/bazowe.gif') no-repeat 100% 0% transparent; }
     

Poleć forum znajomym