{"id":249,"date":"2026-04-21T12:59:58","date_gmt":"2026-04-21T12:59:58","guid":{"rendered":"https:\/\/help.excelerate.app\/?post_type=docs&#038;p=249"},"modified":"2026-06-12T15:59:37","modified_gmt":"2026-06-12T15:59:37","password":"","slug":"bild","status":"publish","type":"docs","link":"https:\/\/help.excelerate.app\/en\/help\/bild\/","title":{"rendered":"Picture"},"content":{"rendered":"<div data-elementor-type=\"wp-post\" data-elementor-id=\"249\" class=\"elementor elementor-249\">\n\t\t\t\t<div class=\"elementor-element elementor-element-4109b0b4 e-con-full e-flex e-con e-parent\" data-id=\"4109b0b4\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-7c73d349 elementor-widget elementor-widget-text-editor\" data-id=\"7c73d349\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<h2>Application<\/h2><div class=\"elementor-element elementor-element-a9dff80 elementor-widget elementor-widget-fp-text\" data-id=\"a9dff80\" data-element_type=\"widget\" data-widget_type=\"fp-text.default\"><div class=\"elementor-widget-container\"><div class=\"text\"><p>Use the image element to illustrate your WBT. This element is part of the basic elements and is therefore versatile. To better explain the images, you can assign labels to the image and position them at important locations on the image.<\/p><\/div><\/div><\/div>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-c67b480 elementor-widget elementor-widget-text-editor\" data-id=\"c67b480\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<h2>Video tutorial<\/h2><div class=\"elementor-element elementor-element-a9dff80 elementor-widget elementor-widget-fp-text\" data-id=\"a9dff80\" data-element_type=\"widget\" data-widget_type=\"fp-text.default\"><div class=\"elementor-widget-container\"><div class=\"text\"><p>Learn in the following video tutorial how to create the element<\/p><\/div><\/div><\/div>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-23022294 elementor-widget elementor-widget-video\" data-id=\"23022294\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;video_type&quot;:&quot;vimeo&quot;}\" data-widget_type=\"video.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-wrapper elementor-open-inline\">\n\t\t\t<iframe class=\"elementor-video-iframe\" allowfullscreen allow=\"clipboard-write\" title=\"Vimeo video player\" src=\"https:\/\/player.vimeo.com\/video\/999331914?color&amp;autopause=0&amp;loop=0&amp;muted=0&amp;title=1&amp;portrait=1&amp;byline=1&amp;h=75f17d733a#t=\"><\/iframe>\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-6df4056 elementor-widget elementor-widget-spacer\" data-id=\"6df4056\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-47500f6 elementor-widget elementor-widget-text-editor\" data-id=\"47500f6\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<h2 id=\"1-toc-title\" class=\"betterdocs-content-heading\">Add image element<\/h2><div class=\"elementor-element elementor-element-633fbe83 elementor-widget elementor-widget-text-editor\" data-id=\"633fbe83\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\"><div id=\"model-response-message-contentr_a9f677e6d41788df\" class=\"markdown markdown-main-panel stronger enable-updated-hr-color\" dir=\"ltr\" aria-live=\"polite\" aria-busy=\"false\"><p data-path-to-node=\"0\">Drag the Image element into a module or section.<\/p><\/div><\/div>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-160a55d elementor-widget elementor-widget-image\" data-id=\"160a55d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img fetchpriority=\"high\" decoding=\"async\" width=\"1502\" height=\"921\" src=\"https:\/\/help.excelerate.app\/wp-content\/uploads\/2026\/04\/Kapitel-start-einfuegen-1.jpg\" class=\"attachment-full size-full wp-image-3561\" alt=\"\" srcset=\"https:\/\/help.excelerate.app\/wp-content\/uploads\/2026\/04\/Kapitel-start-einfuegen-1.jpg 1502w, https:\/\/help.excelerate.app\/wp-content\/uploads\/2026\/04\/Kapitel-start-einfuegen-1-300x184.jpg 300w, https:\/\/help.excelerate.app\/wp-content\/uploads\/2026\/04\/Kapitel-start-einfuegen-1-1024x628.jpg 1024w, https:\/\/help.excelerate.app\/wp-content\/uploads\/2026\/04\/Kapitel-start-einfuegen-1-768x471.jpg 768w, https:\/\/help.excelerate.app\/wp-content\/uploads\/2026\/04\/Kapitel-start-einfuegen-1-18x12.jpg 18w, https:\/\/help.excelerate.app\/wp-content\/uploads\/2026\/04\/Kapitel-start-einfuegen-1-360x221.jpg 360w\" sizes=\"(max-width: 1502px) 100vw, 1502px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-c3dcb95 elementor-widget elementor-widget-spacer\" data-id=\"c3dcb95\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-93f9655 elementor-widget elementor-widget-text-editor\" data-id=\"93f9655\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<h2 id=\"1-toc-title\" class=\"betterdocs-content-heading\">Picture Settings<\/h2><div class=\"elementor-element elementor-element-633fbe83 elementor-widget elementor-widget-text-editor\" data-id=\"633fbe83\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\"><div id=\"model-response-message-contentr_a9f677e6d41788df\" class=\"markdown markdown-main-panel stronger enable-updated-hr-color\" dir=\"ltr\" aria-live=\"polite\" aria-busy=\"false\"><p data-path-to-node=\"0\">Check out the hotspots to see which settings are available for the image.<\/p><\/div><\/div>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-e0d58f4 elementor-widget elementor-widget-hotspots\" data-id=\"e0d58f4\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"hotspots.default\">\n\t\t\t\t\t            <div class=\"excelerate-hotspots\">\n                <img decoding=\"async\" class=\"excelerate-hotspots-image\" src=\"https:\/\/help.excelerate.app\/wp-content\/uploads\/2026\/04\/Kapitel-uebersicht-2.jpg\" \/>\n                <div class=\"excelerate-hotspots-hotspots\">\n                                                <div class=\"excelerate-hotspots-hotspot excelerate-hotspots-hotspot-right\" style=\"top: 29%; left: 77%;\">\n                                <div class=\"excelerate-hotspots-hotspot-icon\">\n                                    1                                <\/div>\n                                <div class=\"excelerate-hotspots-hotspot-content\">\n                                    <div class=\"excelerate-hotspots-hotspot-headline\">Upload media<\/div>\n                                    <div class=\"excelerate-hotspots-hotspot-text\">Click the \u201eSelect Image\u201c area to open the media library. Choose an image and confirm your selection.<\/div>\n                                <\/div>\n                            <\/div>\n                                                        <div class=\"excelerate-hotspots-hotspot\" style=\"top: 41%; left: 23%;\">\n                                <div class=\"excelerate-hotspots-hotspot-icon\">\n                                    2                                <\/div>\n                                <div class=\"excelerate-hotspots-hotspot-content\">\n                                    <div class=\"excelerate-hotspots-hotspot-headline\">Full width<\/div>\n                                    <div class=\"excelerate-hotspots-hotspot-text\">Determine whether the image should be displayed in full width.<\/div>\n                                <\/div>\n                            <\/div>\n                                                        <div class=\"excelerate-hotspots-hotspot excelerate-hotspots-hotspot-right\" style=\"top: 47%; left: 77%;\">\n                                <div class=\"excelerate-hotspots-hotspot-icon\">\n                                    3                                <\/div>\n                                <div class=\"excelerate-hotspots-hotspot-content\">\n                                    <div class=\"excelerate-hotspots-hotspot-headline\">Width<\/div>\n                                    <div class=\"excelerate-hotspots-hotspot-text\">Adjust the image size using the slider. From extra narrow to extra wide.<\/div>\n                                <\/div>\n                            <\/div>\n                                                        <div class=\"excelerate-hotspots-hotspot\" style=\"top: 53%; left: 23%;\">\n                                <div class=\"excelerate-hotspots-hotspot-icon\">\n                                    4                                <\/div>\n                                <div class=\"excelerate-hotspots-hotspot-content\">\n                                    <div class=\"excelerate-hotspots-hotspot-headline\">Alignment<\/div>\n                                    <div class=\"excelerate-hotspots-hotspot-text\">Decide how you want to align your image. By default, it is always centered.<\/div>\n                                <\/div>\n                            <\/div>\n                                                        <div class=\"excelerate-hotspots-hotspot excelerate-hotspots-hotspot-right\" style=\"top: 59%; left: 77%;\">\n                                <div class=\"excelerate-hotspots-hotspot-icon\">\n                                    5                                <\/div>\n                                <div class=\"excelerate-hotspots-hotspot-content\">\n                                    <div class=\"excelerate-hotspots-hotspot-headline\">Zoom<\/div>\n                                    <div class=\"excelerate-hotspots-hotspot-text\">Move the slider to zoom in on your image.<\/div>\n                                <\/div>\n                            <\/div>\n                                                        <div class=\"excelerate-hotspots-hotspot excelerate-hotspots-hotspot-right\" style=\"top: 73%; left: 77%;\">\n                                <div class=\"excelerate-hotspots-hotspot-icon\">\n                                    6                                <\/div>\n                                <div class=\"excelerate-hotspots-hotspot-content\">\n                                    <div class=\"excelerate-hotspots-hotspot-headline\">Labels<\/div>\n                                    <div class=\"excelerate-hotspots-hotspot-text\">Turn on labels if you want to further label your image using labels.<\/div>\n                                <\/div>\n                            <\/div>\n                                            <\/div>\n\t\t    <\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-c40a792 elementor-widget elementor-widget-spacer\" data-id=\"c40a792\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-3bf18af elementor-widget elementor-widget-text-editor\" data-id=\"3bf18af\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<h2 id=\"1-toc-title\" class=\"betterdocs-content-heading\">Label settings<\/h2><div class=\"elementor-element elementor-element-633fbe83 elementor-widget elementor-widget-text-editor\" data-id=\"633fbe83\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\"><div id=\"model-response-message-contentr_a9f677e6d41788df\" class=\"markdown markdown-main-panel stronger enable-updated-hr-color\" dir=\"ltr\" aria-live=\"polite\" aria-busy=\"false\"><p data-path-to-node=\"0\">Labels are text fields that you can insert into, for example, images or hotspots. With these, you can describe and translate elements directly in the editor. Take a look at the hotspots to find out what settings you have for the labels.<\/p><\/div><\/div>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-c58b03b elementor-widget elementor-widget-hotspots\" data-id=\"c58b03b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"hotspots.default\">\n\t\t\t\t\t            <div class=\"excelerate-hotspots\">\n                <img decoding=\"async\" class=\"excelerate-hotspots-image\" src=\"https:\/\/help.excelerate.app\/wp-content\/uploads\/2026\/04\/Labels.jpg\" \/>\n                <div class=\"excelerate-hotspots-hotspots\">\n                                                <div class=\"excelerate-hotspots-hotspot excelerate-hotspots-hotspot-right\" style=\"top: 35%; left: 77%;\">\n                                <div class=\"excelerate-hotspots-hotspot-icon\">\n                                    1                                <\/div>\n                                <div class=\"excelerate-hotspots-hotspot-content\">\n                                    <div class=\"excelerate-hotspots-hotspot-headline\">Area<\/div>\n                                    <div class=\"excelerate-hotspots-hotspot-text\">Decide whether your labels should have a color and, if so, which one. Or whether they are transparent.<\/div>\n                                <\/div>\n                            <\/div>\n                                                        <div class=\"excelerate-hotspots-hotspot excelerate-hotspots-hotspot-right\" style=\"top: 54%; left: 77%;\">\n                                <div class=\"excelerate-hotspots-hotspot-icon\">\n                                    2                                <\/div>\n                                <div class=\"excelerate-hotspots-hotspot-content\">\n                                    <div class=\"excelerate-hotspots-hotspot-headline\">Text<\/div>\n                                    <div class=\"excelerate-hotspots-hotspot-text\">Paste your text into the label field and format it using the rich text editor.<\/div>\n                                <\/div>\n                            <\/div>\n                                                        <div class=\"excelerate-hotspots-hotspot\" style=\"top: 61%; left: 23%;\">\n                                <div class=\"excelerate-hotspots-hotspot-icon\">\n                                    3                                <\/div>\n                                <div class=\"excelerate-hotspots-hotspot-content\">\n                                    <div class=\"excelerate-hotspots-hotspot-headline\">Alignment<\/div>\n                                    <div class=\"excelerate-hotspots-hotspot-text\">Determine the alignment of your labels.<\/div>\n                                <\/div>\n                            <\/div>\n                                                        <div class=\"excelerate-hotspots-hotspot excelerate-hotspots-hotspot-right\" style=\"top: 77%; left: 77%;\">\n                                <div class=\"excelerate-hotspots-hotspot-icon\">\n                                    4                                <\/div>\n                                <div class=\"excelerate-hotspots-hotspot-content\">\n                                    <div class=\"excelerate-hotspots-hotspot-headline\">Add labels<\/div>\n                                    <div class=\"excelerate-hotspots-hotspot-text\">Click \u201eAdd labels\u201c to add another label.<\/div>\n                                <\/div>\n                            <\/div>\n                                            <\/div>\n\t\t    <\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-5d7ebb3 elementor-widget elementor-widget-tips\" data-id=\"5d7ebb3\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"tips.default\">\n\t\t\t\t\t            <div class=\"excelerate-tips\">\n\t\t\t\t<div class=\"excelerate-tips-content\">\n\t\t\t\t\t<h1>Tip<\/h1><p>Images can be included as a single element or be part of another element.<\/p>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"excelerate-tips-icon\">\n\t\t\t\t\t\t\t\t\t<\/div>\n\t\t    <\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>Anwendung Verwende das Bild Element, um dein WBT zu bebildern. Dieses Element ist Teil der Basiselemente und somit vielseitig einsetzbar. Um die Bilder besser erkl\u00e4ren zu k\u00f6nnen, kannst du dem Bild Labels vergeben und sie auf wichtigen Positionen auf dem Bild positionieren. Video Anleitung Erfahre in dem folgenden Video Tutorial, wie du das Element erstellst [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","template":"","meta":{"footnotes":""},"doc_category":[5],"doc_tag":[],"class_list":["post-249","docs","type-docs","status-publish","hentry","doc_category-basiselemente"],"year_month":"2026-09","word_count":285,"total_views":"2","reactions":{"happy":"0","normal":"0","sad":"0"},"author_info":{"name":"Excelerate","author_nicename":"excelerate","author_url":"https:\/\/help.excelerate.app\/en\/author\/excelerate\/"},"doc_category_info":[{"term_name":"Creator - Basis Elemente","term_url":"https:\/\/help.excelerate.app\/en\/docs-category\/basiselemente\/"}],"doc_tag_info":[],"knowledge_base_info":[],"knowledge_base_slug":[],"_links":{"self":[{"href":"https:\/\/help.excelerate.app\/en\/wp-json\/wp\/v2\/docs\/249","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/help.excelerate.app\/en\/wp-json\/wp\/v2\/docs"}],"about":[{"href":"https:\/\/help.excelerate.app\/en\/wp-json\/wp\/v2\/types\/docs"}],"author":[{"embeddable":true,"href":"https:\/\/help.excelerate.app\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/help.excelerate.app\/en\/wp-json\/wp\/v2\/comments?post=249"}],"version-history":[{"count":40,"href":"https:\/\/help.excelerate.app\/en\/wp-json\/wp\/v2\/docs\/249\/revisions"}],"predecessor-version":[{"id":3772,"href":"https:\/\/help.excelerate.app\/en\/wp-json\/wp\/v2\/docs\/249\/revisions\/3772"}],"wp:attachment":[{"href":"https:\/\/help.excelerate.app\/en\/wp-json\/wp\/v2\/media?parent=249"}],"wp:term":[{"taxonomy":"doc_category","embeddable":true,"href":"https:\/\/help.excelerate.app\/en\/wp-json\/wp\/v2\/doc_category?post=249"},{"taxonomy":"doc_tag","embeddable":true,"href":"https:\/\/help.excelerate.app\/en\/wp-json\/wp\/v2\/doc_tag?post=249"}],"curies":[{"name":"WP","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}