Per aggiungere uno stile personalizzato tramite CSS personalizzato a un determinato widget Elementor, è necessario conoscere il selettore del widget associato. Abbiamo raccolto l'elenco dei selettori di widget Elementor per facilitare il tuo lavoro.
Ogni widget Elementor - e i suoi elementi - ha un selettore CSS che puoi utilizzare per indirizzare il widget associato quando desideri aggiungere CSS personalizzati per ottenere un determinato stile. Puoi trovare il selettore controllando il widget a cui vuoi aggiungere il CSS personalizzato.
Innanzitutto, seleziona il selettore dell'elemento che desideri scegliere come target (ad esempio, l'icona del pulsante). Nel pannello delle impostazioni dell'elemento, vai alla scheda avanzato e apri il blocco CSS personalizzato.
accedere selector [selector name] {} nel campo CSS personalizzato.
Ecco l'esempio.
Quindi aggiungi il tuo contenuto CSS (dichiarazione) tra parentesi graffe.
Ecco l'esempio.
Nota: Ogni widget Elementor ha un elemento padre (wrapper). accedere selector {} (senza il nome del selettore) significa indirizzare il wrapper.
Elenco di selezione dei widget di Elementor
Fisarmonica
Il widget
.elementor-fisarmonica
Titolo della fisarmonica
.elementor-fisarmonica-titolo
Descrizione della fisarmonica
.elementor-tab-content
Icona della fisarmonica aperta
.icona-elementor-fisarmonica
Icona della fisarmonica chiusa
.elementor-accordion-icon-chiuso
Mettere in guardia
Il widget
.elementor-avviso
Titolo avviso
.titolo-avviso-elementor
Descrizione avviso
.descrizione-avviso-elementor
Icona Ignora
.elementor-alert-elimina
Titolo animato
Il widget
.elementor-titolo
Testo statico
.elementor-titolo-testo-normale
Testo dinamico
.elementor-headline-wrapper-dinamico
Descrizione archivio
Archivio testo
.elementor-titolo-intestazione
Archivia post
Il widget
.elementor-widget-container
Posta articolo
.elemento-griglia-elemento
Immagine in primo piano
.elementor-post__thumbnail
Distintivo sulla skin delle carte
.elementor-post__badge
Avatar sulla skin delle carte
img.avatar
Area del contenuto del testo
.elementor-post__text
Titolo del post
.elementor-post__title
post estratto
.elementor-post__estratto
Scopri di più
.elementor-post__leggi-di più
Area meta-posta
.elementor-post__meta-dati
Data di pubblicazione
.elementor-post-data
Post autore
.elementor-post-autore
Tempo di pubblicazione
.elementor-post-tempo
Invia commento
.elementor-post-avatar
Impaginazione
.elementor-impaginazione
Etichetta precedente
.numeri-pagina.prec
etichetta successiva
.numeri-pagina.successivo
Numero di impaginazione
.numeri di pagina
Numero di impaginazione attiva
.numeri-pagina.corrente
Pulsante Carica altro
.elemento-pulsante-link
Carica più icona del pulsante
.icona-pulsante-elementor
Box dell'autore
Il widget
.elementor-author-box
Avatar
.elementor-author-box__avatar
Nome dell'autore
.elementor-autore-box__nome
Autore Bio
.elementor-author-box__bio
Pulsante Archivia
.elementor-author-box__pulsante
Galleria di base
Il widget
.elementor-galleria-immagini
Elemento della galleria
.gallery-elemento
Didascalia
.wp-didascalia-testo
blockquote
Il widget
.elementor-blockquote
Contenuto tra virgolette
.elementor-blockquote__content
Autore di citazioni in blocco
.elementor-blockquote__author
Icona Tweet
.elementor-blockquote__tweet-button
Etichetta Tweet
.elementor-blockquote__tweet-label
Pulsante
Il widget
.pulsante-elementor
Testo pulsante
.elementor-pulsante-testo
Icona del pulsante
.icona-pulsante-elementor
Call to Action
Il widget
.elementor-cta
Immagine intestazione
.elementor-cta__bg
Nastro
.elementor-nastro
Testo della barra multifunzione
.elementor-nastro-interno
Titolo del contenuto
.elementor-cta__titolo
Descrizione del contenuto
.elementor-cta__descrizione
Pulsante Contenuto
.elementor-cta__button
Conto alla rovescia
Il widget
.elementor-countdown-wrapper
Giorni
.elementor-conto alla rovescia-giorni
Ore
.elementor-conto alla rovescia-ore
Minuti
.elementor-conto alla rovescia-minuti
secondi
.elementor-conto alla rovescia-secondi
Etichetta conto alla rovescia
.elementor-etichetta-conto alla rovescia
contatore
Il widget
.elementor-contatore
Prefisso numerico
.elemento-contatore-numero-prefisso
Numero
.contatore-elemento-numero
Suffisso numerico
.suffisso-numero-contatore-elemento
Titolo
.elementor-contro-titolo
Divisore
Il widget
.elementor-divisore
Separatore
.elementor-divisore-separatore
Elemento testo/icona
.elemento-divisore__elemento
Flip box
Il widget
.elementor-flip-box
Contenitore frontale
.elementor-flip-box__front
Contenitore posteriore
.elementor-flip-box__back
Contenitore di contenuto
.elementor-flip-box__layer__inner
Titolo del contenuto
.elementor-flip-box__layer__title
Descrizione del contenuto
.elementor-flip-box__layer__description
Pulsante Contenuto
.elementor-flip-box__pulsante
Modulo
Il widget
.elementor-forma
Contenitore per gradini
.e-form__indicatori
Numero di passi
.e-form__indicatori__indicatore
Etichetta di campo
.elementor-etichetta-campo
Testo del campo
.elementor-campo-testuale
Etichetta campo di testo
.elemento-campo-tipo-testo
Etichetta del campo dell'area di testo
.elementor-field-type-textarea
Etichetta campo e-mail
.elementor-field-type-email
Etichetta campo URL
.elementor-field-type-url
Etichetta campo tel
.elementor-tipo-campo-tel
Etichetta campo radio
.elementor-field-type-radio
Seleziona Etichetta campo
.elementor-field-type-select
Casella di controllo Etichetta campo
.casella-di-controllo-tipo-campo-elemento-
Accettazione etichetta campo
.accettazione-tipo-campo-elementor
Etichetta campo data
.elementor-field-type-date
Etichetta del campo dell'ora
.elementor-tipo-campo-ora
Etichetta campo numero
.numero-tipo-campo-elemento
Etichetta campo caricamento file
.elementor-field-type-upload
Pulsante Successivo
e-form__buttons__wrapper__button-next
Pulsante precedente
.e-form__buttons__wrapper__button-precedente
Invia Button
.pulsante-elementor
Galleria
Titolo della galleria (per più gallerie)
.elementor-gallery-titolo
Elemento della galleria
.elementor-galleria-elemento
Descrizione (su Overlay)
.elementor-gallery-item__description
Titolo
Il widget
.elementor-titolo-intestazione
Icona
Il widget
.icona-elementor
icona Box
Il widget
.elementor-icon-box-wrapper
Icona
.icona-elementor
Contenitore di contenuto
.elementor-icon-box-content
Titolo del contenuto
.elementor-icon-box-titolo
Descrizione del contenuto
.elementor-icon-box-descrizione
Elenco delle icone
Icona elenco
.elemento-icona-elenco-icona
ListText
.elementor-icon-list-text
Immagine
Immagine
img
Didascalia
.wp-didascalia-testo
immagine Box
Immagine
.elementor-image-box-img
Contenitore di testo
.elementor-image-box-content
Titolo del contenuto
.elementor-immagine-box-title
Descrizione del contenuto
elementor-immagine-box-descrizione
Immagine Carousel
Contenitore di immagini
.swiper-slitta
PictureItem
.swiper-slide-immagine
Contenitore di impaginazione
.swiper-impaginazione
Impaginazione a punti
.swiper-impaginazione-proiettile
Icona precedente
.elementor-swiper-pulsante-prec
Avanti
.elementor-pulsante-swiper-successivo
Didascalia immagine
.elementor-image-carousel-caption
Carosello multimediale
Elemento multimediale
.elementor-carousel-immagine
Sovrapposizione elemento multimediale
.elementor-carousel-image-overlay
Impaginazione a punti
.frazione-impaginazione-swiper
Pulsante precedente
.eicon-chevron-sinistra
Pulsante Successivo
.eicon-chevron-destra
Impaginazione della frazione
.frazione-impaginazione-swiper
Impaginazione della barra di avanzamento
.swiper-pagina-avanzamento-barra
Riempimento paginazione barra di avanzamento
.swiper-impaginazione-barra di avanzamento-riempimento
Nav Menu
Toggle Menu mobile
.elementor-menu-toggle
Icona del menu mobile
.eicon-barra-menu
Menù normale
.menu-nav-elementor
Discesa
.elementor-nav-menu–menu a discesa
Voce di menu con sottomenu
.elementor-item.ha-sottomenu
Voce del sottomenu
.elementor-sottovoce
Pulsante PayPal
Il widget
.pulsante-pagamento-elementor
Icona del pulsante PayPal
.icona-pulsante-elementor
Testo del pulsante PayPal
.elementor-pulsante-testo
Portfolio
Articolo portafoglio
.elementor-portfolio-item
Elemento del portafoglio su sovrapposizione
.elementor-portfolio-item__overlay
Titolo sovrapposto
.elementor-portfolio-item__title
Filtro portafoglio
.elementor-portfolio__filter
Pubblica commenti
Titolo della risposta
.commento-risposta-titolo
Come Area Forma
.modulo di commento
Modulo di commento
.commento-modulo-commento
Invia Button
.invio-modulo
Informazioni sul post
Il widget
.elementor-post-info
Avatar
.elementor-avatar
Elenco delle icone
.elemento-icona-elenco-icona
Testo icona
.elementor-icon-list-text
Post Navigation
Il widget
.elementor-post-navigazione
Icona precedente
.post-navigazione__freccia-prec
Etichetta precedente
.etichetta post-navigazione__prev
Titolo post precedente
.post-navigation__prev–titolo
Icona successiva
.post-navigazione__arrow-next
etichetta successiva
.post-navigation__next–etichetta
Titolo del prossimo post
.post-navigation__next–titolo
Post
Posta articolo
.elementor-post
Immagine in primo piano
.elementor-post__thumbnail
Distintivo sulla skin delle carte
.elementor-post__badge
Avatar sulla skin delle carte
img.avatar
Area del contenuto del testo
.elementor-post__text
Titolo del post
.elementor-post__title
post estratto
.elementor-post__estratto
Scopri di più
.elementor-post__leggi-di più
Area meta-posta
.elementor-post__meta-dati
Data di pubblicazione
.elementor-post-data
Post autore
.elementor-post-autore
Tempo di pubblicazione
.elementor-post-tempo
Invia commento
.elementor-post-avatar
Impaginazione
.elementor-impaginazione
Etichetta precedente
.numeri-pagina.prec
etichetta successiva
.numeri-pagina.successivo
Numero di impaginazione
.numeri di pagina
Numero di impaginazione attiva
.numeri-pagina.corrente
Pulsante Carica altro
.elemento-pulsante-link
Carica più icona del pulsante
.icona-pulsante-elementor
Titolo del post
Il widget
.elementor-titolo-intestazione
Prezzo di listino
Il widget
.elementor-listino
Voce di elenco
.elementor-listino-voce
Immagine dell'elemento dell'elenco
.elementor-listino-immagine
Testo dell'elemento dell'elenco
.elementor-listino-testo
Intestazione elemento elenco
.elementor-listino-intestazione
Titolo dell'elemento dell'elenco
.elementor-listino-titolo
Elenco elementi separatore
.elementor-listino-separatore
Prezzo articolo di listino
.elementor-prezzo-di-listino
Voce di elenco Descrizione
.elementor-descrizione-listino-prezzi
Tabella dei prezzi
Il widget
.elementor-tabella-prezzo
Intestazione tabella
.elementor-price-table__header
Titolo dell'intestazione della tabella
.elementor-price-table__heading
Descrizione dell'intestazione della tabella
.elementor-prezzo-tabella__subheading
Prezzo
.elementor-tabella-prezzo__prezzo
Valuta
.elementor-price table__currency
Numero dopo prezzo
.elementor-tabella-prezzo__dopo-prezzo
Periodo di prezzo
.elementor-tabella-prezzo__periodo
Area dell'elenco delle funzioni
.elementor-tabella-prezzo__elenco-caratteristiche
Voce dell'elenco delle caratteristiche
.elementor-price-table__feature-inner
Piè di pagina della tabella
.elementor-prezzo-tabella__footer
Pulsante piè di pagina della tabella
.elementor-tabella-prezzi__pulsante
Testo del piè di pagina della tabella
.elementor-tabella-prezzi__additional_info
Nastro
.tabella-prezzo-elementor__ribbon
Nastro interno
.elementor-tabella-prezzi__ribbon-inner
Barra di avanzamento
Barra di avanzamento
.elementor-barra-di-avanzamento
Sfondo di progresso
.elementor-progress-wrapper
Titolo di avanzamento
.elementor-titolo
Testo interno del progresso
.elementor-progress-testo
Percentuale di avanzamento
.elementor-percentuale di progresso
Tracker dei progressi
Il widget
.elementor-scrolling-tracker
Progressi
.percentuale-di-avanzamento-corrente
Recensioni
Il widget
.elementor-swiper
Recensione articolo
.swiper-slitta
Testata di revisione
.elementor-testimonial__header
Revisore di immagini
.elementor-testimonial__image
Nome revisore
.elementor-testimonial__name
Titolo del revisore
.elementor-testimonial__title
Contenuto della testimonianza
.elementor-testimonial__content
Testo di testimonianza
.elementor-testimonial__text
Impaginazione a punti
.swiper-impaginazione-proiettile
Impaginazione della frazione
.frazione-impaginazione-swiper
Corrente di impaginazione della frazione
.swiper-impaginazione-corrente
Frazione Impaginazione Totale
.totale-impaginazione-swiper
Impaginazione della barra di avanzamento
.swiper-pagina-avanzamento-barra
Riempimento paginazione barra di avanzamento
.swiper-impaginazione-barra di avanzamento-riempimento
Sebbene Elementor offra molte opzioni di stile per ogni widget, puoi andare oltre con CSS personalizzato. Per applicare uno stile personalizzato a un widget (o ai suoi elementi) tramite CSS personalizzato, è necessario conoscere il selettore del widget associato.
Puoi semplicemente ispezionare un widget su una pagina live per trovare il suo selettore. Per farti risparmiare tempo, abbiamo creato l'elenco dei selettori di widget di Elementor in modo che tu non debba ispezionare tutti i widget da solo.
Conclusione
Ecco! Ti abbiamo appena presentato l'elenco dei selettori di widget Elementor. Se hai dubbi su come arrivarci, faccelo sapere all'interno commentaires.
Privacy e cookie: questo sito utilizza i cookie. Continuando a utilizzare questo sito web, acconsenti al loro utilizzo.
Per saperne di più, incluso come controllare i cookie, vedere qui:
Politica sui cookie
