Support » Thema en CSS/opmaak » sidebar uit winkel woocommerce verwijderen

  • Opgelost juulzelf

    (@juulzelf)


    Ik ben bezig met een webshop (woocommerce) binnen de TWenty Fourteen omgeving. Op alle pagina’s kan ik aangeven of ik de standaard template wil gebruiken (incl sidebar rechts) of de hele pagina breedte wil benutten (zonder sidebar rechts). Op iedere pagina werkt dit behalve op de “winkel” pagina.Ook heb ik de plugin Display Widgets gebruikt. Ook hiermee gaat de sidebar niet weg. Wat ik ook zo jammer vind is dat de knoppen “In Winkelmand” te groot zijn en in elkaar overlopen. Ik hoop het met een volledige pagina breedte dit op te lossen maar ja, de Winkel pagina staat dit blijkbaar niet toe.

    Hoe kan ik:
    De winkel pagina over volledige breedte showen of
    Hoe kan ik de knoppen In Winkelmand kleiner maken?

    Website: http://www.shirleyskeuken.nl/winkel/

10 reacties aan het bekijken - 1 tot 10 (van in totaal 10)
  • Hi,

    ’t Is een overzichtelijk klusje. Werk nauwkeurig, stap voor stap.

    1. Installeer en activeer eerst de plugin ‘SuperSlider-Perpost-Code’; Zo kan je voor elke pagina apart css-code opgeven om ‘m naar je hand te zetten. Zo voorkom je dat door één wijziging je nergens meer een sidebar hebt… 😉
    2. open de betreffende pagina in de dashboard-editor en scroll naar beneden
    3. Je ziet dat er twee vakken bij zijn gekomen om de aanpassingen -voor die betreffende pagina / bericht- te maken [custom CSS en custom JS]
    4. plaats de volgende code in het CSS-vak en sla de wijzigingen op
    5. .content-sidebar {
      	display: none;
      }

      Nu is de sidebar verdwenen, maar de rest van de pagina is nog niet op de volle breedte.

      div.twfc{
         max-width:900px;
         float:right;
         margin-right:-300px !important;
      }

      De presentatie van de winkel pagina / knoppen, verbeter je zo bijvoorbeeld:

      div.twfc ul.products{
         width:700px !important; /*zo heeft de boel genoeg 'ademruimte'*/
      }

      == == ==
      Als je theme een optie heeft om de CSS aan te passen, bijvoorbeeld in een ‘custom css’-veld, plaats dan de aanpassing[en] aan je css hierin.
      Ontbreekt een dergelijke optie in je theme? Volg dan de instructies hieronder.

      Alternatief: Voeg bovenstaande code toe aan style.css van je CHILDtheme.
      Zo voorkom je dat al je aanpassingen worden overschreven als de makers van je theme een update installeren.
      Verder heeft het als voordeel dat alle aanpassingen overzichtelijk bij elkaar staan. Dat is makkelijk, overzichtelijk en eenvoudiger te onderhouden.

      Kies je ooit een ander theme, dan dien je een nieuw childtheme te maken.

      Heb je nog geen childtheme?

    1. installeer en activeer ‘one click childtheme’-plug-in
    2. activeer de originele theme
    3. Dashboard > weergave > child theme
    4. beantwoordt de vragen op het scherm
      >> er wordt een child theme aangemaakt in een map met bestanden zoals style.css;
    5. Activeer het childtheme.
    6. ==

    7. om je site aan te passen, maak je nu alle wijzigingen in de map en bestanden van je child theme.
      – Maak je aanpassingen in style.css van het childtheme;
      – mocht je aanpassingen willen maken in de originele php-bestanden, kopieer de betreffende php-file uit het originele theme naar de map van het childtheme. Maak hierin dan de gewenste aanpassingen.

    == == == Extra
    Als je precies wilt zien welke elementen je site heeft en welke opmaak-kenmerken [css] daarbij horen,rechtsklik en kies ‘element inspecteren’, of installeer dan bijv de browser-add-on ‘firebug’.

    Zo kan je op zoek naar de diverse elementen en de kenmerken zoals kleuren, layout etc. aanpassen.

    == == == ik wil echt GEEN childtheme [en begrijp het probleem van het aanpassen van het originele theme…]
    Zet de bovenstaande code dan ONDERAAN het bestand ‘styles.css’ van je thema. Ververs je browser <CTRL-F5>.

    Thread starter juulzelf

    (@juulzelf)

    Ik werk idd met een Child Theme.
    Ik ga even verder puzzelen. Met de code content sidebar none is de sidebar weg…..maar wel op alle pagina’s terwijl ik het alleen maar wil laten gelden op 1 pagina (winkel). Nu is de mooie functionaliteit van de sidebar uitgeschakeld 😉

    Sorry, ik zie dat bovenstaande antwoord onduidelijkiheden en tegenstrijdigheden bevat.
    De toevoegingen onderaan bovenstaand advies, slaan op algemene uitschakeling van de sidebar.

    Dit geeft het door jou gewenste resultaat:

    1. Installeer en activeer de plugin ‘SuperSlider-Perpost-Code’;
    2. open de pagina / het bericht in de dashboard-editor
    3. scroll en voeg de code toe aan de betreffende pagina
    4. sla de wijzigingen op
    Thread starter juulzelf

    (@juulzelf)

    Dat heb ik ook al geprobeerd en dat werkt ook niet. Het probleem zit hem denk ik dat ik op een WooCommerce pagina wil toepassen. Op iedere pagina lukt het, behalve op de Winkel-Pagina…….

    Ik heb die CSS op jouw site uitgeprobeerd, en hij werkte…
    Ik zal nog’s kijken…

    Thread starter juulzelf

    (@juulzelf)

    Ik probeer hem ook zojuist uit op de volgende pagina’s:
    Winkel – sidebar blijft
    Glossary – weg sidebar

    Raar….

    Ik heb naar een alternatief gekeken…

    Probeer dit eens MET behulp van de plugin ‘SuperSlider-Perpost-Code’;

    #widget_twentyfourteen_ephemera-2{
    	   display:none;
    }
    Thread starter juulzelf

    (@juulzelf)

    Helaas. Ik heb dit MET behulp van de plugin ‘SuperSlider-Perpost-Code’ geprobeerd. Hij blijft mooi staan….ook al zet ik het onder aan de pagina css plugin.

    Op iedere andere pagina werkt dit (bijv contactpag), maar niet op de winkel pagina. Het is WooCommerce die “dwars” ligt. Maar hoe los ik dit op?
    Krijg het niet met de plugin gedaan en niet met de “volle breedte pagina” van het thema. WooCommerce lijkt leidend te zijn…..

    Iemand anders nog een briljant idee?

    Thread starter juulzelf

    (@juulzelf)

    Gelukt met de lpugin “Dynamic Widgets” !

    Mooi speurwerk!
    Fijn dat ’t gelukt is.

10 reacties aan het bekijken - 1 tot 10 (van in totaal 10)
  • Het onderwerp ‘sidebar uit winkel woocommerce verwijderen’ is gesloten voor nieuwe reacties.