Virtuemart webshop vraag.

Stevesh · 2 nov 2012

Hallo,

Ik hoop dat iemand van jullie mij zou kunnen helpen.
Het gaat om de volgende webshop; www.HoogeboomZeilmakerij.nl

Probleem is het volgende;
Als ik naar een willekeurige cattegorie ga, vervolgens een willekeurig artikel (wél met afbeelding)
is de foto eigenlijk veel te groot voor het venster. Ik wil graag dat hij die foto's automatisch resized naar (gokje?) 300 x 300 px ?
Eventueel dat als je op de afbeelding links druk, dat je dan een vergrote versie krijg van die afbeelding.
En dat de "1e" afbeelding ook bij het rij'tje onder staat met overige afbeeldingen (miniaturen)

Hoop dat ik het zo een beetje duidelijk heb kunnen uitleggen?
Alvast bedankt!

Steve

TimVN · 5 nov 2012

Voeg het volgende eens toe aan http://www.hoogeboomzeilmakerij.nl/components/com_virtuemart/assets/css/vmsite-ltr.css
(Ik neem aan dat je FTP hebt)

Code:

#medium-image {
    width: 300px;
    height: 300px;
}

Maakt niet uit waar je het in de code zet. Overigens kun je je afvragen of VM hier zelf geen optie voor heeft want nu 'bakken we het in' het CSS bestand.

Stevesh · 6 nov 2012

TimVN,

Thnx! het is gelukt. Nu zou ik alleen nog graag willen dat als ik op de afbeelding klik, ik de vergrote versie krijg. is dit ook mogelijk??
Ook zou ik eventueel een strook/border om de afbeeldingen willen van 1px, als dit mogelijk is.
En ik zit nog met een paar vraagjes; bij categorie Aluminium en ijzerwaren, artikel; Haakprofiel & Kniestuk 90 graden. zegt hij dat die niet te bestellen zijn?
Bij categorie Gereedschap, kan ik niet naar pagina '2' navigeren???
De knop "Stel een vraag over dit artikel" (staat nu uit) maar die werkt niet als ik die inschakel, ik krijg gewoon een leeg wit venster??

En als laatste; De balk met "U bevind zich hier: Home > Webshop > Aanbiedingen"
klopt niet helemaal? is dat een Joomla fout, of een VM fout? En hoe kan ik dit oplossen?

verder kan ik weinig mankementen vinden.
kun jij/iemand anders mij hiermee helpen svp?

Alvast bedankt allen!
Steve

TimVN · 9 nov 2012

Specifieke vragen over VM zou ik op hun forum vragen. Voeg voor een border dit aan het stukje css toe wat ik je eerder heb gegeven:

Code:

border: 1px solid black;

Succes verder!

Ps. Sorry voor het late antwoord; was eventjes gevloerd door een vriendelijke koorts van 40 graden

Stevesh · 21 nov 2012

aha ik ben er ook al een tijdje niet geweest. Bedankt trouwens! dát werkt in ieder geval..

Maar ik vindt dat de webshop op zich niet helemaal goed werkt. misschien als je een kijkje neem, dat het
jou ook wel opvalt? weet jij zo waar dat in kan zitten?

ps. weer volledig hersteld?

TimVN · 21 nov 2012

Wat werkt er niet goed dan? Het is wel zo dat sommige dingen niet lekker uitgelijnd worden en dergelijke maar dat is puur design werk en geen technisch werk. Voor de rest lijkt alles bij mij prima te werken.

Stevesh · 21 nov 2012

hmm... ik heb de pagina navigatie sinds vanochtend uitstaan.. en sindsdien weinig geprobeerd. Maar ik merk inderdaad nu ook weinig 'navigeer'-problemen.

dankje voor je hulp!
heb je verder nog tips of ideeën om het aan te passen, verbeteren?

TimVN · 21 nov 2012

Geen probleem!
Het enige wat ik op kan merken is dat sommige dingen Engels zijn. Dit kun je veranderen in je language files. Ik neem aan dat je NL al geselecteerd heb, want veel dingen die ook uit de taal bestanden wordt gehaald is wel Nederlands. Ze bevinden zich in languages/nl-NL/com_virtuemart overigens.

Ohja! Je winkelwagen/uit check pagina wordt niet zo mooi uitgelijnd. Ik zie dat er gebruik wordt gemaakt van 960Gris System.
http://www.hoogeboomzeilmakerij.nl/templates/photoscape/css/grid.css staat op lijn 38 float: left; Dit heeft 960GS dus ik raad je aan in het winkelwagen bestand zelf bij div class="12" het volgende toe te voegen: style="float: center;".

Dus:

Code:

<div class='grid_12' style='float: left;'>

Stevesh · 21 nov 2012

.. dus ik ga naar "vmsite-ltr.css" en daar moet ik toevoegen (maakt niet uit waar?) <div class='grid_12' style='float: left;'> ?

of zit ik er nu helemaal naast?

Thnx alvast.

Stevesh · 21 nov 2012

ohnee ik moet naar: "/domains/hoogeboomzeilmakerij.nl/public_html/templates/photoscape/css/grid.css" ?? als ik het goed bekijk.

ik kom er nog niet helemaal goed uit... ik zie namelijk nergens zoiets als <div class=........>

/*
960 Grid System ~ Core CSS.
Learn more ~ http://960.gs/

Licensed under GPL and MIT.
*/

/* =Containers
--------------------------------------------------------------------------------*/

.container_12,
.container_16
{
width: 92%;
margin-left: 4%;
margin-right: 4%;
}

/* =Grid >> Global
--------------------------------------------------------------------------------*/

.grid_1,
.grid_2,
.grid_3,
.grid_4,
.grid_5,
.grid_6,
.grid_7,
.grid_8,
.grid_9,
.grid_10,
.grid_11,
.grid_12,
.grid_13,
.grid_14,
.grid_15,
.grid_16
{
display: inline;
float: left;
margin-left: 1%;
margin-right: 1%;
}

.container_12 .grid_3,
.container_16 .grid_4
{
width: 23%;
}

.container_12 .grid_6,
.container_16 .grid_8
{
width: 48%;
}

.container_12 .grid_9,
.container_16 .grid_12
{
width: 73%;
}

.container_12 .grid_12,
.container_16 .grid_16
{
width: 98%;
}

/* =Grid >> Children (Alpha ~ First, Omega ~ Last)
--------------------------------------------------------------------------------*/

.alpha
{
margin-left: 0;
}

.omega
{
margin-right: 0;
}

/* =Grid >> 12 Columns
--------------------------------------------------------------------------------*/

.container_12 .grid_1
{
width: 6.333%;
}

.container_12 .grid_2
{
width: 14.666%;
}

.container_12 .grid_4
{
width: 31.333%;
}

.container_12 .grid_5
{
width: 39.666%;
}

.container_12 .grid_7
{
width: 56.333%;
}

.container_12 .grid_8
{
width: 64.666%;
}

.container_12 .grid_10
{
width: 81.333%;
}

.container_12 .grid_11
{
width: 89.666%;
}

/* =Grid >> 16 Columns
--------------------------------------------------------------------------------*/

.container_16 .grid_1
{
width: 4.25%;
}

.container_16 .grid_2
{
width: 10.5%;
}

.container_16 .grid_3
{
width: 16.75%;
}

.container_16 .grid_5
{
width: 29.25%;
}

.container_16 .grid_6
{
width: 35.5%;
}

.container_16 .grid_7
{
width: 41.75%;
}

.container_16 .grid_9
{
width: 54.25%;
}

.container_16 .grid_10
{
width: 60.5%;
}

.container_16 .grid_11
{
width: 66.75%;
}

.container_16 .grid_13
{
width: 79.25%;
}

.container_16 .grid_14
{
width: 85.5%;
}

.container_16 .grid_15
{
width: 91.75%;
}

/* =Prefix Extra Space >> Global
--------------------------------------------------------------------------------*/

.container_12 .prefix_3,
.container_16 .prefix_4
{
padding-left: 25%;
}

.container_12 .prefix_6,
.container_16 .prefix_8
{
padding-left: 50%;
}

.container_12 .prefix_9,
.container_16 .prefix_12
{
padding-left: 75%;
}

/* =Prefix Extra Space >> 12 Columns
--------------------------------------------------------------------------------*/

.container_12 .prefix_1
{
padding-left: 8.333%;
}

.container_12 .prefix_2
{
padding-left: 16.666%;
}

.container_12 .prefix_4
{
padding-left: 33.333%;
}

.container_12 .prefix_5
{
padding-left: 41.666%;
}

.container_12 .prefix_7
{
padding-left: 58.333%;
}

.container_12 .prefix_8
{
padding-left: 66.666%;
}

.container_12 .prefix_10
{
padding-left: 83.333%;
}

.container_12 .prefix_11
{
padding-left: 91.666%;
}

/* =Prefix Extra Space >> 16 Columns
--------------------------------------------------------------------------------*/

.container_16 .prefix_1
{
padding-left: 6.25%;
}

.container_16 .prefix_2
{
padding-left: 12.5%;
}

.container_16 .prefix_3
{
padding-left: 18.75%;
}

.container_16 .prefix_5
{
padding-left: 31.25%;
}

.container_16 .prefix_6
{
padding-left: 37.5%;
}

.container_16 .prefix_7
{
padding-left: 43.75%;
}

.container_16 .prefix_9
{
padding-left: 56.25%;
}

.container_16 .prefix_10
{
padding-left: 62.5%;
}

.container_16 .prefix_11
{
padding-left: 68.75%;
}

.container_16 .prefix_13
{
padding-left: 81.25%;
}

.container_16 .prefix_14
{
padding-left: 87.5%;
}

.container_16 .prefix_15
{
padding-left: 93.75%;
}

/* =Suffix Extra Space >> Global
--------------------------------------------------------------------------------*/

.container_12 .suffix_3,
.container_16 .suffix_4
{
padding-right: 25%;
}

.container_12 .suffix_6,
.container_16 .suffix_8
{
padding-right: 50%;
}

.container_12 .suffix_9,
.container_16 .suffix_12
{
padding-right: 75%;
}

/* =Suffix Extra Space >> 12 Columns
--------------------------------------------------------------------------------*/

.container_12 .suffix_1
{
padding-right: 8.333%;
}

.container_12 .suffix_2
{
padding-right: 16.666%;
}

.container_12 .suffix_4
{
padding-right: 33.333%;
}

.container_12 .suffix_5
{
padding-right: 41.666%;
}

.container_12 .suffix_7
{
padding-right: 58.333%;
}

.container_12 .suffix_8
{
padding-right: 66.666%;
}

.container_12 .suffix_10
{
padding-right: 83.333%;
}

.container_12 .suffix_11
{
padding-right: 91.666%;
}

/* =Suffix Extra Space >> 16 Columns
--------------------------------------------------------------------------------*/

.container_16 .suffix_1
{
padding-right: 6.25%;
}

.container_16 .suffix_2
{
padding-right: 16.5%;
}

.container_16 .suffix_3
{
padding-right: 18.75%;
}

.container_16 .suffix_5
{
padding-right: 31.25%;
}

.container_16 .suffix_6
{
padding-right: 37.5%;
}

.container_16 .suffix_7
{
padding-right: 43.75%;
}

.container_16 .suffix_9
{
padding-right: 56.25%;
}

.container_16 .suffix_10
{
padding-right: 62.5%;
}

.container_16 .suffix_11
{
padding-right: 68.75%;
}

.container_16 .suffix_13
{
padding-right: 81.25%;
}

.container_16 .suffix_14
{
padding-right: 87.5%;
}

.container_16 .suffix_15
{
padding-right: 93.75%;
}

/* =Clear Floated Elements
--------------------------------------------------------------------------------*/

/* http://sonspring.com/journal/clearing-floats */

html body * span.clear,
html body * div.clear,
html body * li.clear,
html body * dd.clear
{
background: none;
border: 0;
clear: both;
display: block;
float: none;
font-size: 0;
list-style: none;
margin: 0;
padding: 0;
overflow: hidden;
visibility: hidden;
width: 0;
height: 0;
}

/* http://www.positioniseverything.net/easyclearing.html */

.clearfix:after
{
clear: both;
content: '.';
display: block;
visibility: hidden;
height: 0;
}

.clearfix
{
display: inline-block;
}

* html .clearfix
{
height: 1%;
}

.clearfix
{
display: block;
}

TimVN · 21 nov 2012

Klopt, want wat ik je gaf is HTML. Ik zou het niet direct in de CSS aanpassen (wat jij nu gepakt heb) omdat het misschien op meerdere plekken gebruikt wordt, en dat kan andere dingen weer raar maken

Op deze pagina: http://www.hoogeboomzeilmakerij.nl/index.php/component/virtuemart/Winkelwagen
Staat in de bron:

Code:

<div class="grid_12">

Je moet even vinden welk PHP script dit stukje HTML genereert en het veranderen in wat ik je eerder gaf. Dan ziet je pagina er een stuk mooier uit:

Virtuemart webshop vraag.

Stevesh

Gebruiker

TimVN

Gebruiker

Stevesh

Gebruiker

TimVN

Gebruiker

Stevesh

Gebruiker

TimVN

Gebruiker

Stevesh

Gebruiker

TimVN

Gebruiker

Stevesh

Gebruiker

Stevesh

Gebruiker

TimVN

Gebruiker

Nieuwste berichten

Wij waarderen jouw privacy