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...

Skórka RWD- zmiana kilku elementów w wyglądzie

Dyskusja w 'Zmiana wyglądu sklepu i edycja zaawansowana' rozpoczęta przez użytkownika nukionline.pl, 25 Wrzesień 2015.

  1. nukionline.pl

    nukionline.pl Początkujący

    Wiadomości:
    6
    Docenione treści:
    0
    Witam, chciałabym poprosić o pomoc. Jak zmienić wygląd kilku elementów w skórce RWD.

    -Wysokość nazw produktów na stronie głównej
    - Wielkość i kolor cen produktów na stronie głównej
    - wielkość okienka "do koszyka" na stronie głównej
    - kolor "podświetlenia" kategorii w menu obok "domku"
    - wielkość okienka "do koszyka" w opisie produktu
    -ujednolicenie wszystkich czcionek


    z góry dziękuję za pomoc :)
     
  2. TheL

    TheL @Lider VIP Beta-tester

    Wiadomości:
    2 403
    Docenione treści:
    535
    Wszystko proste i zaraz postaram się opisać tylko podaj o jakie czcionki chodzi bo nie bardzo rozumiem i czy punkt pierwszy dotyczy Wielkości czcionki? punkt 3 chodzi o button czy moduł?
    ps. Masz strasznie wielkie czcionki na stronie :D
     
    Ostatnia modyfikacja: 25 Wrzesień 2015
  3. nukionline.pl

    nukionline.pl Początkujący

    Wiadomości:
    6
    Docenione treści:
    0
    Tak o wielkosc. teraz wyglada to tak http://nukionline.pl/

    p.3 nie mam zielonego pojecie o co pytasz. chodzi o okienko różowe z napisem "do koszyka" na stronie glownej i w opisie. zeby bylo mniejsze poprostu.


    ps. juz poprawilam :p
     
  4. TheL

    TheL @Lider VIP Beta-tester

    Wiadomości:
    2 403
    Docenione treści:
    535
    Górne menu aby było w Twoim kolorze dodaj do własnego stylu:
    Kod:
    .menu .innermenu .menu-list li h3 a:hover {
    background-color: #d13684;
    }
    box_menu ul li.current > a {
    background-color: #d13684;
    }
    .product .tags .promo {
    background-color: #d13684;
    }
    #box_menu ul li.current > a {
      background-color: #d13684;
    }
    
    zaraz reszta :D
     
  5. TheL

    TheL @Lider VIP Beta-tester

    Wiadomości:
    2 403
    Docenione treści:
    535
    Mniejsza czcionka nazwa produktów.
    We własnym stylu dodajesz:
    Kod:
    .products.viewphot .product .productname {
      font-size: 1.3em;
      height: 2em;
      margin-bottom: 0.5em;
    }
    .box .productname {
      font-size: 1.3em;
    }
    .product .prodname {
      font-size: 1.1em;
      font-weight: normal;
      margin-bottom: 0.5em;
    }
    
     
  6. nukionline.pl

    nukionline.pl Początkujący

    Wiadomości:
    6
    Docenione treści:
    0
  7. TheL

    TheL @Lider VIP Beta-tester

    Wiadomości:
    2 403
    Docenione treści:
    535
    Wielkość i kolor czcionki cen:
    Kod:
    .products.viewphot .product .price {
      color: #d13684;
      margin-bottom: 0.5em;
      padding-top: 0;
      font-size:1.1em;}
    
     
  8. TheL

    TheL @Lider VIP Beta-tester

    Wiadomości:
    2 403
    Docenione treści:
    535
    Przycisk do koszyka:
    Kod:
    .products.viewphot .product .buttons .addtobasket, .products.viewphot .product .buttons .availability-notifier-btn {
      color: #fff;
      font-size: 1.1em;
      font-weight: bold;
      padding: 0.3em 3em;
    }
    
     
    nukionline.pl lubi to.
  9. nukionline.pl

    nukionline.pl Początkujący

    Wiadomości:
    6
    Docenione treści:
    0
    Dziekuje!!

    jeszcze jedna rzecz. zwroc uwage na strone glowna. nazwy ktore sa dluzsze "chowaja sie " za cena. co z tym moge zrobic?
     
  10. TheL

    TheL @Lider VIP Beta-tester

    Wiadomości:
    2 403
    Docenione treści:
    535
    To już chyba wszystko, chyba, że coś pominąłem.
     
  11. TheL

    TheL @Lider VIP Beta-tester

    Wiadomości:
    2 403
    Docenione treści:
    535
    Hmm, to w takim razie w :
    Kod:
    .products.viewphot .product .productname {
    font-size: 1.3em;
    height: 2em;
    margin-bottom: 0.5em;
    }
    
    zamień:
    Kod:
    height: 2em;
    na
    Kod:
    height: 3em;

    ale wtedy zwiększy się odległość i aby produkty były równo tam gdzie są krótkie nazwy będzie pusto pod nazwą, ale sama zobacz, może tak Ci będzie odpowiadało.
     
  12. nukionline.pl

    nukionline.pl Początkujący

    Wiadomości:
    6
    Docenione treści:
    0
    Jeszcze raz bardzo bardzo dziękuje za pomoc :):):)
     
  13. TheL

    TheL @Lider VIP Beta-tester

    Wiadomości:
    2 403
    Docenione treści:
    535
    Nie ma za co, sporo tego wyszło szukania :) Cieszę się, że się przydała moja pomoc.
    Jeśli pojawią się kolejne wątpliwości to zapraszam do pisania, ktoś na pewno pomoże :)
     
    Mariusz lubi to.
  14. nukionline.pl

    nukionline.pl Początkujący

    Wiadomości:
    6
    Docenione treści:
    0
    Witam ponownie. Mam jeszcze dwa pytania..
    Jak zmienić opcję żeby produkty wyświetlały się na liście wraz z opisem?
    Jak ustawić aby podczas wyświetlania zdjęcia produktu nie było nazwy zdjęcia lub aby był prawie niewidoczny?

    Z góry dziękuje!
     
  15. Stau

    Stau Majster

    Wiadomości:
    340
    Docenione treści:
    98
    Jeśli idzie o pierwsze pytanie - domyślam się, że chcesz zachować "widok ze zdjęciem" (3 kolumny - jak teraz na stronie). Przy wyborze "pełnego widoku" opis już się bowiem pojawia - u Ciebie "krótko i na temat" ;).

    Jeśli jest jednak tak jak sądzę - nie widzę stosownej opcji w panelu sklepowym, natomiast modyfikacja templatki tableofproducs.tpl pozwoli dość łatwo osiągnąć zamierzony efekt. Musisz dopisać:
    Kod:
    <div class="product-short-description resetcss large" style="height:30px;">
    {$product->translation->short_description}
    </div>
    Szukasz około 200 linii kodu i wstawiasz całość w ten sposób (pomiędzy fragmentami jak poniżej):
    Kod:
    <a class="prodname f-row" href="{route function=$productRoute key=$product->product->product_id productName=$product->translation->name
    productId=$product->product->product_id}" title="{$product->translation->name|escape}">
    <span class="productname">{$product->translation->name|escape}</span>
    </a>
                                   
    <div class="product-short-description resetcss large" style="height:30px;">
    {$product->translation->short_description}
    </div>
    
    {if $product->product->producer_id}
    Wartość 'Height' ustawiasz sama w zależności od długości opisu. Wydaje mi się, że u Ciebie nie trzeba będzie za wiele zmieniać. U mnie hula, ale przetestuj dokładnie na swoim sklepie.

    Następnie znajdujesz poniższy wiersz i dopisujesz do niego 'style' (inaczej może ucinać sam dół - "zobacz więcej") - wysokość ustawiasz po swojemu.
    Kod:
    <div class="product s-grid-3 product-main-wrap" style="height:430px;">
    Odsuwanie nazwy produktu od ceny (teraz jest najbliżej):
    Kod:
    <span class="productname" style="height:0px;">{$product->translation->name|escape}</span>
    ----------------------------------

    Co do drugiego pytania - temat był już szczegółowo omawiany, zatem nie będę powtarzał, tylko podeślę linka, gdzie padły konkretne porady:
    https://forum.home.pl/threads/brak-...jego-wyswietlania-oraz-wielkosc-czcionki.318/
     
    Ostatnia modyfikacja: 6 Październik 2015
  16. drk001

    drk001 Stały bywalec

    Wiadomości:
    36
    Docenione treści:
    0
    Po tych zmianach jeszcze zostaje czerwony kolor ceny w sekcji "ostatnio oglądane" a także po kliknięciu na produkt i wybraniu "pokaż więcej". Prośba o informację jak zmienić te kolory i przy okazji kolory "gwizdeczek"
     

    Załączone pliki:

    • 0003.jpg
      0003.jpg
      Rozmiar pliku:
      110,2 KB
      Wyświetleń:
      618
  17. TheL

    TheL @Lider VIP Beta-tester

    Wiadomości:
    2 403
    Docenione treści:
    535
  18. drk001

    drk001 Stały bywalec

    Wiadomości:
    36
    Docenione treści:
    0
  19. TheL

    TheL @Lider VIP Beta-tester

    Wiadomości:
    2 403
    Docenione treści:
    535
    kolor ceny:
    Kod:
    .product .price em {
    color: #d13684;
    font-size: 1.4em;
    font-style: normal;
    line-height: 22px;
    }
    
    oczywiście d13684 to jakiś kolor, tu należy wstawić taki jaki chcemy.
     
  20. TheL

    TheL @Lider VIP Beta-tester

    Wiadomości:
    2 403
    Docenione treści:
    535
    i przy pokaż więcej:
    Kod:
    .product-innerdesc-wrap .price em {
    color: #d13684;
    font-size: 1.4em;
    }
    
     

Poleć forum znajomym