{"id":6935,"date":"2021-10-03T20:14:11","date_gmt":"2021-10-03T18:14:11","guid":{"rendered":"https:\/\/lacolmenatecnologica.com\/einfuehrung-in-benutzerdefiniertes-css-von-elementor\/"},"modified":"2026-09-02T22:52:32","modified_gmt":"2026-09-02T20:52:32","slug":"einfuehrung-in-benutzerdefiniertes-css-von-elementor","status":"publish","type":"post","link":"https:\/\/lacolmenatecnologica.com\/de\/einfuehrung-in-benutzerdefiniertes-css-von-elementor\/","title":{"rendered":"Einf\u00fchrung in benutzerdefiniertes CSS von Elementor"},"content":{"rendered":"\n<h2 class=\"wp-block-heading\">Schritt-f\u00fcr-Schritt-Video<\/h2>\n\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe loading=\"lazy\" title=\"Introducci\u00f3n a CSS personalizado en Elementor\" width=\"500\" height=\"281\" src=\"https:\/\/www.youtube.com\/embed\/r5AesXg2TXQ?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe>\n<\/div><\/figure>\n\n<p class=\"wp-block-paragraph\">In diesem Beispiel werde ich die Stile des WordPress-Widgets <strong>Kategorien<\/strong> mithilfe des Bereichs <strong>Benutzerdefiniertes CSS<\/strong> im Tab <strong>Erweitert<\/strong> mit Elementor umgestalten. Wenn Sie \u00fcber eine der Lizenzen verf\u00fcgen, m\u00fcssen Sie sich nur anmelden, um Schritt f\u00fcr Schritt im Detail zu sehen, wie es gemacht wird. <\/p>\n\n<figure data-wp-context=\"{&quot;imageId&quot;:&quot;6a9a92ab23c60&quot;}\" data-wp-interactive=\"core\/image\" data-wp-key=\"6a9a92ab23c60\" class=\"wp-block-image size-full wp-lightbox-container\"><img loading=\"lazy\" decoding=\"async\" width=\"1920\" height=\"944\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on--pointerdown=\"actions.preloadImage\" data-wp-on--pointerenter=\"actions.preloadImageWithDelay\" data-wp-on--pointerleave=\"actions.cancelPreload\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/lacolmenatecnologica.com\/wp-content\/uploads\/2025\/12\/introduccion-a-css-personalizado-de-Elementor.gif\" alt=\"Einf&#xFC;hrung in benutzerdefiniertes CSS von Elementor\" class=\"wp-image-4893\"\/><button\n\t\t\tclass=\"lightbox-trigger\"\n\t\t\ttype=\"button\"\n\t\t\taria-haspopup=\"dialog\"\n\t\t\tdata-wp-bind--aria-label=\"state.thisImage.triggerButtonAriaLabel\"\n\t\t\tdata-wp-init=\"callbacks.initTriggerButton\"\n\t\t\tdata-wp-on--click=\"actions.showLightbox\"\n\t\t\tdata-wp-style--right=\"state.thisImage.buttonRight\"\n\t\t\tdata-wp-style--top=\"state.thisImage.buttonTop\"\n\t\t>\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewBox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" \/>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n\n<ol class=\"wp-block-list\">\n<li>Wir f\u00fcgen das Widget <strong>Kategorien<\/strong> in unser Dokument ein<\/li>\n\n\n\n<li>Klicken Sie auf den Tab <strong>Erweitert<\/strong><\/li>\n\n\n\n<li>Klicken Sie auf den Bereich <strong>Benutzerdefiniertes CSS<\/strong> und f\u00fcgen Sie den CSS-Code ein<\/li>\n<\/ol>\n\n<h2 class=\"wp-block-heading\" id=\"codigo-css-df35fea5-ebd8-4683-a81c-0b945faec3a5\">CSS-Code<\/h2>\n\n<p class=\"wp-block-paragraph\">Kopieren Sie den in diesem Video-Tutorial verwendeten Code.<\/p>\n\n<pre class=\"wp-block-code\"><code>selector h5 {\n    display: none;\n}\n\nselector li {\n    list-style: none;\n    display: inline-block;\n    margin-bottom: 20px;\n}\n\nselector li a {\n    border: 2px solid blue;\n    padding: 7px 15px;\n    margin: 5px;\n    border-radius: 50px;\n    color: blue;\n    text-transform: uppercase;\n}\n\nselector li a:hover {\n    color: white;\n    background-color: blue;\n}\n\nselector ul {\n    margin: 0;\n    padding: 0;\n    text-align: center;\n}<\/code><\/pre>\n\n<h2 class=\"wp-block-heading\" id=\"enlaces-de-interes-bddda819-da68-41be-bce6-f8d2fb0a551d\">Interessante Links<\/h2>\n\n<ul class=\"wp-block-list\">\n<li><a href=\"https:\/\/www.w3schools.com\/css\/default.asp\" target=\"_blank\" rel=\"noreferrer noopener\">W3 School \u2013 CSS Tutorial<\/a><\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>Schritt-f\u00fcr-Schritt-Video In diesem Beispiel werde ich die Stile des WordPress-Widgets Kategorien mithilfe des Bereichs Benutzerdefiniertes CSS im Tab Erweitert mit Elementor umgestalten. Wenn Sie \u00fcber eine der Lizenzen verf\u00fcgen, m\u00fcssen Sie sich nur anmelden, um Schritt f\u00fcr Schritt im Detail zu sehen, wie es gemacht wird. CSS-Code Kopieren Sie den in diesem Video-Tutorial verwendeten Code. [&hellip;]<\/p>\n","protected":false},"author":4,"featured_media":6936,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_seopress_titles_title":"Elementor Custom CSS: Einf\u00fchrung f\u00fcr dein Webdesign","_seopress_titles_desc":"In diesem Beispiel werde ich die Stile des WordPress-Kategorien-Widgets \u00fcber den Bereich \u201eBenutzerdefiniertes CSS\u201c auf dem Tab \u201eErweitert\u201c mit Elementor transformieren\u2026","_seopress_robots_index":"","_seopress_robots_follow":"","_seopress_robots_imageindex":"","_seopress_robots_snippet":"","_seopress_robots_primary_cat":"none","_seopress_robots_breadcrumbs":"","_seopress_robots_freeze_modified_date":"","_seopress_robots_custom_modified_date":"","_seopress_robots_canonical":"","_seopress_social_fb_title":"","_seopress_social_fb_desc":"","_seopress_social_fb_img":"","_seopress_social_fb_img_attachment_id":0,"_seopress_social_fb_img_width":0,"_seopress_social_fb_img_height":0,"_seopress_social_twitter_title":"","_seopress_social_twitter_desc":"","_seopress_social_twitter_img":"","_seopress_social_twitter_img_attachment_id":0,"_seopress_social_twitter_img_width":0,"_seopress_social_twitter_img_height":0,"_seopress_redirections_value":"","_seopress_redirections_enabled":"","_seopress_redirections_enabled_regex":"","_seopress_redirections_logged_status":"both","_seopress_redirections_param":"","_seopress_redirections_type":301,"_seopress_analysis_target_kw":"","_seopress_news_disabled":"","_seopress_video_disabled":"","_seopress_video":[],"_seopress_pro_schemas_manual":[],"_seopress_pro_rich_snippets_disable_all":"","_seopress_pro_rich_snippets_disable":[],"_seopress_pro_schemas":[],"footnotes":"","_bricks_page_content_2":[],"_bricks_page_header_2":[],"_bricks_page_footer_2":[]},"categories":[452],"tags":[444,404],"class_list":["post-6935","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-css","tag-elementor","tag-wordpress-personalisierung"],"_links":{"self":[{"href":"https:\/\/lacolmenatecnologica.com\/de\/wp-json\/wp\/v2\/posts\/6935","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/lacolmenatecnologica.com\/de\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/lacolmenatecnologica.com\/de\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/lacolmenatecnologica.com\/de\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/lacolmenatecnologica.com\/de\/wp-json\/wp\/v2\/comments?post=6935"}],"version-history":[{"count":1,"href":"https:\/\/lacolmenatecnologica.com\/de\/wp-json\/wp\/v2\/posts\/6935\/revisions"}],"predecessor-version":[{"id":6937,"href":"https:\/\/lacolmenatecnologica.com\/de\/wp-json\/wp\/v2\/posts\/6935\/revisions\/6937"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/lacolmenatecnologica.com\/de\/wp-json\/wp\/v2\/media\/6936"}],"wp:attachment":[{"href":"https:\/\/lacolmenatecnologica.com\/de\/wp-json\/wp\/v2\/media?parent=6935"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/lacolmenatecnologica.com\/de\/wp-json\/wp\/v2\/categories?post=6935"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/lacolmenatecnologica.com\/de\/wp-json\/wp\/v2\/tags?post=6935"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}