{"id":17898,"date":"2026-08-07T11:01:43","date_gmt":"2026-08-07T05:16:43","guid":{"rendered":"https:\/\/www.bay20.com\/de\/?p=17898"},"modified":"2026-08-19T14:40:20","modified_gmt":"2026-08-19T08:55:20","slug":"wie-erstelle-ich-mit-one-click-catalyst-einen-bigcommerce-catalyst-storefront","status":"publish","type":"post","link":"https:\/\/www.bay20.com\/de\/wie-erstelle-ich-mit-one-click-catalyst-einen-bigcommerce-catalyst-storefront\/","title":{"rendered":"Wie erstelle ich mit \u201eOne-Click Catalyst\u201c einen BigCommerce-Catalyst-Storefront?"},"content":{"rendered":"\n<p>Sie k\u00f6nnen einen neuen Catalyst-Storefront-Kanal im Bereich \u201eKan\u00e4le\u201c des Shop-Kontrollpanels erstellen, genau wie andere Kanaltypen. Dieser als \u201eOne-Click Catalyst\u201c bezeichnete Vorgang umfasst mehr als nur die Erstellung eines Kanals; er beinhaltet auch die Bereitstellung einer gehosteten Vorschau der Storefront und die Einrichtung einer entsprechenden Website im visuellen Editor von Makeswift.<\/p>\n\n\n\n<p>Dieser codefreie Einstieg erm\u00f6glicht es Marketingfachleuten und Content-Autoren, sich mit den Funktionen von Catalyst und den Gestaltungsm\u00f6glichkeiten von Makeswift vertraut zu machen, ohne dass ein Entwickler hinzugezogen werden muss. Sobald Sie bereit sind, mit dem Programmieren zu beginnen, k\u00f6nnen Sie mithilfe des Catalyst-CLI-Installationsprogramms und durch die Verbindung Ihrer lokalen Codebasis mit Ihrem Storefront-Kanal ganz einfach in den \u00fcblichen Entwickler-Workflow \u00fcbergehen.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Erstellen eines Catalyst-Storefronts mit One-Click Catalyst<\/h2>\n\n\n\n<p>Das Erstellen eines Catalyst-Storefronts umfasst die Einrichtung eines neuen Storefront-Kanals und die Verwendung der One-Click Catalyst-App.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Voraussetzungen<\/h3>\n\n\n\n<p>F\u00fcr den One-Click Catalyst-Ablauf sind folgende Voraussetzungen erforderlich:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Ein BigCommerce-<strong><a href=\"https:\/\/developer.bigcommerce.com\/docs\/start\/about\/sandboxes\" target=\"_blank\" rel=\"noopener\" title=\"\">Sandbox-Shop<\/a><\/strong> oder <strong><a href=\"https:\/\/www.bigcommerce.com\/product\/\" target=\"_blank\" rel=\"noopener\" title=\"\">Testshop<\/a><\/strong> oder ein voll funktionsf\u00e4higer Produktionsshop mit einer verf\u00fcgbaren Shopfront-Lizenz.<\/li>\n\n\n\n<li>Ein Benutzer des Control Panels mit den folgenden Berechtigungen: \u201eAPI-Konten auf Shop-Ebene erstellen\u201c, \u201eAnwendungen installieren\u201c, \u201eAnwendungen starten\u201c, \u201eKan\u00e4le erstellen\u201c, \u201eKan\u00e4le verwalten\u201c, \u201eKan\u00e4le bearbeiten\u201c.<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\">Befolgen Sie diese Schritte, um mit \u201eOne-Click Catalyst\u201c einen Catalyst Storefront zu erstellen:<\/h3>\n\n\n\n<p><strong>1.<\/strong> Melden Sie sich im Admin-Bereich Ihres BigCommerce-Shops an.<\/p>\n\n\n\n<p><strong>2.<\/strong> Navigieren Sie zum \u201eChannel Manager\u201c (oder \u201eChannels\u201c) und klicken Sie auf \u201eKanal erstellen\u201c.<\/p>\n\n\n\n<p><strong>3.<\/strong> W\u00e4hlen Sie nun in der Liste der Kanaltypen neben dem Typ \u201eCatalyst\u201c die Option \u201eErstellen\u201c aus.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"980\" height=\"431\" src=\"https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2026\/08\/image-1_thum-980x431.png\" alt=\"\" class=\"wp-image-17900\" srcset=\"https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2026\/08\/image-1_thum-980x431.png 980w, https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2026\/08\/image-1_thum-300x132.png 300w, https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2026\/08\/image-1_thum-768x337.png 768w, https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2026\/08\/image-1_thum-1000x439.png 1000w, https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2026\/08\/image-1_thum-800x351.png 800w, https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2026\/08\/image-1_thum.png 1352w\" sizes=\"auto, (max-width: 980px) 100vw, 980px\" \/><\/figure>\n\n\n\n<p>4. Geben Sie den Namen des Shops ein, w\u00e4hlen Sie \u201eBeispieldaten verwenden\u201c, legen Sie eine \u201eHauptsprache\u201c fest und klicken Sie auf die Schaltfl\u00e4che \u201eErstellen\u201c, um den Shop fertigzustellen.<\/p>\n\n\n\n<p>5. Sobald der Bereitstellungsprozess beginnt, m\u00fcssen Sie warten, bis die Erstbereitstellung abgeschlossen ist.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"980\" height=\"373\" src=\"https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2026\/08\/A-Catalyst-deployment-in-progress-980x373.png\" alt=\"\" class=\"wp-image-17901\" srcset=\"https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2026\/08\/A-Catalyst-deployment-in-progress-980x373.png 980w, https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2026\/08\/A-Catalyst-deployment-in-progress-300x114.png 300w, https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2026\/08\/A-Catalyst-deployment-in-progress-768x293.png 768w, https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2026\/08\/A-Catalyst-deployment-in-progress-1000x381.png 1000w, https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2026\/08\/A-Catalyst-deployment-in-progress-800x305.png 800w, https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2026\/08\/A-Catalyst-deployment-in-progress.png 1129w\" sizes=\"auto, (max-width: 980px) 100vw, 980px\" \/><\/figure>\n\n\n\n<p>6. Sobald der Bereitstellungsprozess abgeschlossen ist, klicken Sie auf die Schaltfl\u00e4che \u201eStorefront anzeigen\u201c, um Ihre gehostete Vorschau-Storefront anzuzeigen.<\/p>\n\n\n\n<p>7. Klicken Sie anschlie\u00dfend auf die Schaltfl\u00e4che \u201eIn Makeswift bearbeiten\u201c, um den Makeswift-Editor zu starten, und vergewissern Sie sich, dass Sie Ihre Seiten bearbeiten k\u00f6nnen.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Installieren Sie das Catalyst-Projekt f\u00fcr die lokale Entwicklung<\/h2>\n\n\n\n<p>Wie wir gesehen haben, wird Ihnen beim Aufrufen eines Catalyst-Storefront-Kanals im BigCommerce-Kontrollpanel ein kurzer CLI-Befehl \u201eEntwicklung starten\u201c angezeigt, mit dem Sie ein lokales Projekt einrichten k\u00f6nnen.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Voraussetzungen<\/h3>\n\n\n\n<p>Um das Catalyst-Projekt auf Ihrem lokalen Rechner zu installieren, ben\u00f6tigen Sie Folgendes:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Eine Befehlszeilenschnittstelle auf Ihrem lokalen Rechner<\/li>\n\n\n\n<li>Node.js 20 oder h\u00f6her<\/li>\n\n\n\n<li>Der <strong><a href=\"https:\/\/pnpm.io\/installation\" target=\"_blank\" rel=\"noopener\" title=\"\">pnpm<\/a><\/strong>-Paketmanager<\/li>\n\n\n\n<li><strong><a href=\"https:\/\/git-scm.com\/\" target=\"_blank\" rel=\"noopener\" title=\"\">Git-CLI<\/a><\/strong><\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\">Befolgen Sie diese Schritte, um das Catalyst-Projekt auf Ihrem lokalen Rechner zu installieren:<\/h3>\n\n\n\n<p>1. Kopieren Sie den CLI-Befehl <strong>\u201eStart development\u201c<\/strong> aus dem Catalyst-Storefront-Kanal im BigCommerce-Kontrollpanel.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"980\" height=\"742\" src=\"https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2026\/08\/image-2_thum-980x742.png\" alt=\"\" class=\"wp-image-17902\" srcset=\"https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2026\/08\/image-2_thum-980x742.png 980w, https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2026\/08\/image-2_thum-300x227.png 300w, https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2026\/08\/image-2_thum-768x581.png 768w, https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2026\/08\/image-2_thum-1000x757.png 1000w, https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2026\/08\/image-2_thum-800x605.png 800w, https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2026\/08\/image-2_thum.png 1131w\" sizes=\"auto, (max-width: 980px) 100vw, 980px\" \/><\/figure>\n\n\n\n<p>2. Wechseln Sie in der Befehlszeile in das Verzeichnis, das sich eine Ebene \u00fcber dem gew\u00fcnschten Speicherort Ihres Projekts befindet.<\/p>\n\n\n\n<p>3. F\u00fchren Sie nun den CLI-Befehl \u201eStart development\u201c aus, den Sie aus dem Channel-Manager kopiert haben.<\/p>\n\n\n\n<p>4. Beantworten Sie die Eingabeaufforderung \u201eWie lautet der Name Ihres Projekts?\u201c. Der von Ihnen angegebene Wert wird zum Namen des f\u00fcr das Projekt erstellten Verzeichnisses.<\/p>\n\n\n\n<p>5. Sobald der Vorgang abgeschlossen ist, wird das Projekt auf Ihrem lokalen Rechner erstellt.<\/p>\n\n\n\n<p>6. Wechseln Sie nun in das neue Arbeitsverzeichnis des Projekts.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">cd \/path\/to\/catalyst\/project<\/pre>\n\n\n\n<p>7. Starten Sie anschlie\u00dfend den Entwicklungsserver mit dem folgenden Befehl.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">pnpm run dev<\/pre>\n\n\n\n<p>8. Rufen Sie nun die URL auf, die in der Befehlszeilenausgabe angezeigt wird. (In der Regel <strong><a href=\"http:\/\/localhost:3000\" target=\"_blank\" rel=\"noopener\" title=\"\">http:\/\/localhost:3000<\/a><\/strong>).<\/p>\n\n\n\n<p>Sofern Sie bei der Erstellung Ihres Catalyst-Storefronts die Installation von Beispieldaten ausgew\u00e4hlt haben, sollte nun eine vollst\u00e4ndig mit Inhalten gef\u00fcllte Startseite Ihres Storefronts angezeigt werden. Ihre lokale Website sollte mit Ihrer gehosteten Vorschauumgebung identisch sein.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"980\" height=\"454\" src=\"https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2026\/08\/image-3_thum-980x454.png\" alt=\"\" class=\"wp-image-17903\" srcset=\"https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2026\/08\/image-3_thum-980x454.png 980w, https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2026\/08\/image-3_thum-300x139.png 300w, https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2026\/08\/image-3_thum-768x356.png 768w, https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2026\/08\/image-3_thum-1000x463.png 1000w, https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2026\/08\/image-3_thum-800x371.png 800w, https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2026\/08\/image-3_thum.png 1366w\" sizes=\"auto, (max-width: 980px) 100vw, 980px\" \/><\/figure>\n\n\n\n<p>Bitte kontaktieren Sie uns unter <strong>wargis@bay20.com \/ manish@bay20.com<\/strong> oder rufen Sie uns unter <strong>+91-8800519180 \/ +91-9582784309<\/strong> an, wenn Sie Unterst\u00fctzung im Zusammenhang mit Bigcommerce ben\u00f6tigen. Sie k\u00f6nnen auch die <strong><a href=\"https:\/\/www.bay20.com\/de\/bigcommerce-entwicklungsunternehmen\/\" target=\"_blank\" rel=\"noopener\" title=\"\">Bigcommerce-Entwicklungsseite<\/a><\/strong> besuchen, um sich \u00fcber unsere Dienstleistungen zu informieren.<\/p>\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Sie k\u00f6nnen einen neuen Catalyst-Storefront-Kanal im Bereich \u201eKan\u00e4le\u201c des Shop-Kontrollpanels erstellen, genau wie andere Kanaltypen. Dieser als \u201eOne-Click Catalyst\u201c bezeichnete Vorgang umfasst mehr als nur die Erstellung eines Kanals; er beinhaltet auch die Bereitstellung einer gehosteten Vorschau der Storefront und die Einrichtung einer entsprechenden Website im visuellen Editor von Makeswift. Dieser codefreie Einstieg erm\u00f6glicht es [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":17899,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[13,170,31,86],"tags":[],"class_list":["post-17898","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-bigcommerce","category-catalyst","category-ecommerce","category-pwa"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.bay20.com\/de\/wp-json\/wp\/v2\/posts\/17898","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=17898"}],"version-history":[{"count":3,"href":"https:\/\/www.bay20.com\/de\/wp-json\/wp\/v2\/posts\/17898\/revisions"}],"predecessor-version":[{"id":18027,"href":"https:\/\/www.bay20.com\/de\/wp-json\/wp\/v2\/posts\/17898\/revisions\/18027"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.bay20.com\/de\/wp-json\/wp\/v2\/media\/17899"}],"wp:attachment":[{"href":"https:\/\/www.bay20.com\/de\/wp-json\/wp\/v2\/media?parent=17898"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.bay20.com\/de\/wp-json\/wp\/v2\/categories?post=17898"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.bay20.com\/de\/wp-json\/wp\/v2\/tags?post=17898"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}