Chcete najít voliče widgetů Elementor ?

Jedna z funkcí dostupných na Elementor Pro je možnost přidat vlastní CSS. Tato funkce vám umožňuje jít dále, protože můžete použít jakýkoli styl, když požadovaný styl není k dispozici v seznamu možností nastavení.

Chcete-li do určitého widgetu přidat vlastní styl pomocí vlastního CSS Elementor, musíte znát selektor přidruženého widgetu. Shromáždili jsme seznam voličů widgetů Elementor abyste si usnadnili práci.

Každý widget Elementor – a jeho prvky – má selektor CSS, který můžete použít k cílení na přidružený widget, když chcete přidat vlastní CSS pro dosažení určitého stylu. Selektor najdete tak, že si prohlédnete widget, do kterého chcete přidat vlastní CSS.

Vzhledem k tomu, že kontrolu widgetu lze provést pouze na živé stránce, bude kontrola každého z nich trvat dlouho. To nás vedlo k vytvoření tohoto seznamu.

Jak používat selektor

Předpokládejme, že chcete na tlačítko použít jinou velikost mezi ikonou a textem. Protože možnost výchozího nastavení neumožňuje nastavit jinou velikost mezi ikonou tlačítka a textem, můžete toho dosáhnout pomocí vlastního CSS. Chcete-li použít vlastní CSS, můžete cílit na ikonu nebo text.

Nejprve vyberte selektor prvku, na který chcete cílit (například ikonu tlačítka). Na panelu nastavení prvku přejděte na kartu pokročilý a otevřete blok Vlastní CSS.

Selektor widgetů Elementor

vstoupit selector [selector name] {} ve vlastním poli CSS.

Zde je příklad.

Selektor widgetů Elementor

Pak přidejte svůj obsah CSS (deklarace) uvnitř složených závorek.

Zde je příklad.

Selektor widgetů Elementor

Poznámka: Každý widget Elementor má nadřazený prvek ( wrapper ). Vstupte selector {} (bez názvu selektoru) znamená cílit na obal.

Elementor Widget Selector List

Akordeon

Widget.elementor-akordeon
Název akordeonu.elementor-akordeon-titul
Popis akordeonu.elementor-tab-content
Otevřená ikona akordeonu.elementor-akordeon-ikona
Ikona akordeonu zavřeno.elementor-akordeon-ikona-zavřeno

Upozornění

Widget.elementor-upozornění
Název upozornění.elementor-alert-title
Popis upozornění.elementor-upozornění-popis
Odmítnout ikonu.elementor-alert-dismiss

Animovaný nadpis

Widget.elementor-headline
Statický text.elementor-headline-plain-text
Dynamický text.elementor-headline-dynamic-wrapper

Popis archivu

Archiv textu.elementor-heading-title

Archivovat příspěvky

Widget.elementor-widget-container
Odeslat položku.elementor-grid-item
Vybraný obrázek.elementor-post__thumbnail
Odznak na kůži karty.elementor-post__badge
Avatar na vzhledu karetimg.avatar
Oblast obsahu textu.elementor-post__text
Název příspěvku.elementor-post__title
Post Výňatek.elementor-post__excerpt
Více.elementor-post__read-more
Oblast meta příspěvků.elementor-post__meta-data
Datum příspěvku.elementor-post-date
Autor příspěvků.elementor-post-autor
Čas zveřejnění.elementor-post-time
Přidat komentář.elementor-post-avatar
Počet na stránku.elementor-stránkování
Předchozí štítek.čísla-stránek.předch
další štítek.čísla-stránek.další
Číslo stránkování.čísla stránek
Aktivní číslo stránkování.čísla-stránek.aktuální
Tlačítko Načíst více.elementor-button-link
Načíst další ikonu tlačítka.elementor-button-ikona

Autor Box

Widget.elementor-autor-box
avatar.elementor-author-box__avatar
Jméno autora.elementor-author-box__name
Autor Bio.elementor-author-box__bio
Tlačítko archivace.elementor-author-box__button
Widget.elementor-obraz-galerie
Položka galerie.galerie-položka
Titulek.wp-caption-text

blockquote

Widget.elementor-blockquote
Obsah blockquote.elementor-blockquote__content
Autor blockquote.elementor-blockquote__author
Ikona Tweetu.elementor-blockquote__tweet-button
Štítek tweetu.elementor-blockquote__tweet-label

Tlačítko

Widget.elementor-tlačítko
Tlačítko Text.elementor-button-text
Ikona tlačítka.elementor-button-ikona

Výzva k akci

Widget.elementor-cta
Obrázek záhlaví.elementor-cta__bg
Stuha.elementor-stuha
Text na pásu karet.elementor-stuha-vnitřní
Název obsahu.elementor-cta__title
Popis obsahu.elementor-cta__description
Tlačítko obsahu.elementor-cta__button

Countdown

Widget.elementor-countdown-wrapper
Dny.elementor-countdown-days
Hodiny.elementor-odpočítávání-hodin
Minuty.elementor-countdown-minutes
Sekundy.elementor-countdown-seconds
Štítek odpočítávání.elementor-countdown-label

Counter

Widget.elementor-counter
Předčíslí čísla.prvek-počítadlo-číslo-předpona
Číslo.elementor-counter-number
Přípona čísla.prvek-počítadlo-číslo-přípona
Titul.elementor-proti-titul

dělič

Widget.elementor-dělič
oddělovač.prvek-oddělovač-oddělovač
Prvek textu/ikony.elementor-divider__element

Flip box

Widget.elementor-flip-box
Přední kontejner.elementor-flip-box__front
BackContainer.elementor-flip-box__back
Kontejner obsahu.elementor-flip-box__layer__inner
Název obsahu.elementor-flip-box__layer__title
Popis obsahu.elementor-flip-box__layer__description
Tlačítko obsahu.elementor-flip-box__button

Formulář

Widget.elementor-forma
Krokový kontejner.e-form__indikátory
Číslo kroků.e-form__indicators__indikator
Štítek pole.elementor-field-label
Text pole.elementor-field-textual
Popisek textového pole.elementor-pole-type-text
Popisek pole textové oblasti.elementor-pole-typ-textarea
Štítek pole e-mailu.e-mail typu .elementor-pole
Štítek pole URL.elementor-field-type-url
Tel Field Label.elementor-pole-typ-tel
Označení rádiového pole.elementor-pole-type-radio
Vyberte možnost Popis pole.elementor-field-type-select
Označení pole zaškrtávacího políčka.elementor-field-type-checkbox
Přijetí štítku pole.prvek-pole-typ-akceptace
Označení datového pole.elementor-pole-type-date
Označení časového pole.elementor-field-type-time
Označení pole čísla.prvek-pole-typ-číslo
Štítek pole pro nahrání souboru.elementor-field-type-upload
Další tlačítkoe-form__buttons__wrapper__button-další
Tlačítko Předchozí.e-form__buttons__wrapper__button-předchozí
Vložení tlačítko.elementor-tlačítko
Název galerie (pro více galerií).elementor-název-galerie
Položka galerie.prvek-položka-galerie
Popis (na překryvném obrázku).elementor-gallery-item__description

Záhlaví

Widget.elementor-heading-title

Ikona

Widget.elementor-ikona

ikona Box

Widget.elementor-icon-box-wrapper
Ikona.elementor-ikona
Kontejner obsahu.elementor-ikona-box-obsah
Název obsahu.elementor-ikona-box-title
Popis obsahu.elementor-ikona-box-popis

Seznam ikon

Ikona seznamu.ikona-seznamu prvku
ListText.elementor-ikona-seznam-textu

Obraz

Obrazimg
Titulek.wp-caption-text

Obrázek Box

Obraz.elementor-image-box-img
TextContainer.elementor-image-box-content
Název obsahu.elementor-image-box-title
Popis obsahuelementor-image-box-description
ImageContainer.swiper-slide
PictureItem.swiper-slide-image
Kontejner stránkování.swiper-pagination
Stránkování teček.swiper-pagination-bullet
Předchozí ikona.elementor-swiper-button-prev
další.elementor-swiper-button-další
Titulek obrázku.elementor-image-carousel-caption
Mediální položka.elementor-carousel-image
Překrytí mediální položky.elementor-carousel-image-overlay
Bodové stránkování.swiper-pagination-fraction
Tlačítko Předchozí.eicon-chevron-left
Další tlačítko.eicon-chevron-right
Stránkování zlomků.swiper-pagination-fraction
Stránkování ukazatele průběhu.swiper-pagination-progressbar
Výplň stránkování ukazatele průběhu.swiper-pagination-progressbar-fill
Přepínač mobilní nabídky.elementor-menu-toggle
Ikona mobilní nabídky.eicon-menu-bar
Běžné menu.elementor-nav-menu
Dropdown.elementor-nav-menu–dropdown
Položka nabídky s podnabídkou.elementor-item.has-submenu
Položka podnabídky.prvek-podpoložka

Tlačítko PayPal

Widget.elementor-tlačítko-platba
Ikona tlačítka PayPal.elementor-button-ikona
Text tlačítka PayPal.elementor-button-text

Portfolio

Položka portfolia.elementor-portfolio-item
Položka portfolia na překryvné vrstvě.elementor-portfolio-item__overlay
Název překryvu.elementor-portfolio-item__title
Filtr portfolia.elementor-portfolio__filter

Komentáře

Název odpovědi.comment-reply-title
Jak Forma Oblast.formulář komentáře
Formulář komentáře.komentář-formulář-komentář
Vložení tlačítko.formulář-odeslat

Informace o příspěvku

Widget.elementor-post-info
avatar.elementor-avatar
Seznam ikon.ikona-seznamu prvku
Ikona Text.elementor-ikona-seznam-textu

Post Navigation

Widget.elementor-post-navigace
Předchozí ikona.post-navigation__arrow-prev
Předchozí štítek.post-navigation__prev–label
Předchozí název příspěvku.post-navigation__prev–title
Další ikona.post-navigation__arrow-next
další štítek.post-navigation__next–label
Název dalšího příspěvku.post-navigation__next–title

příspěvky

Odeslat položku.elementor-post
Vybraný obrázek.elementor-post__thumbnail
Odznak na kůži karty.elementor-post__badge
Avatar na vzhledu karetimg.avatar
Oblast obsahu textu.elementor-post__text
Název příspěvku.elementor-post__title
Post Výňatek.elementor-post__excerpt
Více.elementor-post__read-more
Oblast meta příspěvků.elementor-post__meta-data
Datum příspěvku.elementor-post-date
Autor příspěvků.elementor-post-autor
Čas zveřejnění.elementor-post-time
Přidat komentář.elementor-post-avatar
Počet na stránku.elementor-stránkování
Předchozí štítek.čísla-stránek.předch
další štítek.čísla-stránek.další
Číslo stránkování.čísla stránek
Aktivní číslo stránkování.čísla-stránek.aktuální
Tlačítko Načíst více.elementor-button-link
Načíst další ikonu tlačítka.elementor-button-ikona

Název příspěvku

Widget.elementor-heading-title

Ceník

Widget.ceník-elementoru
Seznam položek.elementor-ceník-položka
Obrázek položky seznamu.elementor-ceník-obrázek
Text položky seznamu.elementor-ceník-text
Záhlaví položky seznamu.elementor-price-list-header
Název položky seznamu.elementor-ceník-název
Oddělovač položek seznamu.elementor-ceník-separator
Cena položky seznamu.elementor-ceník-cena
Popis položky seznamu.elementor-ceník-popis

Tabulka cen

Widget.elementor-cena-tabulka
Záhlaví stolu.elementor-price-table__header
Název záhlaví tabulky.elementor-price-table__heading
Popis záhlaví tabulky.elementor-price-table__subheading
Cena.elementor-price-table__price
Měna.elementor-price-table__currency
Číslo za cenou.elementor-price-table__after-price
Cenové období.elementor-price-table__period
Oblast seznamu funkcí.elementor-price-table__features-list
Položka seznamu funkcí.elementor-price-table__feature-inner
Tabulka zápatí.elementor-price-table__footer
Tlačítko zápatí tabulky.elementor-price-table__button
Text zápatí tabulky.elementor-price-table__additional_info
Stuha.elementor-price-table__ribbon
Vnitřní stuha.elementor-price-table__ribbon-inner

Progress Bar

Progress Bar.elementor-progress-bar
Pozadí pokroku.elementor-progress-wrapper
Název postupu.elementor-title
Vnitřní text pokroku.elementor-progress-text
Procento pokroku.elementor-progress-procento

Sledování pokroku

Widget.elementor-scrolling-tracker
Pokrok.aktuální-pokrok-procento

Hodnocení

Widget.elementor-swiper
Zkontrolovat položku.swiper-slide
Záhlaví recenze.elementor-testimonial__header
Recenzent obrázků.elementor-testimonial__image
Jméno recenzenta.elementor-testimonial__name
Název recenzenta.elementor-testimonial__title
Obsah posudku.elementor-testimonial__content
Text posudku.elementor-testimonial__text
Bodové stránkování.swiper-pagination-bullet
Stránkování zlomků.swiper-pagination-fraction
Proud stránkování zlomku.swiper-pagination-current
Zlomek Stránkování Celkem.swiper-pagination-total
Stránkování ukazatele průběhu.swiper-pagination-progressbar
Výplň stránkování ukazatele průběhu.swiper-pagination-progressbar-fill
Tlačítko Předchozí.eicon-chevron-left
Další tlačítko.eicon-chevron-right

Tlačítka sdílení

Položka tlačítka.elementor-share-btn
Ikona tlačítka.elementor-share-btn__icon
Tlačítko Text.elementor-share-btn__text

Slides

Widget.elementor-slides-wrapper
Oblast obsahu.swiper-slide-contents
Nadpis obsahu.elementor-slide-heading
Popis obsahu.elementor-slide-description
Tlačítko obsahu.elementor-slide-button
Bodové stránkování.swiper-pagination-bullet
Tlačítko Předchozí.eicon-chevron-left
Další tlačítko.eicon-chevron-right

sociální Ikony

Widget.elementor-social-icons-wrapper
Položka ikony.elementor-social-ikona

Počet hvězdiček

Widget.elementor-star-rating__wrapper
Rating Title.elementor-star-rating__title
Oblast ikon hvězd.elementor-star-rating
Ikona plné hvězdy.elementor-star-full
Ikona poloviční hvězdy.elementor-star-5
Prázdná ikona hvězdy.elementor-star-empty

Obsah

Widget.elementor-widget-container
Záhlaví ToC.elementor-toc__header
Název záhlaví ToC.elementor-toc__header-title
Tlačítko Rozbalit.elementor-toc__toggle-button–expand
Tlačítko Sbalit.elementor-toc__toggle-button–expand
ToC Body.elementor-toc__body
Položka seznamu ToC.elementor-toc__list-item
ToC nejvyšší úroveň.elementor-toc__list-item-text.elementor-toc__top-level

Tabs

Widget.elementor-tabs
Název karty.elementor-tab-title
Tab Content.elementor-tab-content

Testimonial

Widget.elementor-testimonial-wrapper
Obsah posudku.elementor-posudek-obsah
Testimonial Meta.elementor-testimonial-meta
Posudek avatara.elementor-testimonial-image
Jméno posudku a pracovní pozice.elementor-testimonial-details
Název posudku.elementor-název-posudku
Název pracovní pozice posudku.elementor-testimonial-job
Widget.elementor-widget-container
Položka posudkového snímku.elementor-posudek
Obsah posudku.elementor-testimonial__content
Testimonial Meta.elementor-testimonial__footer
Posudek avatara.elementor-testimonial__image
Jméno posudku a pracovní pozice.elementor-testimonial__cite
Název posudku.elementor-testimonial__name
Název pracovní pozice posudku.elementor-testimonial__title
Bodové stránkování.swiper-pagination-bullet
Stránkování zlomků.swiper-pagination-fraction
Proud stránkování zlomku.swiper-pagination-current
Zlomek Stránkování Celkem.swiper-pagination-total
Stránkování ukazatele průběhu.swiper-pagination-progressbar
Výplň stránkování ukazatele průběhu.swiper-pagination-progressbar-fill
Tlačítko Předchozí.eicon-chevron-left
Další tlačítko.eicon-chevron-right

Textový editor

Widget.elementor-text-editor

Přepnout

Widget.elementor-toggle
Přepnout položku.elementor-toggle-item
Přepnout název položky.elementor-tab-title
Přepnout obsah položky.elementor-tab-content
Přepnout ikonu.elementor-toggle-ikona
Ikona přepínače zavřená.elementor-toggle-icon-closed
Přepnout ikonu Otevřít.elementor-toggle-icon-opened

Získejte Elementor Pro nyní!!!

Přestože Elementor nabízí spoustu možností stylingu pro každý widget, můžete to překročit pomocí vlastního CSS. Chcete-li použít vlastní styl na widget (nebo jeho prvky) prostřednictvím vlastního CSS, musíte znát selektor příslušného widgetu.

Další zdroje Elementor:

Widget si můžete jednoduše prohlédnout na živé stránce a najít jeho volič. Abychom vám ušetřili čas, vytvořili jsme pro Elementor seznam selektorů widgetů, abyste nemuseli kontrolovat každý widget sami.

Proč investovat do čističky vzduchu?

Tak! Právě jsme vám představili seznam selektorů widgetů Elementor. Pokud máte nějaké obavy, jak se tam dostat, dejte nám vědět commentaires.

Můžete však také konzultovat naše zdroje, pokud potřebujete více prvků k realizaci vašich projektů vytváření internetových stránek, nahlédněte do našeho průvodce na internetu Vytvoření blogu WordPress nebo ten, který je zapnutý Divi: nejlepší téma WordPress všech dob.

Mezitím sdílejte tento článek na různých sociálních sítích.

...