Anleitung Theme duplizieren um Dateien zu bearbeiten im Cloudshop

Thema wurde von Anonymous, 25. Januar 2023 erstellt.

  1. Anonymous

    Anonymous Erfahrener Benutzer

    Registriert seit:
    5. Mai 2022
    Beiträge:
    1.529
    Danke erhalten:
    568
    Danke vergeben:
    222
    #1 Anonymous, 25. Januar 2023
    Zuletzt bearbeitet: 17. April 2023
    Es gibt bestimmt ein paar Cloudshop-Besitzer die auch die eine oder andere Bearbeitung in den Dateien machen möchten.

    Da ich selbst null Ahnung davon habe, werde ich das hier mal Schritt für Schritt durchspielen und mitschreiben.

    Moritz hatte mir mal eine tolle Anleitung geschrieben. Mit genau dieser Anleitung hat es funktioniert. Aber ich verstehe nicht, woher ich weiß wie die Datei heißt und wie die Ordner heißen müssen, die ich einfügen muss.
    Helft ihr mir bei diesen Fragen?

    Anleitung von Moritz:
    Du gehst folgendermaßen vor:
    1. Im StyleEdit gehst du in die "Meine Themes"-Übersicht. Dort wählst du beim aktiven Theme "Duplizieren" aus.
    2. Beim duplizierten Theme wählst du "Downloaden"
    3. Du entpackst die zip-Datei
    4. Du fügst im Ordner, in dem auch die theme.json liegt, einen Ordner "html" hinzu, der wiederum einen Unterordner "custom" hat. Darin erstellst du eine neue Datei namens "product_info_additional_fields.html" mit dem Inhalt
    HTML:
    {block name="product_info_additional_fields_list_item"}
    <div class="additional-fields-item">
    <strong>{$item.title}</strong>
    <span>{$item.value}</span>
    </div>
    {/block}
    dieser Name und HTML Code sind natürlich nur für dieses Beispiel. Ihr müsst den Namen der Datei nehmen und den Code den ihr ändern wollt.

    - Woher weiß ich wie die Datei heißt? product_info_additional_fields.html
    - Woher weiß ich was für Ordner ich hinzufügen muss? "einen Ordner "html" hinzu, der wiederum einen Unterordner "custom""
    - woher weiß ich wie der Code aussehen muss? Beginnt und endet er immer mit {block name .... {/block}?
    (das dazwischen finde ich mit rechter Maustaste und "durchsuchen")


    5. Nun erstellst du wieder ein ZIP-Paket aus den entpackten Dateien.
    6. Im StyleEdit wählst du in der Meine Themes Übersicht "hochladen". Es kommt eine Meldung, ob das Theme überschrieben werden soll, was du bejahst.
    7. Aktiviere das Theme
     
  2. barbara

    barbara G-WARD 2014-2020

    Registriert seit:
    14. August 2011
    Beiträge:
    35.352
    Danke erhalten:
    11.198
    Danke vergeben:
    1.601
    Wenn du Dir einmal das originale Theme herunterlädst, dann findest Du dort auch einen Ordner "html" mit dem Unterordner "system" und darin (fast) allen html-Dateien.

    Damit Deine Dateien von den originalen getrennt sind (und bleiben) kommen diese nicht in "system", sondern in "custom"

    Um etwas zu ändern, musst Du erstmal die originale Datei finden.
    Jede Datei enthallt Smarty-Blöcke, in denen der html-Code liegt.
    Über die Blöcke kannst Du änderungen vornehmen, ohne die ganze Datei kopieren zu müssen.

    Eine Anleitung dazu findest Du hier:
    (Link nur für registrierte Nutzer sichtbar.)

    Willst Du in einer (oder mehrerer) Datei nur etwas ändern (etwas vor oder nach einem Block einfügen), kannst Du der Datei einen beliebigen Namen geben.
    Beispiel:
    ich habe an diversen Stellen einen "Zurück-Button" eingefügt.
    Im Verzeichnis ...html/custom/ kann ich die Änderungen thematisch in eine Datei legen.
    Die Datei dazu heißt bei mir "button_back.html"
    So weiß ich was in der Datei ist.
    Damit ich weiß aus welcher originalen Datei der Block kommt, schreibe ich das über den Block.
    Beispiel:
    HTML:
    {*<!--cart.html-->*}       
        {block name="cart_title" prepend}
        <div class="row">
        <div class="col-xs-6 col-sm-4 col-md-3">
            <a class="btn btn-back btn-default btn-block" href="javascript:history.back(1)" title="{$button.back}">
                {$button.back}
            </a>
        </div>
    </div>
        </br>
        {/block}
    Über die Blocknamen weiß der Shop wo die Änderung hin soll.

    Ändere ich nur eine Datei, nutze ich den originalen Dateinamen und setze ein "meine" davor.
    so wird aus
    "box_best_sellers.html" schlicht "meine_box_best_sellers.html"
    ich könnte sie aber auch "bild_box_best_sellers.html" nennen, da es bei der Änderung um Bilder ging.
    Hier schreibe ich auch nur den Block / die Blöcke rein, die ich in dieser Datei ändern oder ergänzen möchte.

    Wichtig dabei ist: der Datei-Name darf nicht = einer originalen html-Datei sein.

    Will ich die Seite komplett ändern, lege ich sie mit dem originalen Namen an.
    Aber auch hier sollten die Blöcke der originalen Datei mitverwendet werden, damit Module, die sich an einen Block hängen, auch angezeigt werden.
    Dazu gehören auch Module, die im Shop vorhanden sind, nicht nur welche von Drittanbietern.

    (ich hoffe ich habe jetzt nichts falsches geschrieben :D)

    Eine Anleitung von Gambio zum Thema findest Du hier:
    (Link nur für registrierte Nutzer sichtbar.)
     
  3. Anonymous

    Anonymous Erfahrener Benutzer

    Registriert seit:
    5. Mai 2022
    Beiträge:
    1.529
    Danke erhalten:
    568
    Danke vergeben:
    222
    vielen lieben Dank, Barbara. :)
     
  4. Timo (Gambio)

    Timo (Gambio) Administrator

    Registriert seit:
    23. Juni 2011
    Beiträge:
    1.688
    Danke erhalten:
    651
    Danke vergeben:
    46
    Hallo Barbara,

    deine Methoden funktionieren zwar, sind aber nicht zu empfehlen.

    Wenn man Dateien komplett ersetzen will, legt man diese im /html/system/ Ordner ab. Dann wird die Datei vollständig ausgetauscht. Hat man dort eine leere Datei, dann wird auch nichts im Shop angezeigt. Die Blöcke in den Dateien spielen hierbei keine Rolle.

    Möchte man nur Teile einer HTML Datei austauschen, dann nutzt man den /html/custom/ Ordner. Hierbei gibt es jedoch 2 Unterscheidungen:

    1. Originaler Dateiname:
    Wenn die Datei den originalen Namen hat, kann man nur Blöcke aus dieser Originaldatei austauschen. Das ist die empfohlene Vorgehensweise.

    2. eigener Dateiname (magische Datei):
    Wenn man einen eigenen Dateinamen nutzt, dann hat man die Möglichkeit in diesen Dateien alle Blöcke aus allen HTML Dateien des Themes zu manipulieren. Das hat Vor- und auch Nachteile. Einerseits kann man so Änderungen thematisch zusammenfassen. Aber man verliert auch den Bezug zur Originaldatei. Man muss also immer in die Datei reinschauen, um zu wissen, zu welchen Originaldateien der Inhalt gehört. Auch technisch ist das nicht klug. Damit die globale Ersetzung funktioniert, werden diese Dateien in die Vererbungsketten ALLER HTML Dateien eingebunden. Das kostet Zeit und Performance.

    Ich versuche das mal zu erklären:
    Ruft man die Startseite auf, werden ca. 20-30 HTML Dateien gerendert. Jede Datei kann x beliebig viele "Child Dateien" haben:
    1. index.html (Original)
    potentiell 2. index.html (Child Theme)
    potentiell 3. index.html (GXModules Modul)
    usw.
    Am Ende werden die magischen Dateien angehangen:
    4. 1. magische Datei (z.B. button_back.html)
    5. 2. magische Datei (z.B. meine_box_best_sellers.html)
    6. 3. magische Datei (z.B. bild_box_best_sellers.html)

    Diese magischen Dateien werden an alle HTML Dateien gehangen. Also an index.html, cart.html, an alle Produktdateien, Checkout etc. Diese Vererbungsketten werden also unnötig groß, weshalb wir von der intensiven Nutzung dieser Dateien abraten. Wir empfehlen (und so machen wir das auch) immer die Originaldateinamen zu nutzen, damit die eigene Datei auch nur in die Vererbungskette der Originaldatei eingebunden wird.
     
  5. barbara

    barbara G-WARD 2014-2020

    Registriert seit:
    14. August 2011
    Beiträge:
    35.352
    Danke erhalten:
    11.198
    Danke vergeben:
    1.601
    Ah, ok.
    Am Anfang hieß es mal, dass man das Thematisch machen kann, deshalb habe ich das bei mir so gelöst....
    Aber wenn die Dateien mit eigenem Namen immer geladen werden, ist es natürlich unschön.
    Dann werde ich das bei mir noch mal ändern.

    Danke Timo.
     
  6. Timo (Gambio)

    Timo (Gambio) Administrator

    Registriert seit:
    23. Juni 2011
    Beiträge:
    1.688
    Danke erhalten:
    651
    Danke vergeben:
    46
    Das ist auch nicht falsch. Wir haben diese Technik auch genutzt (im alten Malibu Theme, als es noch ein Child von Honeygrid war). Du kannst das auch weiterhin so nutzen, aber es nicht verkehrt, die Nachteile zu kennen.
     
  7. Anonymous

    Anonymous Erfahrener Benutzer

    Registriert seit:
    5. Mai 2022
    Beiträge:
    1.529
    Danke erhalten:
    568
    Danke vergeben:
    222
    deutet dies auf eine php hin?

    upload_2023-1-26_14-34-18.png
     
  8. barbara

    barbara G-WARD 2014-2020

    Registriert seit:
    14. August 2011
    Beiträge:
    35.352
    Danke erhalten:
    11.198
    Danke vergeben:
    1.601
    Das ist eine Variable, die über eine PHP-Datei mit einem Wert gefüllt wird.
    In dem Fall der Name eines Versandmodules.
     
  9. Anonymous

    Anonymous Erfahrener Benutzer

    Registriert seit:
    12. April 2016
    Beiträge:
    125
    Danke erhalten:
    4
    Danke vergeben:
    46
    Liebe Barbara, ich bin immer wieder beindruckt, wie sehr du schon durch Gambio steigst. Konnte schon viel dadurch lernen. Ich bin auch ständig in der developer Doku am suchen, wo man mal alle variablen, die man nutzen kann findet, auch die dev-environment Datei im root mal abgelegt aber ganz hilft mir das nicht.
    Wie Michaela schon im ersten Post schreibt, woher weiß man wie der Code genau aussehen muss?
    Selbst in der aktuellen developer wiki ( https://developers.gambio.de/tutorials.html?v=4.5.1.1&p=anlegen-neuer-styling-inhalte ) hab ich das Gefühl, dass da wild mit alten und neuen Begriffen rumgeschmissen wird (bei Überschrift mit "Themes" wird in dem Baumansicht Bild in der Struktur von themes gesprochen, darunter ist aber wieder der Ordnerpfad mit templates.), weswegen man Stunden mit rumprobieren vergeudet und nachher doch nicht zum Ziel kommt.

    Gibt es sone Liste? Oder sehe ich in der Doku den Wald vor lauter Bäumen gerade nicht?
     
  10. Anonymous

    Anonymous Erfahrener Benutzer

    Registriert seit:
    5. Mai 2022
    Beiträge:
    1.529
    Danke erhalten:
    568
    Danke vergeben:
    222
    @Arthur_Dent schau mal hier. Das hatte Dirk mir damals geschrieben:

    (Link nur für registrierte Nutzer sichtbar.)
    Ab Post #33

     
  11. Anonymous

    Anonymous Erfahrener Benutzer

    Registriert seit:
    12. April 2016
    Beiträge:
    125
    Danke erhalten:
    4
    Danke vergeben:
    46
    #11 Anonymous, 14. Februar 2023
    Zuletzt bearbeitet: 14. Februar 2023
    @Klaiber Michaela Danke schonmal, das nutze ich ehrlich gesagt selbst schon in anderer Form. Da ich keinen Cloud shop habe, kann ich beim Webserver im PLESK Control Panel auch dort die Ordner mit Inhalt und Dateinamen durchsuchen. Allerdings hänge ich gerade an so einem Problemchen, bei dem mir das leider nicht weiterhilft, dazu muss ich wohl einen eigenen Post eröffnen.

    Greetz
     
  12. Anonymous

    Anonymous Erfahrener Benutzer

    Registriert seit:
    12. April 2016
    Beiträge:
    125
    Danke erhalten:
    4
    Danke vergeben:
    46
    #12 Anonymous, 14. Februar 2023
    Zuletzt bearbeitet: 14. Februar 2023
    @Devil

    habe nur erklärt, dass ich durch die Suche nach einer Lösung auf diesem Thread gelandet bin und auch im ersten Absatz erwähnt, dass ich dazu einen eigenen Beitrag eröffnen will (meinte mit Post eigentlich Beitrag) und es nur hier dazuschmeißen wollte, falls jemand beiläufig etwas dazu sagen kann. Ist nicht Kernthema hier.

    Hast recht, ich werds rausmachen, damits nicht unübersichtlich wird
     
  13. Anonymous

    Anonymous Erfahrener Benutzer

    Registriert seit:
    5. Mai 2022
    Beiträge:
    1.529
    Danke erhalten:
    568
    Danke vergeben:
    222
    Hier nochmal die genaue Anleitung ohne Zwischentext:

    1. Im StyleEdit gehst du in die "Meine Themes"-Übersicht. Dort wählst du beim aktiven Theme "Duplizieren" aus.
    ( Titel/ThemeID/Autor kannst du frei vergeben. Ist nur für dich. )
    2. Beim duplizierten Theme wählst du "Downloaden"
    3. Du entpackst die zip-Datei
    4. Du fügst im Ordner, in dem auch die theme.json liegt, einen Ordner "html" hinzu, der wiederum einen Unterordner "custom" hat.
    5. Du öffnest den Editor und fügst deinen HTML Code ein: Beispiel:
    {block name="product_info_additional_fields_list_item"}
    <div class="additional-fields-item">
    <strong>{$item.title}</strong>
    <span>{$item.value}</span>
    </div>
    {/block}
    6. Speichere die Datei in den vorhin angelegten "custom" Ordner:
    - Nenne sie so wie sie im Original heißt. In diesem Beispiel: "product_info_additional_fields.html"
    (Speichern unter, klicke zum Ordner "custom", gib den Dateinamen ein (mit .html am Ende), Dateityp: alle Dateien, speichern)

    7. Nun erstellst du wieder ein ZIP-Paket aus den entpackten Dateien.
    8. Im StyleEdit wählst du in der Meine Themes Übersicht "hochladen". Es kommt eine Meldung, ob das Theme überschrieben werden soll, was du bejahst.
    9. Aktiviere das Theme.
    Falls was nicht gehen sollte, aktivierst du einfach dein voriges Theme.