#1 | Wie binde ich Lokal Schriften ein?

Shopware 5 Programmierung
1

Hallo liebe community ,

ich bin Sina und 21 Jahre alt. Ich beschäftige mich erst seit heute mit Shopware und soweit komme ich klar, jedoch habe ich drei Punkte an dem ich auf Euer Fachwissen angewiesen bin.

Da es sich um drei unterschiedliche Themen handelt, bitte ich um Verständnis das ich hier drei Themen aufmache. Um eine Lösung für die nächsten nicht zu verfälschen.

Thema #1 – Wie binde ich Schriften in Shopware richtig ein?

Also, ich möchte gerne zwei Schriften so einbinden das diese ebenfalls im Auswahlmenü bereit stehen wie in dem Beispiel (Standard).

Hinweis : Lokal (Hochladen) und nicht über Google Fonts laden, die Dateien der Schriften habe ich.

 

Lieben Gruß Eure Sina

2

Moin @SinaHagen‍,

da hast du dir aber ein paar ordentliche Aufgaben vorgenommen, zum Einstieg sicherlich ein bisschen zuviel.

Zunächst einmal handelt es sich bei dem von dir genannten Ausschnitt um ein Dropdown, das so nur in unserem Premium Plugin „Digital Publishing“ vorkommt.
Die dort hinterlegten Daten sind  statisch  im Code hinterlegt. Dazu suchst du am Besten mal in dem Plugin nach der Datei Resources/views/backend/swag_digital_publishing/view/editor/fields/text_font_select_field.js.

Diese beinhaltet eine Methode createFontStore, welche du überschreiben müsstest über ein eigenes Plugin.
Wie das geht? Das ist nicht in zwei Worten zusammengefasst. Hier findest du ein paar Beispiele, wie man das ExtJS Backend erweitert.
Das ist aber ein echt hartes Unterfangen, wenn man ganz neu ist und gänzlich ohne Programmierer-Erfahrung.

Anschließend musst du nur noch über dein eigenes Theme dafür Sorge tragen, dass die hinterlegte Schriftart mit diesem Namen auch auf deinem Server verfügbar ist.

Ich möchte jedoch ehrlich sein:
Ohne Programmier-Kenntnisse wirst du da leider sehr schnell an deine Grenzen stoßen. Dafür, dass du neu bist, hast du dir direkt ein Thema ausgesucht, das einen harten Einstieg mit sich bringt: Anpassungen an ExtJs.
Wenn du das Ganze ernst meinst, würde ich dir also stark empfehlen, dich erstmal hier durchzuarbeiten.
Falls du eher der „Video-Lerner“ bist, findest du hier unsere Video-Reihe zum Thema „Plugin-Entwicklung“.

Vielleicht hilft dir das ein wenig weiter.
Wenn du konkrete Fragen hast, bspw. wie eine gezielte Zeile Code zu verstehen ist, findest du hier aber häufig einen Schubs in die richtige Richtung.

Gruß,
Patrick  Shopware

1 „Gefällt mir“
3

Hallo [@Patrick Stahl](http://forum.shopware.com/profile/1869/Patrick Stahl “Patrick Stahl”)‍,

vielen Dank für den Ausführlichen Kommentar. Sicher bin ich mir bewusst das es nicht leicht ist oder wird, aber nur wer das große Ziel hat, der überwindet auch kleinere Hindernisse

 

Ich werde mich in den von Dir benannten Links mal einarbeiten, aber schade das Shopware hier nicht das einfacher gelöst hat. 

4

Hallo [@Patrick Stahl](http://forum.shopware.com/profile/1869/Patrick Stahl „Patrick Stahl“)‍,

ich habe mal den Code einfach mal im Plugin erweitert. Jedoch wird es doch bestimmt beim nächsten Update überschrieben oder? gibt es hier eine einfache möglichkeit das Updatesicher zu machen? 
Nach der erweiterung Zeigt er mir dies auch an und Greift auch, also wenn es jetzt so bleibt wäre perfekt.
Code:

/**
     * @returns { Ext.data.Store }
     */
    createFontStore: function () {
        var me = this;

        me.store = Ext.create('Ext.data.Store', {
            fields: ['font', 'label'],
            data: [
                                
                { 'font': 'Satisfy', 'label': 'Satisfy'}, 
                { 'font': 'Lato', 'label': 'Lato'},
				{ 'font': 'Arial', 'label': 'Arial'},
                { 'font': 'Arial Black', 'label': 'Arial Black'},
                { 'font': 'Arial Narrow', 'label': 'Arial Narrow'},
                { 'font': 'Open Sans', 'label': 'Open Sans'},
                { 'font': 'Trebuchet MS', 'label': 'Trebuchet MS'},
                { 'font': 'Verdana', 'label': 'Verdana'},
                { 'font': 'Tahoma', 'label': 'Tahoma'},
                { 'font': 'Georgia', 'label': 'Georgia'},
                { 'font': 'Palatino', 'label': 'Palatino'},
                { 'font': 'Garamond', 'label': 'Garamond'},
                { 'font': 'Century Gothic', 'label': 'Century Gothic'},
                { 'font': 'Lucida Bright', 'label': 'Lucida Bright'},
                { 'font': 'Book Antiqua', 'label': 'Book Antiqua'},
                { 'font': 'Times New Roman', 'label': 'Times New Roman'},
                { 'font': 'Lucida Sans Typewriter', 'label': 'Lucida Sans Typewriter'},
                { 'font': 'Courier New', 'label': 'Courier New'}
            ]
        });
    }
});
// {/block}

 

5

Wie man es updatesicher macht? Das ist doch der verlinkt. Natürlich ist da keine spezielle Lösung für deinen Fall, da solltest du dich schon mal etwas einarbeiten. Hier wird sicher für so eine Aufgabe keine komplette Lösung gepostet. Also musst du dich wohl schon etwas damit beschäftigen oder jemanden beauftragen.

6

Moin @SinaHagen‍,

wir können leider im Standard-Umfang nicht jedes erdenklich mögliche Feature berücksichtigen. :-/

Das, was du jetzt über eine direkte Anpassung am Plugin verändert hast, musst du nun über ein Plugin lösen.
Dazu musst du, wie bereits erwähnt, dieses Beispiel auf deinen Anwendungsfall ummünzen.

Also in kurz:
Einen Subscriber erstellen, dich per Event an den jeweiligen Backend Controller vom Digital Publishing Modul anhängen, deinen eigenen ExtJS Code laden und per “Ext.define(…, { override:’…’ });” das bestehende Digital Publishing Modul erweitern.

Das ist leider nicht so einfach beschrieben, zumindest nicht in kurzer Zeit. Das Beispiel dürfte dir da aber eine gute Erklärung bieten, wie das zu funktionieren hat.  Thumb-Up

Gruß,
Patrick  Shopware

1 „Gefällt mir“