Doriți să găsiți selectoarele de widget-uri Elementor ?
Una dintre caracteristicile disponibile pe Elementor Pro este capacitatea de a adăuga CSS personalizat. Această caracteristică vă permite să mergeți mai departe, deoarece puteți aplica orice stil atunci când stilul dorit nu este disponibil în lista de opțiuni de setare.
Pentru a adăuga stil personalizat prin CSS personalizat unui anumit widget Elementor, trebuie să cunoașteți selectorul widget-ului asociat. Am colectat lista de selectoare de widget-uri Elementor pentru a vă ușura munca.
Fiecare widget Elementor - și elementele sale - are un selector CSS pe care îl puteți folosi pentru a viza widgetul asociat atunci când doriți să adăugați CSS personalizat pentru a obține un anumit stil. Puteți găsi selectorul inspectând widgetul la care doriți să adăugați CSS-ul personalizat.
Deoarece inspectarea unui widget se poate face numai pe o pagină live, va dura mult timp pentru a inspecta fiecare. Asta ne-a determinat să creăm această listă.
Cum se folosește un selector
Să presupunem că doriți să aplicați o dimensiune diferită între pictogramă și text pe un buton. Deoarece opțiunea de setare implicită nu vă permite să setați o dimensiune diferită între pictograma butonului și text, puteți realiza acest lucru prin CSS personalizat. Puteți viza pictograma sau textul pentru a aplica CSS personalizat.
Mai întâi, selectați selectorul elementului pe care doriți să-l vizați (de exemplu, pictograma butonului). În panoul de setări ale elementelor, accesați fila avansat și deschide blocul CSS personalizate.
introduce selector [selector name] {} în câmpul CSS personalizat.
Iată exemplul.
Apoi adăugați-vă cuprins CSS (declarație) între paranteze.
Iată exemplul.
Remarque: Fiecare widget Elementor are un element părinte ( wrapper ). introduce selector {} (fără numele selectorului) înseamnă a viza învelișul.
Lista selectorului de widgeturi Elementor
Acordeon
Widgetul
.elementor-acordeon
Titlul acordeului
.elementor-acordeon-titlu
Descrierea acordeonului
.elementor-fila-conținut
Pictograma Acordeon Deschis
.elementor-acordeon-icoană
Pictograma acordeon închisă
.elementor-acordeon-icoană-închis
Alerta
Widgetul
.elementor-alerta
Titlul alertei
.elementor-alerta-titlu
Descrierea alertei
.elementor-alerta-descriere
Pictograma de respingere
.elementor-alertă-revocare
Titlu animat
Widgetul
.elementor-titlu
Text static
.elementor-titlu-text simplu
Text dinamic
.elementor-headline-dynamic-wrapper
Descrierea arhivei
Text de arhivare
.elementor-titlu-titlu
Arhivați postări
Widgetul
.elementor-widget-container
Postați articolul
.elementor-grilă-articol
Imagine Recomandate
.elementor-post__thumbnail
Insigna pe pielea cărților
.elementor-post__insignă
Avatar pe pielea cărților
img.avatar
Zona de conținut text
.elementor-post__text
titlul articolului
.elementor-post__title
Post Excerpt
.elementor-post__extras
Citeste mai mult
.elementor-post__citește-mai mult
Post Meta Zona
.elementor-post__meta-date
Data post
.elementor-post-date
Autorul postului
.elementor-post-autor
Ora de postare
.elementor-post-time
Posteaza un comentariu
.elementor-post-avatar
Paginație
.elementor-paginare
Eticheta anterioară
.numerele-paginii.prev
următoarea etichetă
.numerele-paginii.urmatorul
Numărul de paginare
.numerele-paginii
Număr de paginare activă
.numerele-paginii.actuale
Buton Încărcare mai mult
.elementor-buton-link
Pictograma Buton Încărcare mai mult
.pictogramă-buton-elementor
Caseta de autor
Widgetul
.elementor-author-box
Avatar
.elementor-author-box__avatar
Autor Denumirea
.elementor-author-box__name
Autorul Bio
.elementor-author-box__bio
Butonul Arhivare
.elementor-author-box__button
Galeria de bază
Widgetul
.elementor-galerie-imagini
Articol Galerie
.articol-galerie
Legendă
.wp-caption-text
Blockquote
Widgetul
.elementor-blockquote
Blockquote Conținut
.elementor-blockquote__conținut
Blockquote Autor
.elementor-blockquote__autor
Pictograma Tweet
.elementor-blockquote__tweet-button
Tweet Etichetă
.elementor-blockquote__tweet-label
Buton
Widgetul
.buton-elementor
Buton Text
.elementor-buton-text
Pictogramă buton
.pictogramă-buton-elementor
Chemare la acțiune
Widgetul
.elementor-cta
Imagine antet
.elementor-cta__bg
Panglică
.elementor-panglică
Text panglică
.elementor-panglică-interior
Titlul conținutului
.elementor-cta__title
Descrierea conținutului
.elementor-cta__descriere
Butonul de conținut
.elementor-cta__button
Countdown
Widgetul
.elementor-numaratoare inversa-wrapper
Zi
.elementor-zile-număratoare inversă
ore
.elementor-ore-număratoare inversă
minute
.elementor-număratoare inversă-minute
secunde
.elementor-numaratoare inversa-secunde
Etichetă numărătoare inversă
.etichetă-elementor-countdown-
Contracara
Widgetul
.elementor-contor
Prefix de număr
.element-număr-număr-prefix
Număr
.număr-număr-elementor
Sufixul numărului
.element-număr-număr-sufix
Titlu
.elementor-contra-titlu
compas
Widgetul
.elementor-divizor
Separator
.elementor-divizor-separator
Element text/pictogramă
.elementor-divizor__element
Flip box
Widgetul
.elementor-flip-box
Container frontal
.elementor-flip-box__front
BackContainer
.elementor-flip-box__back
Container de conținut
.elementor-flip-box__layer__inner
Titlul conținutului
.elementor-flip-box__layer__title
Descrierea conținutului
.elementor-flip-box__layer__description
Butonul de conținut
.buton-elementor-flip-box__
Formă
Widgetul
.elementor-formă
Container pas
.e-form__indicatori
Numărul pașilor
.e-form__indicatori__indicator
Etichetă de câmp
.elementor-câmp-etichetă
Textul câmpului
.elementor-câmp-textual
Etichetă câmp text
.elementor-câmp-tip-text
Eticheta câmpului zonei de text
.elementor-câmp-tip-textarea
Eticheta câmpului de e-mail
.elementor-field-type-email
Eticheta câmpului URL
.elementor-field-type-url
Etichetă câmp Tel
.elementor-câmp-tip-tel
Radio Field Label
.radio-tip-câmp-elementor
Selectați Eticheta câmpului
.elementor-câmp-tip-selectare
Casetă de selectare Etichetă câmp
.elementor-field-type-checkbox
Acceptarea etichetei câmpului
.elementor-câmp-tip-acceptare
Eticheta câmpului de dată
.elementor-câmp-tip-date
Eticheta câmpului de timp
.element-câmp-tip-timp
Eticheta câmpului numeric
.element-câmp-tip-număr
Eticheta câmpului de încărcare a fișierului
.elementor-field-type-upload
Butonul următor
e-form__buttons__wrapper__button-next
Butonul anterior
.e-form__buttons__wrapper__button-anterior
trimiteţi butonul
.buton-elementor
Galerie
Titlul galeriei (pentru mai multe galerii)
.elementor-galerie-titlu
Articol Galerie
.elementor-galerie-articol
Descriere (pe suprapunere)
.elementor-galerie-articol__descriere
Rubrică
Widgetul
.elementor-titlu-titlu
Icoană
Widgetul
.elementor-icoană
pictograma de Box
Widgetul
.elementor-icoană-cutie-wrapper
Icoană
.elementor-icoană
Container de conținut
.elementor-pictogramă-conținut-cutie
Titlul conținutului
.elementor-pictogramă-cutie-titlu
Descrierea conținutului
.descriere-cutie-icoană-elementor
Lista de pictograme
Pictogramă listă
.pictogramă-elementor-pictogramă-listă
ListText
.elementor-icoană-listă-text
Imagine
Imagine
img
Legendă
.wp-caption-text
Caseta cu imagini
Imagine
.elementor-image-box-img
TextContainer
.elementor-imagine-box-content
Titlul conținutului
.elementor-image-box-title
Descrierea conținutului
elementar-image-box-description
Image Carousel
ImageContainer
.glisor-tobogan
PictureItem
.imagine-swiper-slide
Container de paginare
.swiper-paginare
Paginare puncte
.swiper-pagination-glonț
Pictogramă anterioară
.buton-swiper-elementor-prev
Pagina Următoare →
.buton-swiper-elementor-next
Image Caption
.elementor-imagine-carusel-caption
Carusel media
MediaItem
.elementor-carusel-imagine
Suprapunere element media
.elementor-carusel-imagine-suprapunere
Paginare puncte
.swiper-pagination-fractie
Butonul anterior
.eicon-chevron-stânga
Butonul următor
.eicon-chevron-dreapta
Paginarea fracțiunilor
.swiper-pagination-fractie
Paginarea barei de progres
.swiper-pagination-progressbar
Umplere paginare bară de progres
.swiper-pagination-progressbar-umplere
Nav meniu
Comutare meniu mobil
.elementor-menu-toggle
Pictograma meniului mobil
.eicon-menu-bar
Meniu obișnuit
.elementor-nav-meniu
dropdown
.elementor-nav-meniu–menu derulant
Element de meniu cu submeniu
.elementor-element.are-submeniu
Element de submeniu
.elementor-sub-element
Butonul PayPal
Widgetul
.buton-elementor-plata
Pictograma butonului PayPal
.pictogramă-buton-elementor
Textul butonului PayPal
.elementor-buton-text
portofoliu
Articol de portofoliu
.elementor-portfoliu-articol
Element din portofoliu pe suprapunere
.elementor-portfolio-item__overlay
Titlu suprapus
.elementor-portfolio-item__title
Filtru de portofoliu
.elementor-portfolio__filter
Postați comentarii
Titlu răspuns
.comentare-răspuns-titlu
Cum se formează zona
.formular de comentariu
Formular de comentarii
.comment-form-coment
trimiteţi butonul
.formular-trimitere
Informații de postare
Widgetul
.elementor-post-info
Avatar
.elementor-avatar
Lista de pictograme
.pictogramă-elementor-pictogramă-listă
Textul pictogramei
.elementor-icoană-listă-text
Postați navigarea
Widgetul
.elementor-post-navigaţie
Pictogramă anterioară
.post-navigation__arrow-prev
Eticheta anterioară
.post-navigation__prev–label
Titlul postării anterioare
.post-navigation__prev–title
Pictograma următoare
.post-navigation__arrow-next
următoarea etichetă
.post-navigation__next–etichetă
Titlul postului următor
.post-navigation__next–titlu
postări
Postați articolul
.elementor-post
Imagine Recomandate
.elementor-post__thumbnail
Insigna pe pielea cărților
.elementor-post__insignă
Avatar pe pielea cărților
img.avatar
Zona de conținut text
.elementor-post__text
titlul articolului
.elementor-post__title
Post Excerpt
.elementor-post__extras
Citeste mai mult
.elementor-post__citește-mai mult
Post Meta Zona
.elementor-post__meta-date
Data post
.elementor-post-date
Autorul postului
.elementor-post-autor
Ora de postare
.elementor-post-time
Posteaza un comentariu
.elementor-post-avatar
Paginație
.elementor-paginare
Eticheta anterioară
.numerele-paginii.prev
următoarea etichetă
.numerele-paginii.urmatorul
Numărul de paginare
.numerele-paginii
Număr de paginare activă
.numerele-paginii.actuale
Buton Încărcare mai mult
.elementor-buton-link
Pictograma Buton Încărcare mai mult
.pictogramă-buton-elementor
titlul articolului
Widgetul
.elementor-titlu-titlu
Prețuri
Widgetul
.lista-preturi-elementor
Element din listă
.elementor-lista-preturi-articol
Imaginea articolului din listă
.elementor-lista-preturi-imagine
Textul articolului din listă
.elementor-lista-preturi-text
Antetul articolului din listă
.elementor-listă-prețuri-antet
Titlul articolului din listă
.elementor-lista-preturi-titlu
Separator de articole din listă
.elementor-lista-preturi-separator
Prețul articolului de listă
.elementor-pret-list-pret
Descrierea articolului din listă
.elementor-lista-preturi-descriere
Preț Tabelul
Widgetul
.tabel-pret-elementor
Antetul tabelului
.elementor-price-table__header
Titlul antetului tabelului
.elementor-price-table__heading
Descriere antet tabel
.elementor-tabel-prețuri__subtitlu
Preț
.elementor-price-table__price
Monedă
.elementor-price-table__currency
Număr după preț
.tabel-preț-elementor__după-preț
Perioada de stabilire a prețurilor
.elementor-tabel-pret__perioada
Zona Lista de caracteristici
.elementor-tabel-prețuri__lista-funcții
Element din lista de caracteristici
.elementor-tabel-preț__funcție-internă
Tabelul Footer
.elementor-tabel-preț__subsol
Buton pentru subsolul tabelului
.butonul-tabel__prețurilor-elementor
Text subsol tabel
.elementor-price-table__informații_suplimentare
Panglică
.elementor-tabel-prețuri__panglică
Panglică interioară
.elementor-tabel-preț__ribbon-interior
Bara de progres
Bara de progres
.elementor-progress-bar
Contextul progresului
.elementor-progress-wrapper
Titlul progresului
.elementor-titlu
Progresul text interior
.elementor-progres-text
Procentul de progres
.elementor-procent-progres
Urmărirea progresului
Widgetul
.elementor-scrolling-tracker
Progres
.procent-progres curent
Recenzii
Widgetul
.elementor-swiper
Examinați articolul
.glisor-tobogan
Antet de revizuire
.elementor-testimonial__header
Revizor de imagini
.elementor-mărturie__imagine
Numele recenzorului
.elementor-testimonial__name
Titlul recenzentului
.elementor-testimonial__title
Conținutul mărturiei
.elementor-mărturie__conținut
Textul mărturiei
.elementor-testimonial__text
Paginare puncte
.swiper-pagination-glonț
Paginarea fracțiunilor
.swiper-pagination-fractie
Curent de paginare fracție
.swiper-paginare-curent
Fracție Paginare Total
.swiper-pagination-total
Paginarea barei de progres
.swiper-pagination-progressbar
Umplere paginare bară de progres
.swiper-pagination-progressbar-umplere
Butonul anterior
.eicon-chevron-stânga
Butonul următor
.eicon-chevron-dreapta
Butoane Share
Buton Articol
.elementor-share-btn
Pictogramă buton
.elementor-share-btn__icon
Buton Text
.elementor-share-btn__text
Diapozitive
Widgetul
.elementor-diapozitive-ambalaj
Zona de continut
.conţinut-swiper-slide
Titlu de conținut
.elementor-slide-heading
Descrierea conținutului
.elementor-diapozitiv-descriere
Butonul de conținut
.elementor-buton-glisare
Paginare puncte
.swiper-pagination-glonț
Butonul anterior
.eicon-chevron-stânga
Butonul următor
.eicon-chevron-dreapta
Icoane sociale
Widgetul
.elementor-social-icoane-wrapper
Element de pictogramă
.elementor-social-icoană
Evaluarea stelelor
Widgetul
.elementor-star-rating__wrapper
Titlul de rating
.elementor-star-rating__title
Zona pictogramei stea
.elementor-star-rating
Pictogramă stea plină
.elementor-stea-plin
Pictogramă stea pe jumătate
.elementor-stea-5
Pictograma stea goală
.elementor-stea-gol
Cuprins
Widgetul
.elementor-widget-container
Antet ToC
.elementor-toc__header
Titlul antet ToC
.elementor-toc__header-title
Butonul de extindere
.elementor-toc__toggle-button–extinde
Butonul de restrângere
.elementor-toc__toggle-button–extinde
ToC Corp
.elementor-toc__body
Element din lista ToC
.elementor-toc__list-item
ToC Nivelul Superior
.elementor-toc__list-item-text.elementor-toc__nivel superior
Deși Elementor oferă o mulțime de opțiuni de stil pentru fiecare widget, puteți merge mai departe cu CSS personalizat. Pentru a aplica un stil personalizat unui widget (sau elementelor acestuia) prin CSS personalizat, trebuie să cunoașteți selectorul widget-ului asociat.
Puteți inspecta pur și simplu un widget pe o pagină live pentru a găsi selectorul acestuia. Pentru a economisi timp, am creat lista Elementor de selectoare de widget-uri, astfel încât să nu fie nevoie să inspectați singur fiecare widget.
Concluzie
Asa de! Tocmai v-am prezentat lista de selectoare de widget-uri Elementor. Dacă aveți nelămuriri despre cum să ajungeți acolo, anunțați-ne în termen comentarii.
Confidențialitate și module cookie: Acest site folosește module cookie. Continuând să utilizați acest site web, sunteți de acord cu utilizarea acestora.
Pentru a afla mai multe, inclusiv cum să controlați cookie-urile, consultați aici:
Politica cookie-urilor