{"id":346,"date":"2025-09-30T14:58:41","date_gmt":"2025-09-30T14:58:41","guid":{"rendered":"https:\/\/help.cloudwharf.com\/?post_type=docs&p=346"},"modified":"2025-10-21T12:46:32","modified_gmt":"2025-10-21T12:46:32","password":"","slug":"konfigurieren-der-ui-komponenten","status":"publish","type":"docs","link":"https:\/\/help.cloudwharf.com\/de\/docs\/konfigurieren-der-ui-komponenten\/","title":{"rendered":"Konfigurieren der UI-Komponenten"},"content":{"rendered":"\n

In diesem Schritt werden wir einige UI-Komponenten der Applikation f\u00fcr das Angebot-Objekt konfigurieren: Wir erstellen in den Details des Angebotobjekts den Header, den Hauptteil (wo die Produkte aufgef\u00fchrt werden) und den Footer eures Angebots. <\/p>\n\n\n\n

Hinweis:<\/em> Die Komponenten sind f\u00fcr die Verwendung auf mehreren Objekten angepasst. Der Produkt-Editor kann f\u00fcr Angebote, Opportunities und Auftrag verwendet werden. Der Vorlagen-Editor kann f\u00fcr Angebote und Auftr\u00e4ge verwendet werden.<\/p>\n\n\n\n

Dazu \u00f6ffnen wir ein Angebot in Salesforce und in ihm die Registerkarte \u201cDetails\u201d, sodass wir uns auf dieser Seite befinden (gegebenenfalls m\u00fcsst ihr dazu ein neues Angebot erstellen): <\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n
    \n
  1. Dann gehen wir oben auf das kleine Zahnrad und w\u00e4hlen diesmal nicht<\/em> \u201cSetup\u201d aus, sondern \u201cSeite bearbeiten\u201d<\/li>\n<\/ol>\n\n\n\n
    \"\"<\/figure>\n\n\n\n
      \n
    1. W\u00e4hlt hier zun\u00e4chst wieder die \u201cDetails<\/strong>\u201d Registerkarte aus<\/li>\n\n\n\n
    2. Hier scrollen wir dann links in der Sidebar nach unten. Dort sehen wir die benutzerdefinierten Komponenten. <\/li>\n\n\n\n
    3. Zieht die Komponente \u201csevDesk Text Template Editor<\/strong>\u201d (lasst euch nicht von der Fehlermeldung beirren) in den Details-Bereich des Angebots<\/li>\n\n\n\n
    4. Jetzt werden in der rechten Sidebar z.B. \u201csevDesk Object Name<\/strong>\u201d und \u201cType<\/strong>\u201d<\/li>\n\n\n\n
    5. Wir w\u00e4hlen jetzt das passende Objekt unter \u201csevDesk Object Name<\/strong>\u201d aus (in unserem Fall \u201cAngebot\u201d also \u201cQuote\u201d)<\/li>\n\n\n\n
    6. Danach w\u00e4hlen wir \u201cHeader<\/strong>\u201d unter \u201cType\u201d, weil es ein Header-Text wird<\/li>\n\n\n\n
    7. Jetzt ziehen wir die zweite Komponente aus der linken Sidebar (den \u201csevDesk Product Editor<\/strong>\u201d) <\/li>\n\n\n\n
    8. Und dann noch die dritte Komponente (wieder ein \u201csevDesk Text Template Editor<\/strong>\u201d)<\/li>\n\n\n\n
    9. Wir w\u00e4hlen dann wieder den passenden Objektnamen unter \u201csevDesk Object Name<\/strong>\u201d aus (wieder \u201cAngebot\u201d also \u201cQuote\u201d)<\/li>\n\n\n\n
    10. Und als Typ w\u00e4hlen wir diesmal „Footer<\/strong>“ aus<\/li>\n\n\n\n
    11. Dann klicken wir auf \u201cSpeichern<\/strong>\u201d<\/li>\n\n\n\n
    12. Dann auf \u201cAls Organisationsstandard zuweisen<\/strong>\u201d<\/li>\n\n\n\n
    13. Wir w\u00e4hlen \u201cDesktop und Telefon\u201d aus<\/li>\n\n\n\n
    14. Klicken auf \u201cWeiter\u201d<\/li>\n\n\n\n
    15. Dann auf \u201cSpeichern\u201d <\/li>\n<\/ol>\n\n\n\n

      Jetzt nur noch die Seite neu laden. Diesen Prozess jetzt f\u00fcr alle Objekte wiederholen, bei denen ihr in der Lage sein wollt, Header, Produktpositionen und Fu\u00dftext hinzuzuf\u00fcgen. <\/p>\n\n\n\n

      Jetzt sehen wir uns an, was die neu gewonnenen UI-Komponenten k\u00f6nnen:\u00a0<\/p>\n\n\n\n

      Der Vorlageneditor (sevDesk Text Template Editor)<\/strong><\/p>\n\n\n\n

      Diese Komponente erm\u00f6glicht es euch, die Kopf- und Fu\u00dfzeilentexte f\u00fcr Ihre Finanzdokumente effizient zu verwalten. Sie haben die M\u00f6glichkeit, den Text manuell einzugeben, eine vorhandene Textvorlage auszuw\u00e4hlen, die angewendet werden soll, oder Sie k\u00f6nnen ganz einfach eine neue Vorlage erstellen:<\/p>\n\n\n\n

      \"\"<\/figure>\n\n\n\n

      Um eine neue Textvorlage zu erstellen, klicken Sie auf die Option „Neue Textvorlage“ und danach ist alles intuitiv. <\/p>\n\n\n\n

      Sie k\u00f6nnen auch alle Ihre Vorlagen verwalten, indem Sie auf die Option „Textvorlagen verwalten“ klicken. Sie werden dann zur Listenansicht der Textvorlagen weitergeleitet, wo Sie die entsprechenden \u00c4nderungen vornehmen k\u00f6nnen.<\/p>\n\n\n\n

      Um die gew\u00fcnschte Textvorlage zu verwenden, w\u00e4hlen Sie sie in der Dropdown-Liste aus. Die Vorlage wird angewendet, und Sie k\u00f6nnen die \u00c4nderungen speichern.<\/p>\n\n\n\n

      Der Produkteditor (sevDesk Product Editor)<\/strong>\u00a0<\/p>\n\n\n\n

      Mit Hilfe dieser Komponente k\u00f6nnt ihr mit wenigen Klicks die Produktpositionen hinzuf\u00fcgen und die notwendigen \u00c4nderungen vornehmen. Verschaffen wir uns einen \u00dcberblick \u00fcber die Funktionen der Komponente.<\/p>\n\n\n\n

      Mit den Funktionen „Position hinzuf\u00fcgen“ und \u201cMehrere Positionen hinzuf\u00fcgen“ k\u00f6nnt ihr, wie der Name schon sagt eins oder mehrere eurer Produkt bspw. zu einem Angebot hinzuf\u00fcgen. Wenn ihr die \u201cMehrere Positionen hinzuf\u00fcgen w\u00e4hlt\u201d wird ein Fenster aufgerufen, in dem ihr nach den entsprechenden Produkten suchen k\u00f6nnt, die ihr hinzuf\u00fcgen m\u00f6chtet: <\/p>\n\n\n\n

      \"\"<\/figure>\n\n\n\n

      Nach dem Hinzuf\u00fcgen der Position werden die folgenden Feldwerte automatisch mit den entsprechenden Produktdaten vordefiniert:\u00a0<\/p>\n\n\n\n

        \n
      • Standardeinheit (Unit Type)<\/em> – der vordefinierte Wert stammt aus dem Feld Standardeinheit (cwharf_sevdesk__Unit_Type__c<\/strong>) auf dem Produktobjekt<\/li>\n\n\n\n
      • Listenpreis<\/em> – der vordefinierte Wert stammt aus dem entsprechenden Preisbucheintrag des Produkts. Das Feld ist Listenpreis (UnitPrice<\/strong>)<\/li>\n\n\n\n
      • Umsatzsteuer (%)<\/em> – der vordefinierte Wert stammt aus dem entsprechenden Preisbucheintrag des Produkts. Feld ist Umsatzsteuer (cwharf_sevdesk__Sales_Tax__c<\/strong>)<\/li>\n\n\n\n
      • Produktbeschreibung (Description)<\/em> – der vordefinierte Wert stammt aus dem Feld Produktbeschreibung (Description<\/strong>) des Produktobjekts<\/li>\n<\/ul>\n\n\n\n

        Ihr k\u00f6nnt dementsprechend euer Produkt mit den passenden Werten konfigurieren und dann wird euch die Komponente viel Zeit sparen, weil ihr sie nicht immer wieder neu eingeben m\u00fcsst. 

        Die Komponente erm\u00f6glicht es euch au\u00dferdem, globale Rabatte\/Aufschl\u00e4ge hinzuzuf\u00fcgen. Die entsprechende Funktion ist „Rabatt\/Aufschlag hinzuf\u00fcgen“:<\/p>\n\n\n\n

        \"\"<\/figure>\n\n\n\n

        Wenn ihr die Funktion anklickt, \u00f6ffnet sich ein Fenster, in dem ihr den entsprechenden Rabatt\/Aufschlag hinzuf\u00fcgen k\u00f6nnt:<\/p>\n\n\n\n

        \"\"<\/figure>\n\n\n\n

        Au\u00dferdem k\u00f6nnt ihr alle Positionen erweitern. Das kann n\u00fctzlich sein, wenn ihr alle Positionen auf einmal sehen wollt, um sicherzustellen, dass sie korrekt sind. Die entsprechende Funktion lautet „Alle Positionen aufklappen“. Um den Detailstatus der Positionen zu schlie\u00dfen, klicken Sie auf die Funktion „Alle Positionen zuklappen“:<\/p>\n\n\n\n

        \"\"<\/figure>\n\n\n\n

        So sieht das dann danach aus: <\/p>\n\n\n\n

        \"\"<\/figure>\n\n\n\n

        Eine weitere wichtige Funktion der Komponente ist das Sortieren der Positionen<\/strong>. Ihr k\u00f6nnt die Position einfach an die Position ziehen, an der ihr sie haben wollt. <\/p>\n\n\n\n

        Au\u00dferdem seht ihr am unteren Rand auch immer noch die Gesamtbetr\u00e4ge, die beim Bearbeiten der Positionen dynamisch neu berechnet werden. Auf diese Weise k\u00f6nnen ihr die Gesamtbetr\u00e4ge schneller und flexibler verfolgen, ohne zwischen den Seiten wechseln zu m\u00fcssen:<\/p>\n\n\n\n

        \"\"<\/figure>\n\n\n\n

        Bearbeiten k\u00f6nnt ihr die Produktmengen, Rabatte, etc. immer \u00fcber den kleinen Stift oben rechts an dem Element. Vergesst danach nur nicht auf \u201cSpeichern<\/strong>\u201d zu klicken. <\/p>\n","protected":false},"excerpt":{"rendered":"

        In diesem Schritt werden wir einige UI-Komponenten der Applikation f\u00fcr das Angebot-Objekt konfigurieren: Wir erstellen in den Details des Angebotobjekts den Header, den Hauptteil (wo die Produkte aufgef\u00fchrt werden) und den Footer eures Angebots.  Hinweis: Die Komponenten sind f\u00fcr die Verwendung auf mehreren Objekten angepasst. Der Produkt-Editor kann f\u00fcr Angebote, Opportunities und Auftrag verwendet werden. […]<\/p>\n","protected":false},"author":5,"featured_media":0,"comment_status":"open","ping_status":"closed","template":"","meta":{"footnotes":""},"doc_category":[28],"doc_tag":[],"knowledge_base":[23],"class_list":["post-346","docs","type-docs","status-publish","hentry","doc_category-einrichten-und-konfigurieren","knowledge_base-sevdesk-fur-salesforce"],"year_month":"2026-04","word_count":866,"total_views":0,"reactions":{"happy":0,"normal":0,"sad":0},"author_info":{"name":"Alexander Melnychenko","author_nicename":"alex","author_url":"https:\/\/help.cloudwharf.com\/de\/author\/alex\/"},"doc_category_info":[{"term_name":"Einrichten und Konfigurieren","term_url":"https:\/\/help.cloudwharf.com\/de\/docs\/finblick\/einrichten-und-konfigurieren\/"}],"doc_tag_info":[],"knowledge_base_info":[{"term_name":"sevdesk f\u00fcr Salesforce","term_url":"https:\/\/help.cloudwharf.com\/de\/docs\/sevdesk-fur-salesforce\/","term_slug":"sevdesk-fur-salesforce"}],"knowledge_base_slug":["sevdesk-fur-salesforce"],"_links":{"self":[{"href":"https:\/\/help.cloudwharf.com\/de\/wp-json\/wp\/v2\/docs\/346","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/help.cloudwharf.com\/de\/wp-json\/wp\/v2\/docs"}],"about":[{"href":"https:\/\/help.cloudwharf.com\/de\/wp-json\/wp\/v2\/types\/docs"}],"author":[{"embeddable":true,"href":"https:\/\/help.cloudwharf.com\/de\/wp-json\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/help.cloudwharf.com\/de\/wp-json\/wp\/v2\/comments?post=346"}],"version-history":[{"count":2,"href":"https:\/\/help.cloudwharf.com\/de\/wp-json\/wp\/v2\/docs\/346\/revisions"}],"predecessor-version":[{"id":1146,"href":"https:\/\/help.cloudwharf.com\/de\/wp-json\/wp\/v2\/docs\/346\/revisions\/1146"}],"wp:attachment":[{"href":"https:\/\/help.cloudwharf.com\/de\/wp-json\/wp\/v2\/media?parent=346"}],"wp:term":[{"taxonomy":"doc_category","embeddable":true,"href":"https:\/\/help.cloudwharf.com\/de\/wp-json\/wp\/v2\/doc_category?post=346"},{"taxonomy":"doc_tag","embeddable":true,"href":"https:\/\/help.cloudwharf.com\/de\/wp-json\/wp\/v2\/doc_tag?post=346"},{"taxonomy":"knowledge_base","embeddable":true,"href":"https:\/\/help.cloudwharf.com\/de\/wp-json\/wp\/v2\/knowledge_base?post=346"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}