Skip to main content

Welkom bij Joomla!NL

Om alle mogelijkheden van dit forum te kunnen gebruiken, moet je je eerst registreren.

Vermeld in iedere vraag duidelijk:
  1. De versie van Joomla! 5.X die je gebruikt
  2. De volledige url van je website indien mogelijk.
  3. De versie van de extensie waar de vraag over gaat.

Aanpassing css in child template

Aanpassing css in child template

13 jan 2026 16:14
#1
Hallo ik heb een website gebouwd met Cassiopeia en een child template genaamd Cassiopeia_orion.
Ik wil het gedrag van de afbeelding in de banner positie aanpassen (mod_custom117) en probeerde dat in file "‎/templates/cassiopeia_orion/user.css" in template "cassiopeia_orion".
Opgeslagen, browser cache geleegd, pagina opnieuw geladen maar toch staan de oude background eigenschappen ongewijzigd wanneer ik de code  inspecteer.
Doe ik dat in de verkeerde user.css of werkt dat niet of anders bijeen child template?
Graag jullie reactie.

Inloggen of Een account aanmaken om te kunnen reageren.

  • Gertve
  • Gertve's berichtenfoto Heeft onderwerp gestart
  • Joomla!NL ontdekker
  • Joomla!NL ontdekker
  • Berichten: 42

Aanpassing css in child template

13 jan 2026 16:40
#2
Je user.css staat niet goed. Is ook handiger om deze via Websitetemplates - Gegevens en Bestanden aan te maken. Normaal is het pad: /media/templates/site/cassiopeia_child
Waarbij child natuurlijk staat voor de childnaam die je zelf hebt aangemaakt.
Groetjes, Astrid
Gebruik de zoekfunctie van dit forum voordat je een nieuwe vraag plaatst.
Vragen uitsluitend via dit forum.
yndi.nl - kvk 17157725
Is je vraag beantwoord? Dan kan je het draadje zelf sluiten .
Wil je Joomla!NL steunen? Dat kan met een donatie.

Inloggen of Een account aanmaken om te kunnen reageren.

  • Astrid
  • Astrid's Profielfoto
  • Moderator + Technisch team
  • Moderator + Technisch team
  • Berichten: 37849

Aanpassing css in child template

15 jan 2026 15:38
#3
Dank je voor je antwoord Astrid. In mijn post heb ik de padnaam gekopieerd zoals die op het Joomla scherm afgebeeld wordt.
De betreffende user.css file heeft als volledige padnaam: (Mijn webnsite URL)/templates/cassiopeia_orion/user.css
Deze is ook gewoon via het beheerpaneel Systeem, Website templates aangemaakt.
Er staat niks over templates in de media map. Alleen maar com_* en plg* zaken.
Ik gebruik Joomla versie 5.4.2. Levert dat een padnaam verschil op?
 

Inloggen of Een account aanmaken om te kunnen reageren.

  • Gertve
  • Gertve's berichtenfoto Heeft onderwerp gestart
  • Joomla!NL ontdekker
  • Joomla!NL ontdekker
  • Berichten: 42

Aanpassing css in child template

15 jan 2026 16:10
#4
Ik heb nog even verder gezocht maar de file staat inderdaad toch ook opgeslagen: media/templates/cassiopeia_orion/user.css
Dus in ieder geval op de juiste plek.

Inloggen of Een account aanmaken om te kunnen reageren.

  • Gertve
  • Gertve's berichtenfoto Heeft onderwerp gestart
  • Joomla!NL ontdekker
  • Joomla!NL ontdekker
  • Berichten: 42

Aanpassing css in child template

15 jan 2026 16:23
#5
Heel vreemd. Die bestanden staan al in de media map sinds Joomla 4.1. In de map templates/cassiopeia zou alleen standaard een map html moeten staan. 
Heb je een link naar je site zodat er meegekeken kan worden?
Groetjes, Astrid
Gebruik de zoekfunctie van dit forum voordat je een nieuwe vraag plaatst.
Vragen uitsluitend via dit forum.
yndi.nl - kvk 17157725
Is je vraag beantwoord? Dan kan je het draadje zelf sluiten .
Wil je Joomla!NL steunen? Dat kan met een donatie.

Inloggen of Een account aanmaken om te kunnen reageren.

  • Astrid
  • Astrid's Profielfoto
  • Moderator + Technisch team
  • Moderator + Technisch team
  • Berichten: 37849

Aanpassing css in child template

15 jan 2026 21:27
#6
De site staat op  gertvaneck-natuurfotografie.nl
 

Inloggen of Een account aanmaken om te kunnen reageren.

  • Gertve
  • Gertve's berichtenfoto Heeft onderwerp gestart
  • Joomla!NL ontdekker
  • Joomla!NL ontdekker
  • Berichten: 42

Aanpassing css in child template

16 jan 2026 09:11
#7
Lijkt erop dat je child template niet geladen wordt. Ik zie de user.css niet. Kan hem wel direct openen (met de juiste url). Dit staat erin:
Code:
<div  class="topbar">         <p style="text-align: right;"><a style="text-decoration: none;" href="/nf-shop">Shop</a> | <a style="text-decoration: none;" href="/nf-contactformulier">Contact</a> | <a style="text-decoration: none;" href="/nf-aanmelden">Aanmelden </a></p>        </div> #mod-custom117 {     background-image: url(/images/banners/EM1B8765-2147x1006.jpg);     background-position: center;     background-size: 170% auto;     height: auto;     background-attachment: scroll;     background-color: white; } @media (min-width: 700px) {     #mod-custom117 {         background-size: 100% auto;     } }
Waarbij dit natuurlijk geen css definitie is en niet in die bestand thuishoort:
Code:
<div  class="topbar">         <p style="text-align: right;"><a style="text-decoration: none;" href="/nf-shop">Shop</a> | <a style="text-decoration: none;" href="/nf-contactformulier">Contact</a> | <a style="text-decoration: none;" href="/nf-aanmelden">Aanmelden </a></p>        </div>
Verder wil ik je aanraden om je headerafbeelding op maat te maken en terug te brengen naar 72 dpi. 
Groetjes, Astrid
Gebruik de zoekfunctie van dit forum voordat je een nieuwe vraag plaatst.
Vragen uitsluitend via dit forum.
yndi.nl - kvk 17157725
Is je vraag beantwoord? Dan kan je het draadje zelf sluiten .
Wil je Joomla!NL steunen? Dat kan met een donatie.

Inloggen of Een account aanmaken om te kunnen reageren.

  • Astrid
  • Astrid's Profielfoto
  • Moderator + Technisch team
  • Moderator + Technisch team
  • Berichten: 37849

Aanpassing css in child template

16 jan 2026 14:13
#8
Dag Astrid. Bedankt zover. Die code heeft iemand voor mij gemaakt (geen Joomla kenner) omdat dat niet tot mijn vaardigheden behoort.
Ik ben nu als volgt te werk gegaan.
1. ik heb die code er uit gehaald -om met schone lei te beginnen
2. ik heb de afbeelding zoals jij aangaf naar 72 dpi gezet en op het formaat van de demo afbeelding: 1140x600 gemaakt. Of dit het juiste formaat is weet ik niet. Ik heb heel veel gegoogled naar informatie over de Cassiopeia banner positie maar heb geen documentatie gevonden. Is de afmeting van het demo bestand de juiste afmeting?
3. Ik heb nu een redelijk resultaat online staan, alleen het gedrag van het plaatje op die positie is niet naar mijn zin. Namelijk wanneer de breedte van de browser kleiner wordt - bijvoorbeeld op de ipad of telefoon, dan zie je alleen het midden van het plaatje en dat is in dit geval weinig inspirerend. Ik zou willen dat het plaatje gewoon geschaald wordt dat op een telefoon het hele plaatje in beeld blijft. Als voorbeeld kan ik verwijzen naar mijn profiel op zoom.nl/profiel/gert-van-eck waar ik hetzelfde plaatje gebruik maar waar het wel schaalt.

Ik weet helaas niet hoe ik dat aan moet pakken. Was de code die ik kreeg ongeschikt daarvoor, of het ik die op de verkeerde manier geïntegreerd?

Bedankt dat je er naar kijkt.
 

Inloggen of Een account aanmaken om te kunnen reageren.

  • Gertve
  • Gertve's berichtenfoto Heeft onderwerp gestart
  • Joomla!NL ontdekker
  • Joomla!NL ontdekker
  • Berichten: 42

Aanpassing css in child template

16 jan 2026 16:05
#9
Ik zie zo geen oplossing. Zie dat je kickstartcassiopeia gebruikt en dan is het heel lastig om dit soort zaken aan te passen. De constructie van die voorbeeldsite die je geeft is heel anders. Als ik de afbeelding goed krijg, dan klopt de overlay niet meer, dus zie zo helaas geen oplossing.
Groetjes, Astrid
Gebruik de zoekfunctie van dit forum voordat je een nieuwe vraag plaatst.
Vragen uitsluitend via dit forum.
yndi.nl - kvk 17157725
Is je vraag beantwoord? Dan kan je het draadje zelf sluiten .
Wil je Joomla!NL steunen? Dat kan met een donatie.

Inloggen of Een account aanmaken om te kunnen reageren.

  • Astrid
  • Astrid's Profielfoto
  • Moderator + Technisch team
  • Moderator + Technisch team
  • Berichten: 37849

Aanpassing css in child template

16 jan 2026 16:43
#10
Ik ben nog geen probleem tegengekomen bij gebruik van kickstartcassiopeia en aanpassing via de user.css maar dat was dan wel in de hoofdsite die ook kickstartcassiopeia gebruikt en die aanpassingen zijn wel gewoon meegenomen in het child template caasiopeia_orion.
Waarom zou het lastig zijn bij gebruik van kickstartcassiopeia?
Is dat de oorzaak waarom de eerdere definities niet overgenomen werden in de live site?

 

Inloggen of Een account aanmaken om te kunnen reageren.

  • Gertve
  • Gertve's berichtenfoto Heeft onderwerp gestart
  • Joomla!NL ontdekker
  • Joomla!NL ontdekker
  • Berichten: 42

Aanpassing css in child template

16 jan 2026 17:05
#11
Het gaat mij alleen om jouw vraag om de banner afbeelding netjes te laten schalen. Overigens heb je bij kickstartcasiopeia helemaal geen user.css nodig. 
En vraag me ook af waarom je een child template gebruikt. 
Groetjes, Astrid
Gebruik de zoekfunctie van dit forum voordat je een nieuwe vraag plaatst.
Vragen uitsluitend via dit forum.
yndi.nl - kvk 17157725
Is je vraag beantwoord? Dan kan je het draadje zelf sluiten .
Wil je Joomla!NL steunen? Dat kan met een donatie.

Inloggen of Een account aanmaken om te kunnen reageren.

  • Astrid
  • Astrid's Profielfoto
  • Moderator + Technisch team
  • Moderator + Technisch team
  • Berichten: 37849

Aanpassing css in child template

17 jan 2026 14:25
#12
Dit zou moeten werken:
Code:
/* Mobile: aspect ratio based on image dimensions */ .container-banner .banner-overlay {     height: 0 !important;     padding-bottom: 52.6%;     position: relative;     background-attachment: scroll !important; } .container-banner .banner-overlay .overlay {     position: absolute !important;     top: 0;     left: 0;     width: 100%; } /* Tablet and larger - use viewport heights */ @media (min-width: 768px) {     .container-banner .banner-overlay {         height: 50vh !important;         padding-bottom: 0;         background-attachment: fixed !important;     } } /* Desktop */ @media (min-width: 992px) {     .container-banner .banner-overlay {         height: 60vh !important;     } } /* Readable text on small screens */ @media (max-width: 767px) {     .container-banner .banner-overlay .overlay h1 {         font-size: 1.5rem;     }          .container-banner .banner-overlay .overlay h3 {         font-size: 1.1rem;     }          .container-banner .banner-overlay .overlay h5 {         font-size: 0.9rem;     } }
Groetjes, Astrid
Gebruik de zoekfunctie van dit forum voordat je een nieuwe vraag plaatst.
Vragen uitsluitend via dit forum.
yndi.nl - kvk 17157725
Is je vraag beantwoord? Dan kan je het draadje zelf sluiten .
Wil je Joomla!NL steunen? Dat kan met een donatie.

Inloggen of Een account aanmaken om te kunnen reageren.

  • Astrid
  • Astrid's Profielfoto
  • Moderator + Technisch team
  • Moderator + Technisch team
  • Berichten: 37849
Tijd voor maken pagina: 0.925 seconden
Gemaakt door Kunena

Wil je Joomla!NL steunen?

Steun Joomla!NLAlle teamleden werken enthousiast, op vrijwillige basis, mee aan Joomla!NL. Maar een website met forum kost nu eenmaal geld. Dus als je Joomla!NL wilt steunen, dan kan dat, graag zelfs!

Lees hier meer informatie