Look van responsive blokken aanpassen

Ik had mijn categoriën altijd op 3 afbeeldingen naast elkaar staan, want ik ben niet zo'n fan van hoe mijn shop eruit ziet met de blokken indeling. Nu zie ik dat de responsive blokken grotere afbeeldingen hebben dan de oude layout opties.

Weet iemand toevallig hoe ik met ccs bij de blokken layout alle toeters en bellen (randen, bestel button, titel) weg kan halen, en het eruit kan laten zien zoals de optie met alleen afbeeldingen? Het liefst dan ook nog met het schaduw effectje wat ik nu om mijn afbeeldingen heb (http://tizzalicious.nl/haaraccessoires).

Alvast heel erg bedankt!

Als je 1 categorie op de responsive blokken zet, wil ik er wel een blik op werpen.

Geweldig, Remco! :) Ik heb de categorie "spiegeltjes" op responsive blokken gezet.

Probeer eens dit:

.glass-case ul li, #content_center .item .product_container { border:none !important; } .product_container .description { display: none !important; } div.product_list_responsive > div.item { height: 180px !important; } .item .product_container .image a img { box-shadow: 10px 10px 5px #ccc !important; }

Het werkt bijna! Alleen is de prijs dan ook weg, die wil ik wel graag houden. Weet je hoe ik dat op kan lossen?

Prijs staat er nu bij, of niet? Ik zit op pocket mirrors.

Ja, ik ben er een beetje mee aan het spelen, maar het lukt niet helemaal. Ik heb de bestelbutton en titel los weggekregen, maar de prijs staat dan in het midden van de foto, (de foto gaat erover heen). Ik heb hem kunnen verplaatsen met de code hieronder, maar dan verplaatst de tekst op de product pagina's ook naar links en onder, en valt hij zelfs buiten de middenkolom.

.glass-case ul li, #content_center .item .product_container { border:none !important; } .product_container .description { margin-top: -100px !important; margin-left: -120px !important; } div.product_list_responsive > div.item { height: 180px !important; } .item .product_container .image a img { box-shadow: 10px 10px 5px #ccc !important; padding: 10px 10px 40px !important; }

div.product_list_responsive > div.item {
    display: inline-block;
    margin-bottom: 50px;
    padding: 5px 5px 10px;
    width: 100%;
}
 
  .button_order {
    display: none !important;
}

.item .product_container .description h4 a {
    font-size: 16px;
    word-wrap: break-word;
  display: none !important;
}

Dus het is opgelost? ;)

De tekst op de productpagina staat ook in een itemprop description. Deze kan je aanduiden om de tekst hiervan de corrigeren.

div[itemprop="description"]

Dat gaat mijn code-skill teboven :P Kun je uitleggen hoe ik dat precies moet doen?

(Heeeel erg bedankt voor je hulp trouwens! Ben in ieder geval een stuk verder dan eerst!)

Ik zou ook al m'n product omschrijvingen als "in tabblad" kunnen weergeven, dat lost het probleem ook op, maar ik kan nergens vinden hoe ik de layout alle producten in 1 keer kan aanpassen. Weet jij dat? Of kan dat niet?

instellingen > vormgeving > statische pagina's > product detail pagina

Ahhh, ik zat bij producten te zoeken.

Het is gelukt, nogmaals heel erg bedankt!

Top!