css van een grid pagina

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Pagina: 1 2 volgende »

Peet Peterse

Peet Peterse

16/10/2019 11:46:54
Quote Anchor link
Beste collega's,
Ik heb een klein probleempje waar ik zelf niet uitkom.
De producten op mijn webshop worden op categorie pagina mooi getoond maar op artikel pagina minder!!! deze staan namelijk niet aan de rechte klant van het scherm. Alle pagina's zijn met Grid gemaakt.
kan ik iemand door privé massage de link naar de pagina geven zodat via inspecteren kun zien wat en waar aangepast moet worden?
Alvast bedankt voor de moeite.
 
PHP hulp

PHP hulp

28/03/2024 14:12:08
 
Rob Doemaarwat

Rob Doemaarwat

16/10/2019 12:17:33
Quote Anchor link
Eh, gooi het in de groep! Als iedereen via privé bericht gaat antwoorden heb je geen overzicht.
 
Peet Peterse

Peet Peterse

16/10/2019 12:20:33
Quote Anchor link
tja vanwege mijn eigen privacy !!!! maat toch hier de link naar de pagina.
alle product pagina's worden aan de rechte klant getoond.
https://www.kitchenetteonline.nl/Kitchenette-180cm-incl-inbouw-koelkast-en-vaatwasser-RAI-2020
 
- Ariën  -
Beheerder

- Ariën -

16/10/2019 12:42:02
Quote Anchor link
Privacy staat er los van. Als je door anderen wilt geholpen worden, en privacy is belangrijk, zorg dat er niks met privacy te zien is. Zet dan desnoods een minimale testcase op met dummy-data.

Haal de 'col-md-9' eens weg?

Edit:
Onnodig bericht verwijderd. We mogen hier ook gewoon advies geven.
Gewijzigd op 16/10/2019 13:56:55 door - Ariën -
 
Peet Peterse

Peet Peterse

16/10/2019 14:38:12
Quote Anchor link
Beste Arien,
Als ik deze weghaal:

"col-xs-12 col-md-9"

Dan staat precies goed zoals ik het wil maar ik kan niet bij HTML code zou u een css code kunnen doorgeven waarmee het waarmee ik de class-naam kan wijzigen!!!

het staat in de HTML code als volgd:

<div class="col-xs-12 col-md-9">

Alvast dank voor de moeite.
 
- Ariën  -
Beheerder

- Ariën -

16/10/2019 14:51:42
Quote Anchor link
Hoezo kan je niet bij de HTML?
Dit is wel de enige juiste weg.
 
Peet Peterse

Peet Peterse

16/10/2019 14:59:32
Quote Anchor link
CCV shop is mijn platform wij kunnen wel de code css en html etc op de eerste pagina aanpassen maar ook de index.html maar niet de categorie en product pagina, dat is afgeschermd!!!!

Is er geen ander oplossing voor? ik wil namelijk op product pagina net onder de prijs nog een Button (ontwerp je eigen keunen) plaatsen maar dat kan ook niet !!!!

Hoop dat hier een oplossing voor is.
 
- Ariën  -
Beheerder

- Ariën -

16/10/2019 15:18:14
Quote Anchor link
Bij CCV een oplossing zoeken, lijkt mij.
Uit een eerdere ervaring met hun zijn ze hier erg behulpzaam in, hoor. :-)
 
Peet Peterse

Peet Peterse

16/10/2019 22:11:42
Quote Anchor link
Ja dat is ook zo maar dat valt onder betaalde diensten van ccvshop ik zou hem zelf op een ander manier willen oplossen maar dat kan dus niet! kan ik het niet met css omzeilen!!!???
 
- Ariën  -
Beheerder

- Ariën -

16/10/2019 22:51:05
Quote Anchor link
Het zou kunnen, maar ik vrees dat je dan een plakband-constructie verzint die de bestaande bootstrap om zeep helpt. Of ik bedenk mij net dat je met vanilla Javascript of jQuery de HTML-elementen kan manipuleren. Maar ook dit blijf ik een ranzige 'hack' vinden.

Volgens mij kan je bij CCV toch ook een eigen template toevoegen (via hun klantenservice), die je in eigen beheer hebt? Of werk je nu vanuit een standaard template die ze aanbieden?
 
Peet Peterse

Peet Peterse

16/10/2019 22:54:58
Quote Anchor link
nee ik werk nu inderdaad met een soort eigen template en kan bij ProTom (hoe die ook heet) maar zoals ik al zie je kan toch niet bij product pagina, ik het het nagevraagd en dat kan zeker niet dat laten zij niet toe oid, waarom? weet ik ook niet, ik heb in de Header die gele button zelf aan toegevoegd en zodoende kom ik in de wereld van Grid binnen!!! helemaal nieuw maar erg leuk om te leren en te werken....
 
- Ariën  -
Beheerder

- Ariën -

16/10/2019 22:59:23
Quote Anchor link
Dus je hebt geen eigen template? Ik denk dat je beter aan hun kunt vragen wat een goede oplossing is om de productpagina aan te passen.
Misschien moet je dan toch wel akkoord gaan dat ze de ondersteuning alleen bieden als je ervoor betaalt.

Maar voor de vrije mogelijkheden die je dan hebt, dan lijkt het mij wel waard.
Gewijzigd op 16/10/2019 23:00:27 door - Ariën -
 
Peet Peterse

Peet Peterse

16/10/2019 23:23:04
Quote Anchor link
okay dat is jammer dan zit er niets anders op dan betalen en laten aanpassen.
Bedankt voor de moeite tot zover wellicht kom ik hierop terug om te laten weten hoe het opgelost is.
 
Rob Doemaarwat

Rob Doemaarwat

17/10/2019 00:01:15
Quote Anchor link
Een hack is een hack - wie is er niet groot mee geworden ;-) Als je die gele knop toegevoegd hebt, dan kun je toch ook onderstaande stukje script toevoegen:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
<script>
$(function(){
  if(!$('#sidebar').text().trim()) $('#sidebar').hide();
});
</script>
Of in gewoon Nederlands: als de sidebar "leeg" is (en spaties negeren we hierbij), dan verberg je 'm (die $(function() constructie er omheen is om er voor te zorgen dat ie 'm pas uitvoert als de pagina compleet is - de sidebar komt namelijk pas na de gele knop / header).

Ik vind het niet eens zo'n hele ranzige hack (als ie niet werkt, zit je hooguit weer met die lege vlek links, maar er gaat niks stuk - denk/hoop/vermoed ik).
Gewijzigd op 17/10/2019 00:03:38 door Rob Doemaarwat
 
Peet Peterse

Peet Peterse

17/10/2019 23:18:31
Quote Anchor link
Beste Rob,
Dank voor uw tip, hij werkt perfect maar mag ik een opmerking maken dat de artikel lijnt u links uit (zoals ik het graag wou) maar aan de rechte kant is nog ruimte, kan ik het 100% breed maken? ik ben sowieso erg blij met uw oplossing hoor maar dit is een extraatje.
 
Rob Doemaarwat

Rob Doemaarwat

17/10/2019 23:32:50
Quote Anchor link
De <div> na de sidebar heeft de content, dus via een jQuery next() kun je die dan aanpassen:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
<script>
$(function(){
  if(!$('#sidebar').text().trim()) $('#sidebar').hide().next().css('width','100%');
});
</script>

Hiermee wordt het wel wat tricky-er, omdat een wijziging in de template er voor kan zorgen dat de volgorde van de <div>'s wijzigt, en dan werkt die next() dus niet meer zoals bedoeld.
 
Peet Peterse

Peet Peterse

17/10/2019 23:35:07
Quote Anchor link
Superrrrrr, dank u wel Rob, ik ben er erg goed mee geholpen en mijn dank hiervoor. Fijne avond nog :-)

Toevoeging op 17/10/2019 23:37:00:

o mag ik nog wat vragen:
op de product pagina wil ik onder de bestel knop ook zo'n gele knop (ontwerp zelf je keuken) plaatsen! is dat ook mogelijk?
 
Rob Doemaarwat

Rob Doemaarwat

18/10/2019 00:20:52
Quote Anchor link
Nou ja, hetzelfde laken een pak hè. Volgens mij is dat de #OrderButton1, dus dan:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
<script>
$(function(){
  //hide sidebar
  if(!$('#sidebar').text().trim()) $('#sidebar').hide().next().css('width','100%');
  //add extra button
  $('#OrderButton1').after('<input onclick="window.location.href=\'https://www.kitchenetteonline.nl/Keuken-Configurator\'" style="width: 100%; padding: 3px; cursor: pointer; box-shadow: 6px 6px 5px; #999; -webkit-box-shadow: 6px 6px 5px #999; -moz-box-shadow: 6px 6px 5px #999; font-weight: bold; background: #ffff00; color: #000; border-radius: 10px; border: 1px solid #999; font-size: 150%; margin-top: 10px" type="button" value="Ontwerp zelf je keuken" />');
});
</script>

Als je overigens ook de CSS aan kunt passen/invoegen, dan zou het netter zijn om die hele style="..." riedel in een CSS blok te zetten, en dan beide buttons enkel nog een class="ontwerp-zelf-je-keuken" mee te geven:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
<style>
input.ontwerp-zelf-je-keuken{
  width: 100%;
  padding: 3px;
  cursor: pointer;
  box-shadow: 6px 6px 5px; #999;
  -webkit-box-shadow: 6px 6px 5px #999;
  -moz-box-shadow: 6px 6px 5px #999;
  font-weight: bold;
  background: #ffff00;
  color: #000;
  border-radius: 10px;
  border: 1px solid #999;
  font-size: 150%;
}
#OrderButton1 + input.ontwerp-zelf-je-keuken{
  margin-top: 10px
}
</style>
<script>
$(function(){
  //hide sidebar
  if(!$('#sidebar').text().trim()) $('#sidebar').hide().next().css('width','100%');
  //add extra button
  $('#OrderButton1').after('<input onclick="window.location.href=\'https://www.kitchenetteonline.nl/Keuken-Configurator\'" class="ontwerp-zelf-je-keuken" type="button" value="Ontwerp zelf je keuken" />');
});
</script>
Gewijzigd op 18/10/2019 01:43:00 door Rob Doemaarwat
 
Peet Peterse

Peet Peterse

18/10/2019 10:51:28
Quote Anchor link
Beste Rob,
Ik kan ook inderdaad bij op css pagina. Heb uw code daar op neer gezet maar zie de gele knop niet op product pagina wellicht heb ik wat fout gedaan.
Graag hoor ik wat u hiervan vindt.
 
Rob Doemaarwat

Rob Doemaarwat

18/10/2019 10:57:04
Quote Anchor link
Sowieso staat elke snippet van hierboven er nu in. Alleen de laatste volstaat (de sidebar wordt nu 3x verborgen ...). Daarnaast moet de "add extra button" code ook in de $(function(){...}), anders wordt ie te vroeg uitgevoerd (ik zag dat ook pas later, heb dat om 01:43 dus nog even aangepast ;-) ).
 
Peet Peterse

Peet Peterse

19/10/2019 21:17:22
Quote Anchor link
Ik heb de code in css geplaatst maar zie helaas nog steeds de gele button niet! wellicht heb ik wat fout gedaan!!!
 

Pagina: 1 2 volgende »



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.