Hallo zusammen, ich bastel gerade etwas rum und wollte mittels diesem Tutorial custom Javascript einbinden https://developers.gambio.de/docs/3.15.3.0/jsdoc/ Die Test .js lautet combination_button.js und der Inhalt ist Code: tnd.widgets.module('combination_button', [], function(data) { return { init: function(done) { alert('Hello World'); done(); } }; console.log('combination_buttons.js geladen 1'); }); console.log('combination_buttons.js geladen 2'); Der Namespace ist definiert: Code: <div class="product-info product-info-default row" data-tnd-namespace="/themes/Thrownatur/javascripts/tnd"> Und das Widget wird auch aufgerufen: Code: <div id="tnd_properties" data-tnd-widget="combination_button"> Als Fehlermeldung kommt jedoch: Code: Page Namespaces: gambio,jse,tnd require.js:1963 GET https://testshop.thrownatur.de/themes/Thrownatur/javascripts/tnd/widgets/combination_button.js net::ERR_ABORTED 403 Sprich, es besteht keine Berechtigung die Datei aufzurufen. Was mache ich falsch? Danke und frohes Neues!
Du versuchst das direkt aus /themes aufzurufen, das geht nicht, das ist absichtlich blockiert. Du musst das aus dem Themecache referenzieren. Das ist dann public/theme/javascripts/....
Hi Wilkem, danke für die Antwort, das erklärt es. Nun bräuchte ich noch eine Info, wie ich verhindere, dass der Shop meinen Ordner und den Inhalt bei jedem Seitenaufruf aus dem public Ordner löscht
Du legst dein Javascript in themes/[MeinTheme] ab, das idealerweise ein Kind deines Basisthemes ist, zum Beispiel Honeygrid. Dann wird es bei jeder Cacheleerung nach public/theme kopiert. In public/theme werden die Themes in Reihenfolge ihrer Vererbung aufeinander gestapelt. In deiner Referenzierung benutzt du dann aber nicht einen Pfad auf themes/... sondern public/theme/.... weil dort nach Erzeugung die temporäre lebende Variante lebt.
Hmmm ich stehe wohl etwas auf dem Schlauch. Die Datei liegt in: /themes/Thrownatur/javascripts/tnd/widgets im Ordner /public/theme/javascripts ist aber lediglich der system Ordner. //Edit Ich habe die Datei gefunden, aber nicht in Public, sondern in /themes/Thrownatur_preview/javascripts/tnd/widgets
Die Ordner mit preview im Namen werden nicht live ausgespielt. Das sind Vorschauen die Styleedit erzeugt, und die benutzt werden, solange Styleedit zum editieren des Themes offen ist. Es muss in public/theme sein, spätestens nach einer Seitencacheleerung im Backend.
Das ist alles etwas komisch, wie in dem Beitrag https://www.gambio.de/forum/threads...l-dateien-werden-nicht-beruecksichtigt.42190/ schonmal geschrieben, werden keine Änderungen an den Dateien sichtbar, wenn ich nicht nebenbei den Styleeditor offen habe, ich muss da nix drin machen, es muss nur ein Tab damit offen sein. Sobald ich Styleedit öffne und den Cache lösche, wird aber mein Ordner aus dem public ordner gelöscht. Ich schicke Dir gleich mal einen Link zu einem Video, das erklärt es deutlich besser, als das ichs schreiben könnte.
Die JavaScripte müssen im Ordner /themes/myTheme/javascripts/custom/ liegen, nur dann werden die automatisch beim Leeren des Caches in den Ordner /public/theme/javascripts/custom/ kopiert. Dein NameSpace muss das dann auch aus dem /public/theme/javascripts/custom/ laden. Ein Widget muss dafür nicht erstellt werden, die Scripte werden automatisch eingebunden und ausgeführt. Du musst nur die ensprechenden Trigger schreiben wann dein Code was tun soll.
@Till (Gambio) Das hatte ich schon versucht, das Script wurde auch eingebunden, aber ich kann nichts triggern, da das Script wohl eingebunden wird, bevor der der Teil für die Eigenschaft-Kombinationen aufgerufen wird. Habs dann auch mal mit .on('click') probiert, ging aber auch nicht. Deswegen dachte ich mit, ich versuche es mal mit einem Modul, da der card_handler.js der die Kombinationsprüfung auf der Produkt-Seite macht, auch als Modul eingebunden wird.
Auch aus dem ordner '/themes/myTheme/javascripts/custom/' wird nichts nach public kopiert, müssen sie aber auch nicht, da die .js im custom ordner automatisch eingebunden werden. Dann brauchts auch kein NameSpace, oder bin ich jetzt voll neben der Spur? Laut euren tuts sollen in den custom ordner aber nur "Erweiterung vorhandener Javascripts".
Okay, vergessen wir das mal alles Ich glaube es ist besser, das ich euch erzähle was ich letztendlich haben möchte, evtl erledigt sich dann das eine oder andere. Zu dem Thema gibt es auch ein Ticket, ich dachte aber, dass dies Unabhängig voneinander ist. (ID: 100850239) Bei der Verwendung von Eigenschaften, gibt es im Product-Info-Detail Bereich ein Anzahl X Dropdowns. Ich finde dies jedoch zu umständlich, weshalb ich die Kombinationen als Buttons anzeigen lasse. Um jetzt aber nicht x Seiten umzubauen, habe ich ein kleines jQuery Scipt geschrieben, welches die Dropdowns auf die jeweiligen Werte einstellt, wenn man einen Button klickt. Beispiel: Für die Kombination [Gewicht 175g & Farbe Rot] habe ich einen Button erstellt, wenn man diesen Klickt, dann wird beim Dropdown [Gewicht] -> 175g ausgewählt und beim Dropdown [Farbe] -> Rot. Die Dropdowns selber habe ich unsichtbar gemacht, da diese ja für den Kunden nicht mehr sichtbar sein müssen. Zu sehen ist das hier: https://thrownatur-discgolf.de/de/atom-electron-firm.html Das Ganze hat auch alles funktioniert (habe aktuell noch V3.10 am laufen). Nun möchte ich aber die Version 3.15 mit Theme nutzen und da scheitere ich am Einbau. Ich habe eine .js Datei mit dem notwendigen Code erstellt, diese Datei wird auch eingebunden, jedoch funktioniert es nur bis zu den Zeitpunkt, bis das Div [<div class="product-info-details....>] refreshed wurde, danach geht es nicht mehr. Setze ich das JS Script in das DIV, dann funktioniert es, nur wäre es mir lieber, ich hätte das Script in einer separaten Datei. Wie bekomme ich das hin? .js-calculate in der cart-_handler.js funktioniert ja auch, leider bin ich aber nicht so fit, dass ich wüsste, wie ich das für mich kopiere. Gruß Sven
Ich kann Dir nicht helfen ,aber ich habe eine Frage: Warum gibt es denn 3x die selben Werte? (162g rosa / 163g rosa) Ich suche da den Unterschied, sehe aber keinen.....
War mal ein Usability test, den ich mal mit ein paar Kunden gemacht hatte. Später hatte ich dann die Anzahl zusätzlich in Klammern dahinter gesetzt. Normal ist es so wie bei der Gelben mit 161g, da sind es 4 mal die gleichen und eine etwas dunkler. Da die Scheiben aber alle gelabelt sind, habe ich es in diesem Fall nicht rückgängig gemacht Habe jetzt mal ein besseres Beispiel in den oberen Beitrag gesetzt
Was dir helfen könnte ist Code: $(document).ajaxComplete(function(event, xhr, settings) { if (settings.url === 'shop.php?do=CheckStatus' && xhr.status === 200) { // Hier kommt mein Code hin console.log('huch...'); } }); In deinem JS wartest du im Prinzip auf eine bestimmte URL die über Ajax ausgeführt wird (z.B. shop,php?do=CheckStatus) damit anschließend dein Code für eventuell neu hinzugefügte Elemente auch gültig ist. siehe dazu https://api.jquery.com/ajaxComplete/
Danke schonmal Jetzt muss ich im Prinzip nur noch die URL rausfinden oder? Das Div wird ja aber jedes Mal neu geladen, sobald eine Änderung (Kombinationsprüfung) durchgeführt wird, das würde ja bedeuten, das es dann auch nur einmal klappt, oder?
Ich schätze ja du brauchst wenn man schon das alte jQuery Zeugs nehmen mag eher on(). https://api.jquery.com/on/ Damit hängt man Events an Selektoren, das geht immer wieder.
Die Konsole des Browsers im Bereich Netzwerk wird dir die URL mitteilen. Müsste etwas mit CheckStatus sein. Nein, weil das ajaxComplete() in deinem JS-Code auch jedes mall abgefeuert wird, sobald die URL im Netzwerk erscheint. Grob formuliert
Ja das hatte ich auch schon versucht, aber auch hier, keine Reaktion nachdem das Div neu geladen wurde. Was wäre denn die Alternative zum alten jQuery Code? Ich hatte es ja mit der API versucht, aber wie ich dir im Video gezeigt hatte, werden die Javascript Datein nur gelöscht und nicht kopiert. Jup, du hattest bereits die richtige URL im Code. Ich habe in der Datei nun folgenden Code: Code: console.log('properties_buttons.js geladen'); $(document).ajaxComplete(function(event, xhr, settings) { if (settings.url === 'shop.php?do=CheckStatus' && xhr.status === 200) { // Hier kommt mein Code hin console.log('huch...'); } }); Allerdings kommt nicht mehr als (properties_buttons.js geladen) in der Console. Das Huch erscheint nicht einmal. //Edit Kann es sein, dass es nicht funktioniert, da settings.url folgende URL enthält? Code: shop.php?do=CheckStatus&properties_values_ids%5B23%5D=0&properties_values_ids%5B35%5D=0&properties_values_ids%5B59%5D=0&properties_products_id=1270&products_id=1270&products_qty=1&btn-add-to-cart=In%20den%20Warenkorb&target=check&isProductInfo=1&page_token=&_=1578047357588
Ja, daran liegt es Statt "===" nimm dafür z.B. "indexOf" also Code: settings.url.indexOf('shop.php?do=CheckStatus') >= 0 Der Part mit ajaxComplete() kommt in die "init" oberhalb von "done()";