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

ROZWIĄZANE Przeniesienie wyżej koszyka w moim szablonie sklepu

Dyskusja w 'Zmiana wyglądu sklepu i edycja zaawansowana' rozpoczęta przez użytkownika www.regałka.pl, 14 Sierpień 2016.

  1. www.regałka.pl

    www.regałka.pl Wyjadacz

    Wiadomości:
    90
    Docenione treści:
    3
    Prośba o pomoc z kosmetyczną poprawką, moja strona główna obecnie wygląda tak
    glowna-obecne.png
    a chciałbym aby wyglądała tak
    glowna-docelowa.png

    Pomożecie?
     
  2. Mariusz

    Mariusz pomoc.home.pl home.pl Administrator forum

    Wiadomości:
    3 060
    Docenione treści:
    300
    @www.regałka.pl mogę spróbować to w ten sposób zmodyfikować, ale niczego nie obiecuję na 100%. Wykonaj proszę kopię szablonu w Panelu sklepu w opcji menu: "Konfiguracja" -> "Wygląd" -> "Galeria stylów". Gdy najedziesz kursorem myszki na aktywny styl graficzny to na dole miniaturki szablonu wyświetlą się cztery ikony - jedna z nich służy do duplikowania szablonu. Wykonaj to i daj znać, spróbuje na kopii szablonu się pobawić i dam znać z wynikami ;)
     
  3. Mariusz

    Mariusz pomoc.home.pl home.pl Administrator forum

    Wiadomości:
    3 060
    Docenione treści:
    300
    @www.regałka.pl odpisałem na Twoją prywatną wiadomość, zobacz proszę czy zaproponowana przez ze mnie modyfikacja powoduje przeniesienie koszyka we wskazane przez Ciebie miejsce. Jeśli będzie poprawnie, daj proszę znać, chciałbym opublikować instrukcje jak to zrobić dla potomnych, którzy w przyszłości trafią na to forum.
     
  4. www.regałka.pl

    www.regałka.pl Wyjadacz

    Wiadomości:
    90
    Docenione treści:
    3
    @Mariusz dzięki jest dużo lepiej, może nie idealnie ale duużo lepiej : )

    po_poprawkach.png
     
  5. Mariusz

    Mariusz pomoc.home.pl home.pl Administrator forum

    Wiadomości:
    3 060
    Docenione treści:
    300
    Nie widać jeszcze ikonki, coś jeszcze na to wymyślę ;-))
     
  6. TheL

    TheL @Lider VIP Moderator forum

    Wiadomości:
    2 363
    Docenione treści:
    519
    to jest w body_head.tpl, nie mogę przetestować tego ale jest fragment kodu odpowiadający za cały koszyk razem z grafiką i bez problemu można to zrobić, jednak tak jak napisałem w tplu
     
  7. Mariusz

    Mariusz pomoc.home.pl home.pl Administrator forum

    Wiadomości:
    3 060
    Docenione treści:
    300
    @TheL wykonałem odpowiednie modyfikacje w pliku body_head.tpl i dodatkowo dodałem odpowiedni wpis do Własnego stylu CSS. Kod odpowiedzialny za wyświetlanie koszyka został przeniesiony z sekcji <header class="row"> trochę wyżej do <div class="login-bar">. Z tego powodu musiałem zmienić wywołanie obrazka koszyka we Własnym stylu CSS, aby klasy się zgadzały.

    @www.regałka.pl proszę sprawdź czy teraz ikonka koszyka się wyświetla, wystarczy że przełączysz na kopię szablonu.
     
  8. TheL

    TheL @Lider VIP Moderator forum

    Wiadomości:
    2 363
    Docenione treści:
    519
    powinno Ci to zadziałać, faktycznie klasy można było zmienić
     
  9. Mariusz

    Mariusz pomoc.home.pl home.pl Administrator forum

    Wiadomości:
    3 060
    Docenione treści:
    300
    @TheL dzięki Twojej pomocy udało mi się zmodyfikować kod w taki sposób, aby przenieść koszyk (wraz z wyświetlaniem odpowiedniej ikonki).

    Poniżej przesyłam informacje jak wykonaliśmy taką zmianę u użytkownika: @www.regałka.pl (UWAGA! użytkownik korzysta z płatnego szablonu dla sklepu Click Shop, poniższa instrukcja może nie pasować przy domyślnych szablonach Click Shop).

    W pliku body_head.tpl wyciąłem ten fragment kodu (zaczynał się w linii 70):
    Kod:
     {if 1 == $skin_settings->header->basket}
                    {dynamic}
                        <div class="basket right{if 0 == $user->basket->countProducts()} empty-basket{/if}">
                            <a href="{route key='basket'}" title="{translate key='Cart'}" class="count">
                                <img src="{baseDir}/public/images/1px.gif" alt="" class="px1">
                                <span class="countlabel">
                                    <span>{translate key="Cart"}:</span>
                                    <b>
                                        {if 0 == $user->basket->countProducts()}
                                            ({translate key="empty"})
                                        {else}
                                            <b class="sum">{currency value=$user->basket->sumProducts(false)}</b>
                                            <b class="count">(<span>{$user->basket->countProducts()}</span>)</b>
                                        {/if}
                                    </b>
                                </span>
                            </a>
                        </div>
    
                        <div class="basket-contain">
                            <div class="basket-products">
                                <ul class="basket-product-list">
                                    {foreach from=$user->basket item=basket_product}
                                        <li>
                                            <img src="{imageUrl type='productGfx' width=150 height=150 image=$basket_product->stock->mainImageName() overlay=1}" alt="{$basket_product->product->translation->name|escape}" />
    
                                            <a class="product-name" href="{route function='product' key=$basket_product->product->product->product_id productName=$basket_product->product->translation->name productId=$basket_product->product->product->product_id}" title="{$basket_product->product->translation->name|escape}">
                                                {$basket_product->product->translation->name|escape}
                                         
                                                {if $basket_product->getName()}
                                                    <span class="product-variant">{$basket_product->getName()|escape}</span>
                                                {/if}
                                            </a>
    
                                            <span class="product-info">
                                                <span class="product-amount">{float precision=$QUANTITY_PRECISION value=$basket_product->basket->quantity trim=true}</span> x <span class="product-price">{currency value=$basket_product->getPrice()}</span>
                                            </span>
    
                                            <span class="remove-product"><a href="{route key='basketRemove' basketId=$basket_product->getIdentifier()}">{translate key="remove"}</a></span>
                                        </li>
                                    {/foreach}
                                </ul>
                            </div>
                     
                            <div class="basket-summery">
                                <a href="{route key='basket'}">{translate key="to checkout"}</a>
                                <span class="basket-price{if $user->basket->sumProducts(false) !== $user->basket->sumProducts()} basket-price-discount{/if}">
                                    <span class="price-total">
                                        <span>{translate key="total"}:</span>
                                        <strong class="price-products">{currency value=$user->basket->sumProducts(false)}</strong>
                                    </span>
                                    {if $user->basket->sumProducts(false) !== $user->basket->sumProducts()}
                                    <span class="price-total-discount">
                                            <span>{translate key="total (after discount)"}:</span>
                                            <strong class="price-total">{currency value=$user->basket->sumProducts()}</strong>
                                        </span>
                                    {/if}
                                </span>
                            </div>
                        </div>
                    {/dynamic}
                {/if}
    Następnie wkleiłem ten kod trochę wyżej do okolic linii 53 w pliku body_head.tpl w taki sposób, aby koszyk znalazł się w divie o nazwie "login-bar".


    Następnie do własnego stylu CSS wkleiłem poniższy kod, aby wyświetlanie ikonki koszyka działało w divie login-bar:

    Kod:
    .login-bar a.count img {
        background: url('https://www.regalka.pl/skins/store_user/store_7a15622dc11efb2b545639d0d151b05c_1/images/cart-black.png') no-repeat 96% 50%;
        width: 35px;
        height: 35px;
        display: inline-block;
        margin-right: 0px;
    }


    Po zapisaniu zmian, koszyk został przeniesiony wyżej:

    regalka1.png
     
    manky.pl lubi to.
  10. TheL

    TheL @Lider VIP Moderator forum

    Wiadomości:
    2 363
    Docenione treści:
    519
    Na przyszlość pamiętajcie o odpowiednich linkach do obrazków, to co pokazuje manager to tylko fragment linku który należy zmodyfikować.
     
  11. www.regałka.pl

    www.regałka.pl Wyjadacz

    Wiadomości:
    90
    Docenione treści:
    3
    @Mariusz potwierdzam, że jest ok, ALE w wersji na komórki jest nieco gorzej
    po lewej jak było, po prawej jak jest po zmianach

    a najlepiej by było w sumie bez tych dodatkowych linków nad logo, bo przecież te same funkcje mają 3 ikonki pod logo.
    Untitled.png
     
  12. TheL

    TheL @Lider VIP Moderator forum

    Wiadomości:
    2 363
    Docenione treści:
    519
    Wystarczy w wersji do 768 pixeli dodać do tego display:none; to się przez media w stylu robi, jak dotrę do komputera napiszę formułę.
     
  13. TheL

    TheL @Lider VIP Moderator forum

    Wiadomości:
    2 363
    Docenione treści:
    519
    Kod:
    @media screen and (max-width:768px) {
    .basket.right.empty-basket {
     display: none;
    }
    }
    
    i nie powinno być koszyka w wersji mobilnej
     
  14. Piter

    Piter Zaglądacz

    Wiadomości:
    13
    Docenione treści:
    2
    Witam serdecznie
    Pierwszy raz na forum więc proszę o wyrozumiałość :)
    Skorzystałem z opisanych w tym poście podpowiedzi i przesunąłem koszyk na górny pasek.
    Mam pytanie: jak przenieść logo na górny pasek oraz przycisk wyszukaj?

    pozdrawiam
    Piotrek
     
  15. Mariusz

    Mariusz pomoc.home.pl home.pl Administrator forum

    Wiadomości:
    3 060
    Docenione treści:
    300
    Musielibyśmy zobaczyć Twój sklep, aby sprawdzić z jakiego szablonu korzystasz. Nie sugerowałbym przeniesienia logo sklepu na górny pasek. Przeniesienie wyszukiwarki powinny być możliwe.
     
  16. Piter

    Piter Zaglądacz

    Wiadomości:
    13
    Docenione treści:
    2
    Korzystam z RWD - Clickshop (działam na kopii). W tej chwili mam wyłączony sklep. Załączam screen.
    Jeżeli można przenieść wyszukiwarkę na pasek, to czy w miejsce wyszukiwarki na wysokości logo można dać menu ?
     
  17. Mariusz

    Mariusz pomoc.home.pl home.pl Administrator forum

    Wiadomości:
    3 060
    Docenione treści:
    300
    Musiałbym zobaczyć Twój sklep jako włączony i na tej podstawie przygotować instrukcje zmiany. Wolałbym tego nie robić "na ślepo" (znając tylko szablon, z którego korzystasz). Jeśli masz taką możliwość, to utwórz proszę nowy temat i podaj w nim nazwę Twojego sklepu.
     
  18. TheL

    TheL @Lider VIP Moderator forum

    Wiadomości:
    2 363
    Docenione treści:
    519
    Wszystko można przenieść wszędzie o ile nie rozjedzie nam się styl, wiele rzeczy jest zawartych w id które to mogą być użyte tylko jeden raz na stronie przez co aby uzyskać w miejscu docelowym efekt jaki mamy w miejscu źródłowym może być konieczność zrobienia nowego id lub klasy z zawartością taką jaką miał id źródłowy :)
    menu na poziomie loga to niedobry pomysł :)
     
  19. sylwiak

    sylwiak Zaglądacz

    Wiadomości:
    11
    Docenione treści:
    0
    Cześć , może głupie to pytanie ale tak spokojnie krok po kroku jakby ktoś był tak miły i wytłumaczył mi jak można ten koszyk przesunąć na górę, jak wyżej
     
  20. Mariusz

    Mariusz pomoc.home.pl home.pl Administrator forum

    Wiadomości:
    3 060
    Docenione treści:
    300
    @sylwiak całość została opisana krok po kroku w tej odpowiedzi: https://forum.home.pl/threads/przeniesienie-wyzej-koszyka-w-moim-szablonie-sklepu.1243/#post-8483

    1. W pliku body_head.tpl wyciąłem ten fragment kodu (zaczynał się w linii 70)
    2. Następnie wkleiłem ten kod trochę wyżej do okolic linii 53 w pliku body_head.tpl w taki sposób, aby koszyk znalazł się w divie o nazwie "login-bar".
    3. Następnie do własnego stylu CSS wkleiłem podany kod, aby wyświetlanie ikonki koszyka działało w divie login-bar.
    4. Po zapisaniu zmian, koszyk został przeniesiony wyżej.
     

Poleć forum znajomym