Widget border weghalen
DWQA Questions › Categorie: Techniek › Widget border weghalen
Koen asked 7 maanden ago
Voor mijn nieuwe website wil ik deze widget inzetten; een donkere widget die zou moeten blenden met het design van mijn footer. Echter wordt er een witte border in de iFrame om het HTML element met deze class geplaatst: wwk-widget–new_button_stars
Aangezien het een iFrame is kan ik dit niet weghalen met CSS, ook zie ik de optie niet binnen de widget editor van Webwinkelkeur. Is er een manier waarop ik deze border kan verbergen, of de kleur hiervan kan aanpassen?
Het gaat om deze widget:
<iframe src="https://dashboard.webwinkelkeur.nl/webshops/widget_html?id=1207136&layout=new_button-stars&theme=dark&color=%23212b36&show=yes&view=slider&amount=6&width=auto&width_amount=270px&height=45px&interval=5000&language=nld&#8221; scrolling="no" class="wwk-widget-iframe wwk-widget–new_button-stars–dark wwk-widget–has-tooltip–default" style="border: 0; height: 45px!important; width: 100%!important;">
Als je achter </Iframe> De CSS code typt zou je de kleur kunnen veranderen. Hieronder is een voorbeeld van deze code:
.wwk-widget–new_button_stars {
Koen answered 6 maanden ago
Dat werkt helaas niet, omdat je het iFrame niet kunt targetten met CSS. Met de CSS regel die jij voorstelt pak je alleen het <iframe> element zelf, maar niet de elementen die binnen de iFrame staan.
Is er geen andere mogelijkheid? Hiermee kan ik helaas mijn doel niet bereiken.
Ik heb het voor je nagevraagd aan onze ontwikkelaars en kreeg de volgende code.
<iframe src="https://dashboard.webwinkelkeur.nl/webshops/widget_html?id=1207136&layout=new_button-stars&theme=dark&color=%23212b36&show=yes&view=slider&amount=6&width=auto&width_amount=270px&height=45px&interval=5000&language=nld" scrolling="no" class="wwk-widget-iframe wwk-widget–new_button-stars–dark wwk-widget–has-tooltip–default" style="border: 1px solid white; height: 45px!important; width: 100%!important;">
De border is in de code hierboven van 0 naar 1px veranderd. De kleur zou je zelf nog moeten aanpassen in deze code.
Op deze pagina kun je lezen op welke wijze en in hoeverre de widget door middel van CSS code kan worden gewijzigd.