{"id":2086,"date":"2020-07-31T12:53:51","date_gmt":"2020-07-31T12:53:51","guid":{"rendered":"https:\/\/elfsight.com\/de\/?page_id=2086"},"modified":"2020-07-31T13:21:39","modified_gmt":"2020-07-31T13:21:39","slug":"examples","status":"publish","type":"page","link":"https:\/\/elfsight.com\/de\/social-media-icons-widget\/examples\/","title":{"rendered":"Social Media Icons &#8211; Examples"},"content":{"rendered":"\n<div class=\"application-examples-item application-examples-item-loading\">\n                            <div class=\"col-row\">\n                                <div class=\"col-6 col-m-8 col-s-12\"><h3 class=\"application-examples-item-title\">Beispiel 1: Soziale Icons<\/h3><div class=\"application-examples-item-description\">Dies ist eine der h\u00e4ufigsten Varianten des Widgets. Die Symbole sind kreisf\u00f6rmig und in einer horizontalen Linie angeordnet - dank des Inline-Layouts des Widgets. Obwohl Sie eine beliebige Hintergrundfarbe ausw\u00e4hlen k\u00f6nnen, werden hier die Originalfarben der Medien gespeichert und ihre Symbole sind wei\u00df. Es ist eine gute Variante f\u00fcr einen Inhaltsbereich jeder Website.<\/div><\/div>\n                <\/div>\n\n                <div class=\"application-examples-item-iframe-container browser-frame\">\n                    <div class=\"application-examples-item-iframe-wrapper\">\n                        <iframe class=\"application-examples-item-iframe\" data-src=\"https:\/\/elfsight.com\/examples?widget_id=a39387ab-d9ea-4e51-b176-0238eafc914d&padding=140px+40px+0\" width=\"100%\" allow=\"autoplay; fullscreen\"><\/iframe>\n                    <\/div>\n\n                    <div class=\"application-examples-item-loader\"><\/div>\n                <\/div>\n            <\/div>\n\n<div class=\"application-examples-item application-examples-item-loading\">\n                            <div class=\"col-row\">\n                                <div class=\"col-6 col-m-8 col-s-12\"><h3 class=\"application-examples-item-title\">Beispiel 2: Floating Icons<\/h3><div class=\"application-examples-item-description\">Wenn Sie Floating Layout w\u00e4hlen, bewegt sich das Widget entlang der Seite, folgt dem Bildlauf und bleibt somit immer zur Hand. Diese Art von Layout kann an jeder Seite des Bildschirms ausgerichtet werden und wird horizontal neu angeordnet, wenn Sie die zentrale Ausrichtung w\u00e4hlen. Die Symbole hier sind quadratisch mit Standardstil.<\/div><\/div>\n                <\/div>\n\n                <div class=\"application-examples-item-iframe-container browser-frame\">\n                    <div class=\"application-examples-item-iframe-wrapper\">\n                        <iframe class=\"application-examples-item-iframe\" data-src=\"https:\/\/elfsight.com\/examples?widget_id=4ce734ab-d0a4-47f3-8dd5-f6f544a84c56&padding=140px+40px+0\" width=\"100%\" allow=\"autoplay; fullscreen\"><\/iframe>\n                    <\/div>\n\n                    <div class=\"application-examples-item-loader\"><\/div>\n                <\/div>\n            <\/div>\n\n<div class=\"application-examples-item application-examples-item-loading\">\n                            <div class=\"col-row\">\n                                <div class=\"col-6 col-m-8 col-s-12\"><h3 class=\"application-examples-item-title\">Beispiel 3: Schwarze Symbole<\/h3><div class=\"application-examples-item-description\">Diese Symbole sehen dank der Schwarz-Wei\u00df-Farbl\u00f6sung absolut einzigartig aus. Die Farben des Hintergrunds und das Symbol des Mediums wurden in den Einstellungen ge\u00e4ndert. Die Symbole sind inline und mittig ausgerichtet. Es gibt auch einen Fliegen Animationseffekt beim Schweben.<\/div><\/div>\n                <\/div>\n\n                <div class=\"application-examples-item-iframe-container browser-frame\">\n                    <div class=\"application-examples-item-iframe-wrapper\">\n                        <iframe class=\"application-examples-item-iframe application-examples-item-iframe-fixed-height\" data-src=\"https:\/\/elfsight.com\/examples?widget_id=02aa9da1-726c-4323-a731-82b97e0249ac&padding=140px+40px+0\" width=\"100%\" height=\"350\" allow=\"autoplay; fullscreen\"><\/iframe>\n                    <\/div>\n\n                    <div class=\"application-examples-item-loader\"><\/div>\n                <\/div>\n            <\/div>\n\n<div class=\"application-cta-create\">\n                    <div class=\"application-cta-create-bg\">\n                        <div class=\"application-cta-create-bg-left\"><\/div>\n\n                        <div class=\"application-cta-create-bg-right\">\n                            <img decoding=\"async\" src=\"https:\/\/elfsight.com\/de\/wp-content\/themes\/elfsight\/frontend\/assets\/img\/application-cta-create.jpg\" alt=\"Beginnen Sie mit der Erstellung Ihres Widgets\">\n                        <\/div>\n                    <\/div>\n\n                    <div class=\"application-cta-create-content inner\">\n                        <div class=\"application-cta-create-content-inner\">\n                            <div class=\"application-cta-create-content-icon\">\n                                <svg viewBox=\"0 0 25 25\" width=\"100%\" height=\"100%\">\n                                    <use xlink:href=\"#icon-settings\"><\/use>\n                                <\/svg>\n                            <\/div>\n\n                            <div class=\"application-cta-create-content-title\">Beginnen Sie mit der Erstellung Ihres Widgets<\/div>\n\n                            <div class=\"application-cta-create-content-text\">Schnell. Einfach. Keine Codierung.<\/div>\n\n                            <a class=\"application-cta-create-content-button button-48 button-has-right-icon button-black button\" href=\"\">\n                                <span class=\"button-label\">Widget erstellen<\/span>\n\n                                <svg class=\"button-icon\">\n                                    <use xlink:href=\"#icon-arrow-link\"><\/use>\n                                <\/svg>\n                            <\/a>\n                        <\/div>\n                    <\/div>\n                <\/div>\n\n<div class=\"application-examples-item application-examples-item-loading\">\n                            <div class=\"col-row\">\n                                <div class=\"col-6 col-m-8 col-s-12\"><h3 class=\"application-examples-item-title\">Beispiel 4: Wei\u00dfe Icons<\/h3><div class=\"application-examples-item-description\">Um das Widget in das allgemeine Konzept des Stils einzuf\u00fcgen, k\u00f6nnen Sie dessen Aussehen vollst\u00e4ndig \u00e4ndern. Hier haben die Symbole einen wei\u00dfen Hintergrund und die Symbole der Medien haben die nativen Farben gespeichert, um die Authentizit\u00e4t zu gew\u00e4hrleisten. Durch die abgerundete Form und die individuelle Breite wirken sie sauber und minimalistisch.<\/div><\/div>\n                <\/div>\n\n                <div class=\"application-examples-item-iframe-container browser-frame\">\n                    <div class=\"application-examples-item-iframe-wrapper\">\n                        <iframe class=\"application-examples-item-iframe\" data-src=\"https:\/\/elfsight.com\/examples?widget_id=6ac81eff-028d-46dd-91ea-f13a8e0f2286&padding=140px+40px+0\" width=\"100%\" allow=\"autoplay; fullscreen\"><\/iframe>\n                    <\/div>\n\n                    <div class=\"application-examples-item-loader\"><\/div>\n                <\/div>\n            <\/div>\n\n<div class=\"application-examples-item application-examples-item-loading\">\n                            <div class=\"col-row\">\n                                <div class=\"col-6 col-m-8 col-s-12\"><h3 class=\"application-examples-item-title\">Beispiel 5: Minimalistische Symbole<\/h3><div class=\"application-examples-item-description\">Dank des auf dieses Widget angewendeten Symbolstils werden die Symbole ohne Hintergrund angezeigt. Die Symbole der Medien haben die nativen Farben gespeichert und wirken maximal minimalistisch und sauber. Die Zoom-Animation wird beim Hover angezeigt, und Sie k\u00f6nnen weitere Animation Varianten ausw\u00e4hlen.<\/div><\/div>\n                <\/div>\n\n                <div class=\"application-examples-item-iframe-container browser-frame\">\n                    <div class=\"application-examples-item-iframe-wrapper\">\n                        <iframe class=\"application-examples-item-iframe\" data-src=\"https:\/\/elfsight.com\/examples?widget_id=384a754c-c101-4c7d-9ea6-06850e7ba6af&padding=140px+40px+0\" width=\"100%\" allow=\"autoplay; fullscreen\"><\/iframe>\n                    <\/div>\n\n                    <div class=\"application-examples-item-loader\"><\/div>\n                <\/div>\n            <\/div>\n\n<div class=\"application-examples-item application-examples-item-loading\">\n                            <div class=\"col-row\">\n                                <div class=\"col-6 col-m-8 col-s-12\"><h3 class=\"application-examples-item-title\">Beispiel 6: More Icons<\/h3><div class=\"application-examples-item-description\">You can display any amount of icons on the page, and this example proves that they will look great - whatever the number. There are 8 icons arranged in one line and aligned center. All have native colors of background and symbols and show bounce animation when hovered.<\/div><\/div>\n                <\/div>\n\n                <div class=\"application-examples-item-iframe-container browser-frame\">\n                    <div class=\"application-examples-item-iframe-wrapper\">\n                        <iframe class=\"application-examples-item-iframe\" data-src=\"https:\/\/elfsight.com\/examples?widget_id=28d8a218-1153-4b07-88b8-2debb5da9b3d&padding=140px+40px+0\" width=\"100%\" allow=\"autoplay; fullscreen\"><\/iframe>\n                    <\/div>\n\n                    <div class=\"application-examples-item-loader\"><\/div>\n                <\/div>\n            <\/div>\n\n<div class=\"application-examples-item application-examples-item-loading\">\n                            <div class=\"col-row\">\n                                <div class=\"col-6 col-m-8 col-s-12\"><h3 class=\"application-examples-item-title\">Beispiel  7: Messengers<\/h3><div class=\"application-examples-item-description\">Dieses Beispiel zeigt, wie Sie Benutzer in Messenger direkt von der Website zu Ihren Kan\u00e4len leiten k\u00f6nnen. Die Symbole in diesem Beispiel haben eine moderate Gr\u00f6\u00dfe von 32 Pixel und eine Kreisform. Die Originalfarben der Boten werden im Hintergrund gespeichert und die Symbole selbst sind wei\u00df. Diese Optionen sowie weitere Anpassungseinstellungen k\u00f6nnen im Editor problemlos ge\u00e4ndert werden.<\/div><\/div>\n                <\/div>\n\n                <div class=\"application-examples-item-iframe-container browser-frame\">\n                    <div class=\"application-examples-item-iframe-wrapper\">\n                        <iframe class=\"application-examples-item-iframe\" data-src=\"https:\/\/elfsight.com\/examples?widget_id=ba6fb5e7-354a-4852-83ee-9dc55cb498b1&padding=140px+40px+0\" width=\"100%\" allow=\"autoplay; fullscreen\"><\/iframe>\n                    <\/div>\n\n                    <div class=\"application-examples-item-loader\"><\/div>\n                <\/div>\n            <\/div>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":11,"featured_media":0,"parent":2084,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"templates\/template-application-examples.php","meta":{"publish_to_discourse":"","publish_post_category":"","wpdc_auto_publish_overridden":"","wpdc_topic_tags":"","wpdc_pin_topic":"","wpdc_pin_until":"","discourse_post_id":"","discourse_permalink":"","wpdc_publishing_response":"","wpdc_publishing_error":"","footnotes":""},"class_list":["post-2086","page","type-page","status-publish","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v25.3.1 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Soziale Netzwerke Icons Plugin f\u00fcr Ihre Website (kostenlos und schnell)<\/title>\n<meta name=\"description\" content=\"Integrieren Sie Ihr bestes Soziale Netzwerke Icons Plugin auf die Website. Testen Sie eine kostenlose Demo zum kostenlosen Soziale Netzwerke Icons Plugins.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/elfsight.com\/de\/social-media-icons-widget\/examples\/\" \/>\n<meta property=\"og:locale\" content=\"de_DE\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Soziale Netzwerke Icons Plugin f\u00fcr Ihre Website (kostenlos und schnell)\" \/>\n<meta property=\"og:description\" content=\"Integrieren Sie Ihr bestes Soziale Netzwerke Icons Plugin auf die Website. Testen Sie eine kostenlose Demo zum kostenlosen Soziale Netzwerke Icons Plugins.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/elfsight.com\/de\/social-media-icons-widget\/examples\/\" \/>\n<meta property=\"og:site_name\" content=\"Elfsight DE\" \/>\n<meta property=\"article:modified_time\" content=\"2020-07-31T13:21:39+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Gesch\u00e4tzte Lesezeit\" \/>\n\t<meta name=\"twitter:data1\" content=\"3\u00a0Minuten\" \/>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Soziale Netzwerke Icons Plugin f\u00fcr Ihre Website (kostenlos und schnell)","description":"Integrieren Sie Ihr bestes Soziale Netzwerke Icons Plugin auf die Website. Testen Sie eine kostenlose Demo zum kostenlosen Soziale Netzwerke Icons Plugins.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/elfsight.com\/de\/social-media-icons-widget\/examples\/","og_locale":"de_DE","og_type":"article","og_title":"Soziale Netzwerke Icons Plugin f\u00fcr Ihre Website (kostenlos und schnell)","og_description":"Integrieren Sie Ihr bestes Soziale Netzwerke Icons Plugin auf die Website. Testen Sie eine kostenlose Demo zum kostenlosen Soziale Netzwerke Icons Plugins.","og_url":"https:\/\/elfsight.com\/de\/social-media-icons-widget\/examples\/","og_site_name":"Elfsight DE","article_modified_time":"2020-07-31T13:21:39+00:00","twitter_card":"summary_large_image","twitter_misc":{"Gesch\u00e4tzte Lesezeit":"3\u00a0Minuten"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/elfsight.com\/de\/social-media-icons-widget\/examples\/","url":"https:\/\/elfsight.com\/de\/social-media-icons-widget\/examples\/","name":"Soziale Netzwerke Icons Plugin f\u00fcr Ihre Website (kostenlos und schnell)","isPartOf":{"@id":"https:\/\/elfsight.com\/de\/#website"},"datePublished":"2020-07-31T12:53:51+00:00","dateModified":"2020-07-31T13:21:39+00:00","description":"Integrieren Sie Ihr bestes Soziale Netzwerke Icons Plugin auf die Website. Testen Sie eine kostenlose Demo zum kostenlosen Soziale Netzwerke Icons Plugins.","breadcrumb":{"@id":"https:\/\/elfsight.com\/de\/social-media-icons-widget\/examples\/#breadcrumb"},"inLanguage":"de","potentialAction":[{"@type":"ReadAction","target":["https:\/\/elfsight.com\/de\/social-media-icons-widget\/examples\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/elfsight.com\/de\/social-media-icons-widget\/examples\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/elfsight.com\/de\/"},{"@type":"ListItem","position":2,"name":"Social Media Icons","item":"https:\/\/elfsight.com\/de\/social-media-icons-widget\/"},{"@type":"ListItem","position":3,"name":"Social Media Icons &#8211; Examples"}]},{"@type":"WebSite","@id":"https:\/\/elfsight.com\/de\/#website","url":"https:\/\/elfsight.com\/de\/","name":"Elfsight DE","description":"Just another Elfsight Sites site","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/elfsight.com\/de\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"de"}]}},"meta_box":{"industry":"","seo_heading":"","heading":"","description":"","cta_heading":"","cta_description":"","application":"466","h1":"Soziale Netzwerke Icons Widget auf Ihre Seite","h1_caption":"Sehen Sie alle Beispiele f\u00fcr Soziale Netzwerke Icons Plugin, um das volle Potenzial des Widgets zu erkennen.","application_category":[],"applications_title":"","applications_request_title":"","applications_request_button_text":"","hero_text":"","hero_video":"","hero_video_schema_markup":"","selling_points_title":"","selling_points_caption":"","selling_points":[],"selling_points_cta_text":"","features_title":"","features":"","ed_cta_examples_text":"","ed_cta_examples_hidden":"","ed_cta_demo_text":"","ed_cta_demo_hidden":"","why_caption":"","why_editor_title":"","why_editor_text":"","why_team_title":"","why_team_text":"","why_service_title":"","why_service_text":"","template_catalog_visible":"","template_catalog_title":"","template_catalog_text":"","template_catalog_categories_visible":"","demo_title":"","demo_caption":"","default_faq_hidden":"","app_template_category":[],"platform":"","template_public_id":"","codecanyon_url":"","codecanyon_item_id":"","codecanyon_price":"","pricing_caption":"","pricing_elfsight_apps_hide_column":"","pricing_elfsight_apps_url":"","pricing_codecanyon_price_caption":"","integration_category":[],"integration_request_title":"","integration_request_cta":"","integration_platform":"","integrations":[],"platform_category":[],"video_schema_markup":"","price":"","trial":"","benefits":[],"button_url":"","button_target_blank":"","button_nofollow":"","attributes":[],"tags":[],"tags_disable_links":"","hide_more_platforms":"","video_object":"","demo_hide_cta":"","demo_hide_cloud_options":"","pricing_title":"","pricing":[],"related_apps_title":"","related_apps_hidden":"","author":"","image":[],"title":"","job":"","social_networks":[]},"_links":{"self":[{"href":"https:\/\/elfsight.com\/de\/wp-json\/wp\/v2\/pages\/2086","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/elfsight.com\/de\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/elfsight.com\/de\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/elfsight.com\/de\/wp-json\/wp\/v2\/users\/11"}],"replies":[{"embeddable":true,"href":"https:\/\/elfsight.com\/de\/wp-json\/wp\/v2\/comments?post=2086"}],"version-history":[{"count":6,"href":"https:\/\/elfsight.com\/de\/wp-json\/wp\/v2\/pages\/2086\/revisions"}],"predecessor-version":[{"id":2106,"href":"https:\/\/elfsight.com\/de\/wp-json\/wp\/v2\/pages\/2086\/revisions\/2106"}],"up":[{"embeddable":true,"href":"https:\/\/elfsight.com\/de\/wp-json\/wp\/v2\/pages\/2084"}],"wp:attachment":[{"href":"https:\/\/elfsight.com\/de\/wp-json\/wp\/v2\/media?parent=2086"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}