Želite li pronaći selektore widgeta Elementor ?
Jedna od funkcija dostupnih na Elementor Pro
Za dodavanje prilagođenog stila putem prilagođenog CSS-a određenom widgetu Elementor , morate znati selektor pridruženog widgeta. Prikupili smo listu selektora widgeta Elementor da vam olakšam posao.
Svaki Elementor widget — i njegovi elementi — ima CSS selektor koji možete koristiti za ciljanje pridruženog widgeta kada želite dodati prilagođeni CSS kako biste postigli određeni stil. Selektor možete pronaći tako što ćete pregledati widget kojem želite dodati prilagođeni CSS.
Budući da se pregled widgeta može obaviti samo na stranici uživo, trebat će mnogo vremena da se pregleda svaki od njih. To nas je navelo da napravimo ovu listu.
Kako koristiti selektor
Pretpostavimo da želite da primenite različitu veličinu između ikone i teksta na dugme. Budući da opcija zadane postavke ne dozvoljava da postavite različitu veličinu između ikone gumba i teksta, to možete postići pomoću prilagođenog CSS-a. Možete ciljati ikonu ili tekst da biste primijenili prilagođeni CSS.
Prvo odaberite selektor elementa koji želite ciljati (na primjer, ikonu gumba). U panelu postavki elementa idite na karticu napredan i otvori blok Prilagođeni CSS .
Enter selector [selector name] {} u prilagođenom CSS polju.
Evo primjera.
Zatim dodajte svoje sadržaja CSS (deklaracija) unutar vitičastih zagrada.
Evo primjera.
Napomena: Svaki Elementor widget ima roditeljski element (wrapper). Enter selector {} (bez imena selektora) znači ciljati omotač.
Lista birača elementor widgeta
Harmonika
Widget .elementor-harmonika Naslov harmonike .elementor-accordion-title Harmonika Opis .elementor-tab-content Otvorena ikona harmonike .elementor-accordion-icon Ikona harmonike zatvorena .elementor-harmonika-ikona-zatvorena
Alert
Widget .elementor-alert Alert Title .elementor-alert-title Opis upozorenja .elementor-alert-description Ikona Odbaci .elementor-alert-dismiss
Animirani naslov
Widget .elementor-headline Statički tekst .elementor-headline-plain-text Dynamic Text .elementor-headline-dynamic-wrapper
Archive Description
Arhivski tekst .elementor-heading-title
Arhiva postova
Widget .elementor-widget-container Post Item .elementor-grid-item Istaknuta slika .elementor-post__thumbnail Značka na koži karata .elementor-post__badge Avatar na koži karata img.avatar Područje sa sadržajem teksta .elementor-post__text Naslov poruke .elementor-post__title Post Excerpt .elementor-post__excerpt Čitaj više .elementor-post__read-more Post Meta Area .elementor-post__meta-data Post Datum .elementor-post-date Post-Autor .elementor-post-autor Post-Time .elementor-post-time Ostavite komentar .elementor-post-avatar obilježavanje strana .elementor-paginacija Previous Label .page-numbers.prev next-label .page-numbers.next Broj paginacije .page-numbers Broj aktivne stranice .page-numbers.current Dugme za učitavanje više .elementor-button-link Ikona dugmeta Učitaj više .elementor-button-icon
Autorski okvir
Widget .elementor-autor-kutija Avatar .elementor-author-box__avatar Autor ime .elementor-author-box__name Autor Bio .elementor-author-box__bio Dugme za arhiviranje .elementor-author-box__button
Osnovna galerija
Widget .elementor-image-gallery Predmet iz galerije .gallery-item naslov .wp-caption-text
Blockquote
Widget .elementor-blockquote Blockquote Content .elementor-blockquote__content Blockquote Author .elementor-blockquote__author Tweet Icon .elementor-blockquote__tweet-button Tweet Label .elementor-blockquote__tweet-label
Widget .elementor-button Button Text .elementor-button-text Ikona dugmeta .elementor-button-icon
Poziv na akciju
Widget .elementor-cta Slika zaglavlja .elementor-cta__bg Ribbon .elementor-ribbon Tekst trake .elementor-ribbon-inner Naslov sadržaja .elementor-cta__title Opis sadržaja .elementor-cta__description Dugme za sadržaj .elementor-cta__button
Countdown
Widget .elementor-countdown-wrapper dani .elementor-countdown-days sati .elementor-countdown-hours zapisnik .elementor-countdown-minutes sekundi .elementor-countdown-seconds Countdown Label .elementor-countdown-label
brojač
Widget .elementor-counter Prefiks broja .element-counter-broj-prefiks broj .elementor-broj-broj Broj sufiks .element-counter-broj-sufiks Naslov .elementor-counter-title
šestar
Widget .elementor-razdjelnik separator .elementor-razdjelnik-separator Element teksta/ikone .elementor-divider__element
Flip box
Widget .elementor-flip-box Prednji kontejner .elementor-flip-box__front BackContainer .elementor-flip-box__back Content Container .elementor-flip-box__layer__inner Naslov sadržaja .elementor-flip-box__layer__title Opis sadržaja .elementor-flip-box__layer__description Dugme za sadržaj .elementor-flip-box__button
Widget .elementor-form Step Container .e-form__indikatori Broj koraka .e-obrazac__indikatori__indikator Oznaka polja .elementor-field-label Tekst polja .elementor-field-textual Oznaka polja za tekst .elementor-field-type-text Oznaka polja za tekst .elementor-field-type-textarea Oznaka polja e-pošte .elementor-field-type-email Oznaka polja URL-a .elementor-field-type-url Tel Field Label .elementor-polje-tip-tel Radio Field Label .elementor-field-type-radio Odaberite Oznaka polja .elementor-field-type-select Oznaka polja za potvrdu .elementor-field-type-checkbox Field Label Acceptance .elementor-field-type-acceptance Oznaka polja datuma .elementor-polje-tip-datum Oznaka vremenskog polja .elementor-field-type-time Oznaka polja broja .broj-tip-polja elementa Oznaka polja za otpremanje datoteke .elementor-field-type-upload Next Button e-forma__buttons__wrapper__button-next Dugme Prethodno .e-form__buttons__wrapper__button-previous Pošalji dugme .elementor-button
galerija
Naslov galerije (za više galerija) .elementor-gallery-title Predmet iz galerije .elementor-gallery-item Opis (na preklapanju) .elementor-gallery-item__description
naslov
Widget .elementor-heading-title
ikona
Ikona Box
Widget .elementor-icon-box-wrapper ikona .elementor-icon Content Container .elementor-icon-box-content Naslov sadržaja .elementor-icon-box-title Opis sadržaja .elementor-icon-box-description
Lista ikona
Ikona liste .elementor-icon-list-icon ListText .elementor-icon-list-text
slika
slika img naslov .wp-caption-text
Image Box
slika .elementor-image-box-img TextContainer .elementor-image-box-content Naslov sadržaja .elementor-image-box-title Opis sadržaja elementor-image-box-description
Image Carousel
ImageContainer .swiper-slide PictureItem .swiper-slide-image Kontejner za paginaciju .swiper-pagination Dots Pagination .swiper-pagination-bullet Prethodna ikona .elementor-swiper-button-prev sljedeći .elementor-swiper-button-next Picture Caption .elementor-image-carousel-caption
MediaItem .elementor-carousel-image Preklapanje medijske stavke .elementor-carousel-image-overlay Dot Pagination .swiper-pagination-fraction Dugme Prethodno .eicon-chevron-left Next Button .eicon-chevron-desno Paginacija frakcija .swiper-pagination-fraction Paginacija trake napretka .swiper-pagination-progressbar Popuna paginacije trake napretka .swiper-pagination-progressbar-fill
Prebacivanje menija mobilnog telefona .elementor-menu-toggle Ikona mobilnog menija .eicon-menu-bar Regular Menu .elementor-nav-menu Ispustiti .elementor-nav-menu–padajući meni Stavka menija sa podmenijem .elementor-item.has-submenu Stavka podmenija .elementor-sub-item
Widget .elementor-dugme za plaćanje Ikona PayPal dugmeta .elementor-button-icon Tekst dugmeta PayPal .elementor-button-text
Portfelj
portfolio Item .elementor-portfolio-item Stavka portfelja na preklapanju .elementor-portfolio-item__overlay Overlay Title .elementor-portfolio-item__title Portfolio filter .elementor-portfolio__filter
Naslov odgovora .comment-reply-title Kako Form Area .comment-form Obrazac za komentar .comment-form-comment Pošalji dugme .form-submit
Objavite informacije
Widget .elementor-post-info Avatar .elementor-avatar Lista ikona .elementor-icon-list-icon Tekst ikone .elementor-icon-list-text
Post Navigation
Widget .elementor-post-navigation Prethodna ikona .post-navigation__arrow-prev Previous Label .post-navigation__prev–oznaka Prethodni naslov posta .post-navigation__prev–title Sljedeća ikona .post-navigation__arrow-next next-label .post-navigation__next–oznaka Sljedeći naslov naslova .post-navigation__next–title
Postovi
Post Item .elementor-post Istaknuta slika .elementor-post__thumbnail Značka na koži karata .elementor-post__badge Avatar na koži karata img.avatar Područje sa sadržajem teksta .elementor-post__text Naslov poruke .elementor-post__title Post Excerpt .elementor-post__excerpt Čitaj više .elementor-post__read-more Post Meta Area .elementor-post__meta-data Post Datum .elementor-post-date Post-Autor .elementor-post-autor Post-Time .elementor-post-time Ostavite komentar .elementor-post-avatar obilježavanje strana .elementor-paginacija Previous Label .page-numbers.prev next-label .page-numbers.next Broj paginacije .page-numbers Broj aktivne stranice .page-numbers.current Dugme za učitavanje više .elementor-button-link Ikona dugmeta Učitaj više .elementor-button-icon
Naslov poruke
Widget .elementor-heading-title
Cjenovnik
Widget .elementor-cjenovnik Stavka liste .elementor-cjenik-stavka Slika stavke liste .elementor-cjenik-slika Tekst stavke liste .elementor-cenovnik-tekst Zaglavlje stavke liste .elementor-cenik-header Naslov stavke liste .elementor-cjenik-naslov Razdjelnik stavki liste .elementor-cjenovnik-separator Cijena artikla na listi .elementor-cjenik-cijena Opis stavke liste .elementor-cjenik-opis
Cijena Tabela
Widget .elementor-cijena-tabela Zaglavlje tabele .elementor-price-table__header Naslov zaglavlja tabele .elementor-price-table__heading Opis zaglavlja tabele .elementor-price-table__subheading Cijena .elementor-price-table__price valuta .elementor-price-table__currency Broj nakon cijene .elementor-price-table__after-price Period određivanja cijena .elementor-price-table__period Područje liste funkcija .elementor-price-table__features-list Stavka liste funkcija .elementor-price-table__feature-inner Table Footer .elementor-price-table__footer Dugme za podnožje tabele .elementor-price-table__button Tekst podnožja tabele .elementor-price-table__additional_info Ribbon .elementor-price-table__ribbon Inner Ribbon .elementor-price-table__ribbon-inner
napredak Bar
napredak Bar .elementor-progress-bar Pozadina napretka .elementor-progress-wrapper Progress Title .elementor-title Progres Inner Text .elementor-progress-text Procenat napretka .elementor-progress-percentage
Napredak Tracker
Widget .elementor-scrolling-tracker napredak .current-progress-percentage
Recenzije
Widget .elementor-swiper Pregledajte stavku .swiper-slide Zaglavlje pregleda .elementor-testimonial__header Image Reviewer .elementor-testimonial__image Ime recenzenta .elementor-testimonial__name Recenzent Title .elementor-testimonial__title Testimonial Content .elementor-testimonial__content Testimonial Text .elementor-testimonial__text Dot Pagination .swiper-pagination-bullet Paginacija frakcija .swiper-pagination-fraction Trenutna paginacija frakcija .swiper-pagination-current Fraction Pagination Total .swiper-pagination-total Paginacija trake napretka .swiper-pagination-progressbar Popuna paginacije trake napretka .swiper-pagination-progressbar-fill Dugme Prethodno .eicon-chevron-left Next Button .eicon-chevron-desno
Button Item .elementor-share-btn Ikona dugmeta .elementor-share-btn__icon Button Text .elementor-share-btn__text
slajdovi
Widget .elementor-slides-wrapper Područje sadržaja .swiper-slide-contents Naslov sadržaja .elementor-slide-heading Opis sadržaja .elementor-slide-description Dugme za sadržaj .elementor-slide-button Dot Pagination .swiper-pagination-bullet Dugme Prethodno .eicon-chevron-left Next Button .eicon-chevron-desno
Socijalne ikone
Widget .elementor-social-icons-wrapper Stavka ikone .elementor-social-icon
Star Rating
Widget .elementor-star-rating__wrapper rejting Naslov .elementor-star-rating__title Područje ikona zvijezda .elementor-star-rating Potpuno ispunjena ikona zvijezde .elementor-star-full Ikona zvijezde do pola .elementor-star-5 Ikona prazne zvijezde .elementor-star-empty
Sadržaj
Widget .elementor-widget-container ToC Header .elementor-toc__header Naslov zaglavlja ToC .elementor-toc__header-title Dugme za proširenje .elementor-toc__toggle-button–proširi Dugme za sažimanje .elementor-toc__toggle-button–proširi ToC Body .elementor-toc__body ToC List Item .elementor-toc__list-item ToC Top Level .elementor-toc__list-item-text.elementor-toc__top-level
Kartice
Widget .elementor-tabs Naslov kartice .elementor-tab-title Sadržaj kartice .elementor-tab-content
Pismena pohvalnica
Widget .elementor-testimonial-wrapper Testimonial Content .elementor-testimonial-content Testimonial Meta .elementor-testimonial-meta Avatar Testimonial .elementor-testimonial-image Ime i prezime i radno mjesto .elementor-testimonial-details svjedočanstvo ime .elementor-testimonial-name Testimonial Job Title .elementor-testimonial-posao
Vrtuljak s izjavama
Widget .elementor-widget-container Preporuka za slajd stavke .elementor-testimonial Testimonial Content .elementor-testimonial__content Testimonial Meta .elementor-testimonial__footer Avatar Testimonial .elementor-testimonial__image Ime i prezime i radno mjesto .elementor-testimonial__cite svjedočanstvo ime .elementor-testimonial__name Testimonial Job Title .elementor-testimonial__title Dot Pagination .swiper-pagination-bullet Paginacija frakcija .swiper-pagination-fraction Trenutna paginacija frakcija .swiper-pagination-current Fraction Pagination Total .swiper-pagination-total Paginacija trake napretka .swiper-pagination-progressbar Popuna paginacije trake napretka .swiper-pagination-progressbar-fill Dugme Prethodno .eicon-chevron-left Next Button .eicon-chevron-desno
Uređivač teksta
Widget .elementor-text-editor
Prebacite
Widget .elementor-toggle Prebaci stavku .elementor-toggle-item Uključi/isključi naslov stavke .elementor-tab-title Uključi/isključi sadržaj stavke .elementor-tab-content Toggle Icon .elementor-toggle-icon Prebaci Ikona Zatvoreno .elementor-toggle-icon-closed Prebaci Ikona Otvori .elementor-toggle-icon-opened
Iako Elementor nudi mnoštvo opcija za stilizovanje za svaki widget, možete ići dalje od toga sa prilagođenim CSS-om. Da biste primijenili prilagođeni stil na widget (ili njegove elemente) putem prilagođenog CSS-a, morate znati selektor pridruženog widgeta.
Ostali Elementor resursi:
Možete jednostavno pregledati widget na stranici uživo kako biste pronašli njegov selektor. Kako bismo vam uštedjeli vrijeme, kreirali smo Elementorovu listu selektora widgeta tako da ne morate sami pregledavati svaki widget.
zaključak
Dakle! Upravo smo vam predstavili listu Elementor selektora widgeta. Ako imate bilo kakvih nedoumica oko toga kako doći do tamo, javite nam unutar komentari
Međutim, možete se posavjetovati naši resursi Izrada bloga WordPress Divi: najbolja WordPress tema svih vremena
Ali u međuvremenu, ovaj članak podijelite na svojim različitim društvenim mrežama
...
sviđa mi se ovo: volim Loading ...
slične stvari
