Anleitungen

Bearbeite deine Website visuell mit Canvas

Der Chat eignet sich großartig für große Änderungen. Aber manchmal möchtest du einfach auf etwas auf der Seite zeigen und es direkt ändern. Genau dafür gibt es Canvas. In diesem Tutorial bearbeite ich die Website eines Restaurants, Hinoki Udon, indem ich direkt auf die Seiten klicke.

Von Oberon Lai. Ich entwickle ShipPress (Codotx, LLC), das hier ist also unser eigenes Produkt.

Video abspielen

1. Canvas öffnen

   Klicke über der Vorschau auf Alle Seiten. Dadurch öffnet sich Canvas: alle Seiten deiner Website, nebeneinander.

   Beim ersten Mal erklärt ein kurzer Tipp, wie es funktioniert: Klicke auf eine Überschrift, einen Text oder ein Bild, um Inhalte zu ändern, oder tippe in das Feld darunter ein, was geändert werden soll. Klicke auf Verstanden, um den Hinweis zu schließen.

2. Navigieren: Zoomen, Einpassen und Springen zu…

   Nutze − und +, um heraus- und hineinzuzoomen. Einpassen zeigt die gesamte Website auf einmal: Seiten ganz oben, darunter Beiträge und Kategorien.

   Um direkt zu einer Seite zu gelangen, öffne Springen zu…. Dort werden alle Seiten, Beiträge und Kategorien aufgelistet. Wähle eine aus und Canvas zoomt direkt dorthin.

3. Texte selbst ändern

   Klicke auf eine Überschrift oder einen Textabschnitt. Ein kleines Bedienfeld mit dem Text öffnet sich. Tippe den neuen Text ein und klicke auf Speichern.

   Im Video ändere ich „Von Hand gemacht, jeden Morgen“ zu Handgemachte Nudeln, jeden einzelnen Morgen. Die Überschrift ändert sich sofort. Da du den Text selbst eingegeben hast, werden keine AI-Tokens verbraucht. Anders überlegt? Klicke in der Bestätigungsmeldung auf Rückgängig.

4. Die KI zu einem bestimmten Teil befragen

   Für alles, was über neuen Text hinausgeht, frage die KI gezielt zu genau dem Teil, den du angeklickt hast. Klicke auf ein Bild oder einen Abschnitt, und das Feld darunter zeigt deine Auswahl an, zum Beispiel Bild. Tippe dann ein, was geändert werden soll, und drücke die Eingabetaste:

   Gib diesem Bild abgerundete Ecken und einen weichen Schatten.

   Die KI ändert nur diesen Teil. Ihre Antwort im Chat beschreibt, was geändert wurde, mit Buttons, um die Änderung rückgängig zu machen oder weitere Anpassungen auszuprobieren.

5. Blöcke reparieren, die der Editor markiert

   Canvas überprüft jeden Block auf jeder Seite. Wenn der WordPress-Editor einen Block als fehlerhaft beanstanden würde, erscheint neben dem Seitennamen ein roter Badge Zu reparierende Blöcke.

   Klicke auf den Badge. Canvas führt dich direkt zu diesem Block und umrandet ihn rot. Klicke auf Die KI bitten, es zu beheben. Die KI repariert den Block, ohne sein Aussehen zu verändern, und der Badge verschwindet.

6. Chat und Canvas arbeiten zusammen

   Du kannst den Chat auf der linken Seite weiternutzen, während Canvas geöffnet ist. Im Video tippe ich:

   Füge auf der Kontaktseite unter der Einleitung eine kurze Zeile hinzu: Englische Speisekarten sind verfügbar.

   Die neue Zeile erscheint in Canvas, sobald die KI fertig ist.

7. Rückgängig machen in Canvas

   Oben rechts in Canvas nimmt Rückgängig die letzte Änderung zurück. Um noch weiter zurückzugehen, nutze die Wiederherstellungspunkte im Verlauf.

8. Tipps

   • Tippfehler und neue Formulierungen: Klicke auf den Text und tippe los. Es geht sofort und verbraucht keine AI-Tokens.
   • Optik und Layout: Klicke zuerst auf das Bild oder den Abschnitt und sage der KI dann, was geändert werden soll. Sie weiß genau, welcher Teil gemeint ist.
   • Große Websites: Nutze Springen zu… und Einpassen statt zu scrollen.
   • Roter Badge? Klicke auf Zu reparierende Blöcke und dann auf Die KI bitten, es zu beheben.

9. Nächste Schritte

   Für größere Änderungen lies Bearbeite deine Website per Chat. Jede AI-Änderung lässt sich rückgängig machen: Siehe Jede AI-Änderung mit Wiederherstellungspunkten rückgängig machen. Wenn die Website fertig aussieht: Veröffentliche deine Website kostenlos mit einer ShipPress-Adresse.