{"id":4655,"date":"2020-01-13T10:05:17","date_gmt":"2020-01-13T10:05:17","guid":{"rendered":"https:\/\/www.bay20.com\/?p=4655"},"modified":"2025-05-07T12:57:14","modified_gmt":"2025-05-07T07:12:14","slug":"erstellen-sie-ein-benutzerdefiniertes-design-in-magento-2","status":"publish","type":"post","link":"https:\/\/www.bay20.com\/de\/erstellen-sie-ein-benutzerdefiniertes-design-in-magento-2\/","title":{"rendered":"Erstellen eines benutzerdefinierten Themas in Magento 2"},"content":{"rendered":"\n<p>Bitte folgen Sie den Schritten, um ein benutzerdefiniertes Theme in Magento 2 zu erstellen<\/p>\n\n\n\n<p><strong>Schritt 1: Erstellen Sie ein Verzeichnis f\u00fcr Theme<\/strong><br>Erstellen Sie ein Verzeichnis in app\/desing\/frontend\/ mit dem Namen des Anbieters und einem Thema wie:<br><em>app\/design\/frontend\/vendorName\/themeName<\/em><\/p>\n\n\n\n<p><strong>Schritt 2: Deklaration der Datei theme.xml im Verzeichnis theme<\/strong><br>Erstellen Sie eine theme.xml-Datei unter &#8222;app\/design\/frontend\/vendorName\/themeName&#8220;. Diese Datei enth\u00e4lt den Namen des Themas, den Namen des \u00fcbergeordneten Themas und eine Vorschau des Themas.<\/p>\n\n\n\n<pre>&lt;theme xmlns:xsi=\"http:\/\/www.w3.org\/2001\/XMLSchema-instance\" xsi:noNamespaceSchemaLocation=\"urn:magento:framework:Config\/etc\/theme.xsd\"&gt;\n    &lt;title&gt;Vendor ThemeName&lt;\/title&gt; &lt;!-- your theme name --&gt;\n    &lt;parent&gt;Magento\/blank&lt;\/parent&gt; &lt;!-- the parent theme, in case your theme inherits from an existing theme like luma\/blank--&gt;\n    &lt;media&gt;\n        &lt;preview_image&gt;media\/preview.jpg&lt;\/preview_image&gt; &lt;!-- the path to your theme preview image --&gt;\n    &lt;\/media&gt;\n&lt;\/theme&gt;\n<\/pre>\n\n\n\n<p><\/p>\n\n\n\n<p><strong>Schritt 3: Erstellen einer Composer-Datei Composer-Datei unter dem Theme-Verzeichnis<\/strong><\/p>\n\n\n\n<p><a href=\"https:\/\/www.bay20.com\/hire-magento2-developer\/\"><strong>Magento 2 themes<\/strong><\/a> werden als Composer-Pakete vertrieben, so dass sie als Paket auf dem Server registriert werden. <br>Hinzuf\u00fcgen der Datei composer.json, die optional ist Ex: app\/design\/frontend\/vendorName\/themeName\/composer.json<\/p>\n\n\n\n<pre>{\n\"name\": \"vendorName\/themeName\",\n\"description\": \"N\/A\",\n\"require\": {\n\"php\": \"~5.5.0|~5.6.0|~7.0.0\",\n\"magento\/theme-frontend-blank\": \"100.0.*\",\n\"magento\/framework\": \"100.0.*\"\n},\n\"type\": \"magento2-theme\",\n\"version\": \"100.0.1\",\n\"license\": [\n\"OSL-3.0\",\n\"AFL-3.0\"\n],\n\"autoload\": {\n\"files\": [\n\"registration.php\"\n]\n}\n}\n<\/pre>\n\n\n\n<p><\/p>\n\n\n\n<p><strong>Schritt 4: Hinzuf\u00fcgen der Datei registration.php im Theme-Verzeichnis<\/strong><br> Ex: app\/design\/frontend\/vendorName\/themeName\/ registration.php<\/p>\n\n\n\n<pre>&lt;?php\n\/**\n* Copyright \u00a9 2017 Magento. All rights reserved.\n* See COPYING.txt for license details.\n*\/\n\\Magento\\Framework\\Component\\ComponentRegistrar::register(\n\\Magento\\Framework\\Component\\ComponentRegistrar::THEME,\n'frontend\/vendorName\/themeName',\n__DIR__\n);\n<\/pre>\n\n\n\n<p><strong>Schritt 5: \u00dcberpr\u00fcfen Sie alle oben genannten Dateien ordnungsgem\u00e4\u00df, bevor Sie den Upgrade- und Deploy-Befehl ausf\u00fchren, denn sobald Sie den Befehl ausf\u00fchren. Magento wird eine Tabelle f\u00fcr das Thema generieren.<\/strong><\/p>\n\n\n\n<p><strong>Schritt 6: F\u00fchren Sie die Befehle setup upgrade und deploy aus.<br><\/strong>Setup Upgrade Befehl: php bin\/magento setup:upgrade<br>Setup Deploy-Befehl: php bin\/magento setup:static-content:deploy<br>(Wenn der Entwicklermodus aktiviert ist, m\u00fcssen Sie das Deployment mit dem Flag -f ausf\u00fchren: php bin\/magento setup:static-content:deploy -f)<\/p>\n\n\n\n<p><strong>Schritt 7: Thema im Backend pr\u00fcfen<\/strong><br>Gehen Sie zu \u201eInhalt > Themen\u201c und Sie sehen das von Ihnen erstellte Thema.<br><img loading=\"lazy\" decoding=\"async\" width=\"1000\" height=\"255\" class=\"wp-image-4672\" style=\"width: 1000px;\" src=\"https:\/\/www.bay20.com\/wp-content\/uploads\/2020\/01\/available-theme.png\" alt=\"\" srcset=\"https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2020\/01\/available-theme.png 1750w, https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2020\/01\/available-theme-300x76.png 300w, https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2020\/01\/available-theme-800x204.png 800w, https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2020\/01\/available-theme-768x196.png 768w, https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2020\/01\/available-theme-980x250.png 980w, https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2020\/01\/available-theme-805x205.png 805w\" sizes=\"auto, (max-width: 1000px) 100vw, 1000px\" \/><\/p>\n\n\n\n<p><strong>Schritt 8: Zuweisung eines benutzerdefinierten Themas zum Speicher<\/strong><br>Gehen Sie zu &#8218;Inhalt > Konfiguration&#8216;. <br>Klicken Sie auf die Schaltfl\u00e4che \u201eBearbeiten\u201c in der Spalte \u201eAktion\u201c und ordnen Sie das Thema im Dropdown-Men\u00fc zu.<\/p>\n\n\n\n<p><strong>Bitte kontaktieren Sie uns unter <strong><a href=\"mailto:manish@bay20.com\">manish@bay20.com<\/a><\/strong> oder rufen Sie uns unter <strong><a href=\"https:\/\/api.whatsapp.com\/send?phone=+918800519180&amp;text=Hi,%20I%20contacted%20you%20through%20your%20website.\" target=\"_blank\" rel=\"noreferrer noopener\">+91-8800519180<\/a><\/strong> an, wenn Sie Unterst\u00fctzung f\u00fcr Magento 2 ben\u00f6tigen. Sie k\u00f6nnen auch die <strong><a href=\"https:\/\/www.bay20.com\/magento2-development\/\">Magento2<strong>-Entwicklungsseite<\/strong><\/a><\/strong> besuchen, um die von uns angebotenen Dienstleistungen zu \u00fcberpr\u00fcfen.<\/strong><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Bitte folgen Sie den Schritten, um ein benutzerdefiniertes Theme in Magento 2 zu erstellen Schritt 1: Erstellen Sie ein Verzeichnis f\u00fcr ThemeErstellen Sie ein Verzeichnis in app\/desing\/frontend\/ mit dem Namen des Anbieters und einem Thema wie:app\/design\/frontend\/vendorName\/themeName Schritt 2: Deklaration der Datei theme.xml im Verzeichnis themeErstellen Sie eine theme.xml-Datei unter &#8222;app\/design\/frontend\/vendorName\/themeName&#8220;. Diese Datei enth\u00e4lt den Namen [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":4669,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[88,79],"tags":[],"class_list":["post-4655","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-entwicklung","category-magento-anleitung"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.bay20.com\/de\/wp-json\/wp\/v2\/posts\/4655","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.bay20.com\/de\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.bay20.com\/de\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.bay20.com\/de\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.bay20.com\/de\/wp-json\/wp\/v2\/comments?post=4655"}],"version-history":[{"count":24,"href":"https:\/\/www.bay20.com\/de\/wp-json\/wp\/v2\/posts\/4655\/revisions"}],"predecessor-version":[{"id":16796,"href":"https:\/\/www.bay20.com\/de\/wp-json\/wp\/v2\/posts\/4655\/revisions\/16796"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.bay20.com\/de\/wp-json\/wp\/v2\/media\/4669"}],"wp:attachment":[{"href":"https:\/\/www.bay20.com\/de\/wp-json\/wp\/v2\/media?parent=4655"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.bay20.com\/de\/wp-json\/wp\/v2\/categories?post=4655"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.bay20.com\/de\/wp-json\/wp\/v2\/tags?post=4655"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}