Hoe aangepaste CSS toevoegen in Elementor?

Hoe aangepaste CSS toevoegen in Elementor

Als je op mij lijkt, heb je veel ideeën voor je website die je tot leven wilt zien komen. En hoewel Elementor het gemakkelijk maakt om unieke ontwerpen te maken met drag-and-drop functies en vooraf gebouwde elementen, kan soms niets de kracht van pure CSS vervangen. In dit artikel behandelen we hoe u aangepaste CSS kunt toevoegen in Elementor, zodat u uw websiteontwerp nog verder kunt brengen!

3 populaire manieren om aangepaste CSS toe te voegen in Elementor

Er zijn verschillende manieren om aangepaste CSS toe te voegen in Elementor. Laten we eens kijken naar onze top 3 manieren om dat te doen.

  • Gebruik de WordPress customizer
  • Gebruik een CSS-plugin
  • HTML-widget gebruiken

Gebruik de WordPress customizer.

Volg deze stappen om aangepaste CSS-code toe te voegen in Elementor:

  • Ga naar Uiterlijk > Aanpassen
  • Klik in de WordPress customizer op Extra CSS.
  • De sectie Extra CSS wordt geopend. U kunt hier code toevoegen door deze in het tekstvak te plakken of op de knop Aangepaste CSS toevoegen te klikken om naar uw bestand op uw computer te bladeren.

Gebruik een CSS-plugin

Er zijn verschillende plugins op de markt, zoals Simple CSS, Custom CSS Pro, en CSS Hero, waarmee u aangepaste CSS kunt toevoegen aan Elementor.

Ga om te beginnen naar Custom CSS & JS > Add Custom CSS en klik op Add CSS Code.

Links verschijnt een eenvoudige CSS-editor. U kunt ervoor kiezen om de CSS-code intern of in een extern stylesheet te laden met behulp van de configuratie-opties aan de rechterkant. Bovendien kunt u kiezen of de code in de header of de footer hoort: 

aangepaste css toevoegen in wordpress

Als u klaar bent met het bewerken van de CSS-code, drukt u op de knop Publiceren

Opmerking: Schakel over naar een front-end weergave om de code in actie te zien.

HTML-widget gebruiken

U kunt een HTML-widget gebruiken om aangepaste CSS aan Elementor toe te voegen. Voor deze optie hoeft u alleen maar de HTML-widget te slepen en uw CSS-code toe te voegen in een Style-tag. 

Aangepaste CSS is een manier om aangepaste code aan uw website toe te voegen. Het kan voor veel dingen worden gebruikt, van het veranderen van het uiterlijk van uw website tot het toevoegen van extra functionaliteit.

Nu u weet hoe u aangepaste CSS kunt toevoegen, kunt u het op uw websites gebruiken door deze stappen te volgen:

  • Open het editorvenster van Elementor en klik op het '+'-pictogram linksboven.
  • Click ‘Custom Code’ and then paste in this piece of code: `.elementor-custom-css{display:none;}`. You can find this under Settings > Custom CSS or Appearance > Theme Options > Custom CSS (depending on which version of WordPress you have).

Conclusie

Nu u weet hoe u aangepaste CSS kunt toevoegen, kunt u profiteren van de flexibiliteit van Elementor. De volgende keer dat iets zich niet gedraagt zoals verwacht, probeer dan wat CSS-code toe te voegen in plaats van het op te lossen met een plugin of themawijziging!

Relevante inhoud

Gerelateerde berichten

n2y case study
Casestudie
Komal Bothra

Case Study: N2Y

The world of special education requires dedicated attention, specialized tools, and a deep understanding

Komal Bothra September 22, 2023

Case Study: N2Y

The world of special education requires dedicated attention, specialized tools, and a deep understanding of

Casestudie
Komal Bothra September 22, 2023

Google Keyword Planner: A Complete Guide

You may explore potential keywords for inclusion in your Search Network advertising campaigns with the

SEO
Komal Bothra September 18, 2023

Best WordPress Import Plugins 2023

In the ever-evolving world of WordPress, there's often a moment where we find ourselves needing

WordPress

Aan de slag met Seahawk

Meld je aan in onze app om onze prijzen te bekijken en kortingen te krijgen.
Skip to content