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

PORADNIK Ładniejsza stopka w sklepie Click Shop

Dyskusja w 'Poradniki, gotowe rozwiązania' rozpoczęta przez użytkownika TheL, 22 Lipiec 2015.

  1. e-swiece

    e-swiece Nowicjusz

    Wiadomości:
    24
    Docenione treści:
    2
    sprawę 5 kolumny mamy rozwiązaną, tzn: brak rozwiązania :)
    a co z linią nad stopką? ja mam tak www.e-swiece.pl a chce tak www.e-dewocjonalia.eu (cieńka linia nad stopką)
    proszę o wskazówki :)
     
  2. Mariusz

    Mariusz pomoc.home.pl Moderator forum

    Wiadomości:
    3 087
    Docenione treści:
    302
    @e-swiece mam wrażenie, że widzę w obu podanych projektach ciemną linię nad stopką. Udało Ci się rozwiązać już ten temat?
     
  3. najtanszegadzety.pl

    najtanszegadzety.pl Stały bywalec

    Wiadomości:
    38
    Docenione treści:
    0

    u mnie coś drugie menu stopki nie zadziałało możesz sprawdzić co się podziało ?
     
  4. TheL

    TheL @Lider VIP Beta-tester

    Wiadomości:
    2 403
    Docenione treści:
    535
    sprawdź czy masz styl dla footgroup5, ja robiłem tylko dla 1,2,3,4, zamień w moim stylu z 3 na 5 i zadziała
     
  5. TheL

    TheL @Lider VIP Beta-tester

    Wiadomości:
    2 403
    Docenione treści:
    535
    Niedługo nowa wersja stopki w pełni RWD tylko muszę posiedzieć jeszcze trochę nad nią :D
     
    pavali lubi to.
  6. pavali

    pavali Pomocnik

    Wiadomości:
    116
    Docenione treści:
    7
    chętnie poczekam i ją wykorzystam :)
     
  7. najtanszegadzety.pl

    najtanszegadzety.pl Stały bywalec

    Wiadomości:
    38
    Docenione treści:
    0
    super działa :)
    dzięki @TheL
     
  8. TheL

    TheL @Lider VIP Beta-tester

    Wiadomości:
    2 403
    Docenione treści:
    535
    nie ma za co, cieszę się, że udało mi się pomóc :D
     
  9. TheL

    TheL @Lider VIP Beta-tester

    Wiadomości:
    2 403
    Docenione treści:
    535
    Stopka poprawiona aby dobrze skalowała się razem ze stroną.
    Wynik
    Stopka zwykła
    stopkazwykla.png
    Stopka mniejsza (po skalowaniu okna)
    stopkamniejsza.png
    Stopka mobilna
    stopkamobilna.png


    Kod CSS (wstawiamy we własny Styl)
    Kod:
    @media (max-width: 780px){
    .focla {background-color:#000000;margin-top:10px;color:#ffffff;padding-top:20px;}
    .foul {border-left: 1px solid #ffffff;border-bottom: 1px solid #ffffff;margin-bottom: 14px;padding-bottom: 0px;min-height:130px;max-width:95%;}
    .foli {color:#dadada;display:block;font-size:20px;height:30px;margin-left:10px;}
    .foa {color:#ffffff;margin-left:10px;}
    }
    @media (min-width: 780px){
    .focla {background-color:#000000;margin-top:10px;color:#ffffff;padding-top:20px;}
    .foul {border-left: 3px solid #ffffff;}
    .foli {color:#dadada;display:block;font-size:20px;height:30px;margin-left:10px;}
    .foa {color:#ffffff;margin-left:10px;}
    }
    
    Następnie edytujemy kod stopki czyli plik footer.tpl
    Konfiguracja>>Wygląd>>Aktywny styl graficzny>>Edycja zaawansowana
    Należy najechać na zębatkę i wybrać Edytuj

    Kod:

    Kod:
    <footer class="footer row">
    <div class="innerfooter container row">
    <ul class="overall{if 1 == count($footergroups)} singlecol{/if}">
    {foreach from=$footergroups item=group name=groups}
    <li class="overall flex flex-{$footergroups|count}" id="footgroup{$group->getIdentifier()}">
    <ul>
    <li class="head hidden">{$group->group->name|escape}</li>
    {foreach from=$group->links item=link name=links}
    {if $link->getHref()}
    <li>
    <a href="{$link->getHref()|escape}" {if $link->isPopup()}target="_blank"{/if} title="{$link->getTitle()|escape}" id="footlink{$link->getIdentifier()}">
    <img alt="" src="{baseDir}/public/images/1px.gif">
    {$link->getTitle()|escape}
    </a>
    
    zastępujemy kodem:

    Kod:
    <footer class="focla">
      <div class="container row">
      <ul class="overall{if 1 == count($footergroups)} singlecol{/if}">
      {foreach from=$footergroups item=group name=groups}
      <li class="overall flex flex-{$footergroups|count}" id="footgroup{$group->getIdentifier()}">
      <ul class="foul">
      <li class="foli">{$group->group->name|escape}</li>
      {foreach from=$group->links item=link name=links}
      {if $link->getHref()}
      <li class="scrfootlink">
      <a class="foa" href="{$link->getHref()|escape}" {if $link->isPopup()}target="_blank"{/if} title="{$link->getTitle()|escape}" id="footlink{$link->getIdentifier()}">
      <img alt="" src="{baseDir}/public/images/1px.gif">
      {$link->getTitle()|escape}
      </a>
      
    Testowane tylko na 4 kolumnach w stopce, nie wiem jak zachowa się z 5 i czy nie trzeba będzie wymiarów zmienić.
     
  10. najtanszegadzety.pl

    najtanszegadzety.pl Stały bywalec

    Wiadomości:
    38
    Docenione treści:
    0
    wow super ale @TheL możesz taką zmianę zrobić również dla tej stopki co proponowałeś z kolorami - jak u nas najtanszegadztey.pl
     
  11. TheL

    TheL @Lider VIP Beta-tester

    Wiadomości:
    2 403
    Docenione treści:
    535
    Przy kolorowej jest nieco więcej zabawy, w wolnej chwili poprawię kod.
     
  12. najtanszegadzety.pl

    najtanszegadzety.pl Stały bywalec

    Wiadomości:
    38
    Docenione treści:
    0
    no to ja już się nie mogę doczekać - kolorowa jest gitesik
     
  13. najtanszegadzety.pl

    najtanszegadzety.pl Stały bywalec

    Wiadomości:
    38
    Docenione treści:
    0
    czyli nie będzie kolorowej :/ :(
     
  14. TheL

    TheL @Lider VIP Beta-tester

    Wiadomości:
    2 403
    Docenione treści:
    535
    ale chodzi Ci o tą poprawioną bo jakiś czas mnie nie było i się pogubiłem :D
     
  15. najtanszegadzety.pl

    najtanszegadzety.pl Stały bywalec

    Wiadomości:
    38
    Docenione treści:
    0
    tak , mzieniłem kolorową stopkę na na stronie działa jest super ale ona się nie wyświetla prawidłowo na mobilnej wersji.
     
  16. najtanszegadzety.pl

    najtanszegadzety.pl Stały bywalec

    Wiadomości:
    38
    Docenione treści:
    0
    a dokładnie chodzi o to - zrzut
     

    Załączone pliki:

  17. yankes

    yankes Artysta

    Wiadomości:
    279
    Docenione treści:
    15
    @TheL a da rade zmniejszyc width stopki np. na 90%? zeby byla wysrodkowana? ;/
     
  18. Mariusz

    Mariusz pomoc.home.pl Moderator forum

    Wiadomości:
    3 087
    Docenione treści:
    302
    @najtanszegadzety.pl w opisanym przez Ciebie przypadku, próbowałbym ukryć te elementy za pomocą poniższego kodu:

    Kod:
    @media screen and (max-width: 767px)
    .rwd footer .innerfooter ul li {
        display: none;
    }
    Kod ten powinien spowodować nie wyświetlanie zaznaczonych przez Ciebie na zrzucie ekranu elementów na wersji mobilnej sklepu. Oznacza to, że po włączeniu mobilnej wersji sklepu, pokazane na zrzucie elementy zostaną ukryte. Sprawdź czy działa to poprawnie u Ciebie na sklepie w wersji mobilnej.
     
  19. najtanszegadzety.pl

    najtanszegadzety.pl Stały bywalec

    Wiadomości:
    38
    Docenione treści:
    0
    a gdzie to mam wklić we własny CSS ?
     
  20. Mariusz

    Mariusz pomoc.home.pl Moderator forum

    Wiadomości:
    3 087
    Docenione treści:
    302
    Tak dokładnie. Wklejenie zaproponowanego przez ze mnie kodu we "Własny CSS" powinno spowodować nie wyświetlanie zaznaczonego przez Ciebie elementu na wersji mobilnej sklepu.
     

Poleć forum znajomym