Beiträge von Sailor

Ein CSS Fehler wird das nicht sein.
Wenn dir der Browser einen 404 Fehler zeigt, dann wird er wohl Recht haben... die Datei existiert am angegeben Pfad nicht oder der Dateiname ist falsch (auch Groß- und Kleinschreibung beachten)
Wie hast du die Bilddatei hochgeladen? Per FTP oder in die Mediathek von Wordpress?
Wie sieht der ausgelieferte Quellcode im Browser aus - welcher Pfad wir dort angegeben?
Mit einem Link zur Seite könnte man sicher besser erkennen, was los ist. Dieser WP Code ist so ohne weiteres nicht wirklich hilfreich.

Auch wenn das, was ich dir jetzt vorschlage ganz und gar nicht korrekt und auch nicht valide ist... und ich obendrein auch keine Ahnung habe, ob es funktioniert, du könntest versuchen den Code als 'Inline Style' in dein Template einschleusen, indem du einfach...

<style>
.product-single__photos {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}
.product-single__photos img {
  width: 75%;
  max-width: 75%;
}
.product-single__gallery {
  width: 25%;
  max-width: 25%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-direction: column;
}
.product-single__gallery-item {
  width: 100%;
}
</style>

ganz am Anfang der relevanten Shop-Template Dateien einfügst. Wenn das nicht klappt, war es zumindest einen Versuch wert.

- - - Aktualisiert - - -

... oder, wenn du eine Stelle hast, in der du eigenes CSS einfügen kannst, dann könnte man versuchen diesen Code etwas in den Vordergrund zu drängen, indem man die einzelnen Anweisungen mit !important... also 'wichtig' kennzeichnet...

.product-single__photos {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  width: 100% !important;
}
.product-single__photos img {
  width: 75% !important;
  max-width: 75% !important;
}
.product-single__gallery {
  width: 25% !important;
  max-width: 25% !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  flex-direction: column !important;
}
.product-single__gallery-item {
  width: 100% !important;
}

- - - Aktualisiert - - -

Hab da was gefunden zum Thema CSS in Template einfügen... https://help.shopify.com/en/themes/cust…-product-images
Vielleicht ist das ja die Stelle, die du brauchst.

Zitat

• From your Shopify admin, go to Online Store > Themes.

• Find the theme you want to edit, and then click Actions > Edit code.
  
• In the Assets directory, click theme.css.liquid. If your theme doesn't have a theme.css.liquid file, then click styles.css.liquid, or another file with a .css.liquid file extension.
  
• At the very bottom of the file, paste this code hosted on GitHub.
  
• Click Save.
  

Alles anzeigen

Statt den Code von GitHub dann natürlich deinen CSS Code.

Leider hilft mir der Code nicht wirklich weiter - da es sich dabei um ein Shopsystem von Shopify handelt und was Shopify mit den Sonder- nicht HTML oder PHP Code anstellt, entzieht sich leider meiner Kenntnis.
Das spielt letztlich aber auch keine Rolle, denn der ausgelieferte Code ... also das was im Browser einer Besuchers ankommt... muss auf CSS reagieren. Die Frage lautet jetzt nur, wie du den CSS Code in dein Template bekommst? Hast du dafür keine 'Bedienungsanleitung'... oder den Support von Shopify? Du musst also die richtige Stelle finden, wo du den CSS Code einfügen kannst.
In meiner Simulation sieht das dann so aus!

Ein Ansatz zur Problemlösung könnte das sein:

.product-single__photos {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}
.product-single__photos img {
  width: 75%;
  max-width: 75%;
}
.product-single__gallery {
  width: 25%;
  max-width: 25%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-direction: column;
}
.product-single__gallery-item {
  width: 100%;
}

Wobei sich die Größenverhältnisse zwischen den Produktbild und dem Thumbs sich durch Anpassung der %-Werte bei '.product-single__photos img' und '.product-single__gallery' (ich habe 75% + 25% = 100%) zum testen genommen. Es gehen aber auch beliebige andere Werte, solange die Summe <=100% ist.

Konnte das allerdings nur sehr oberflächlich testen... also ohne Gewähr - sollten damit irgendwo Probleme auftauchen musst du dich wieder melden.

Hier nochmal die Kurzversion, dessen was zu machen ist.
1. Ein Formular für die Eingabe erstellen:

<form action="zieladresse.php" method="post">
   <input type="text" id="name" name="vorname" placeholder="Dein Vorname">
   ...
</form>

Hier ist wichtig, dass mit action="zieladresse.php" die URL festgelegt wird, an die die Daten geschickt werden sollen.
Dass mit method="post" die Methode der Übermittlung festgelegt wird (POST oder GET).
Dass jeder Input einen individuellen hat - zB name="vorname".
Dass ein Nutzer erkennt, was in diesem Input-Feld einzugeben ist - zB durch placeholder="Dein Vorname" oder auch durch Verwundung eines <lable> (https://wiki.selfhtml.org/wiki/HTML/Formulare/label).
Es können beliebig viele Inputs innerhalb des Formulars (<form>..</form>) eingefügt werden.
2. Auf der Zielseite (zieladresse.php) können dann die übermittelten Werte mit:

<?php
if(isset($_POST['name']))
   {$vorname = htmlentities($_POST['name']);}
else
   {$vorname = "";}
?>

Wobei die Überprüfung ob tatsächlich ein Wert mit $_POST['...'] (if(isset($_POST['...']))) übergeben wurde nur so eine Art Sicherheitsabfrage ist, um zu verhindern, dass in der weiteren Verarbeitung des Codes Fehler durch nicht gesetzte Variablen auftreten. HTML5 fähige Browser verhindern allerdings schon automatisch eine Übermittlung von 'leeren' Werten, sofern im <input... required> angegeben ist.
htmlentities($_POST['name']) ist auch ein Sicherheitspunkt, mit dem verhindert wird, dass 'böse' Nutzer Schadcode in die Eingabe einbauen. Hiermit werden alle HTML Zeichen in HTML Entities umgewandelt. Ein eventuell in der Eingabe vorhandener Code wird damit, wenn er denn mit zB mit 'echo' ausgegeben wird, nicht ausgeführt sondern einfach nur angezeigt.
Die so ausgelesenen Variablen können im folgend Code beliebig genutzt werden. zB um sie mit 'echo $vorname;' an einer beliebigen Stelle auf der Seite auszugeben.

Sory... aber mit diesen Codeschnipseln kann ich nichts anfangen... es gehören immer HTML und CSS zusammen - und das gilt gerade bei diesen WP Installationen, wo jedes Plugin noch zusätzlichen Code in die Seite schreibt.
Also wenn du weiter Hilfe brauchst, wird das ohne einen Link zur Seite nicht gehen! Und natürlich eine konkrete Problembeschreibung... ich weiß ja nicht, welche Adresse und welches Logo du wo... links.. rechts .. oben oder unten haben möchtest.

Arne Drews - hat aber den Nachteil, dass evtl. 'Mitleser' dann nicht vom Thema profitieren können. Ich würde das schon gerne hier abhandeln - den ausdrücklichen 'Wunsch' eines Moderators würde ich aber natürlich akzeptieren.

Ich versteh nicht, was du fragen willst? Der Code in deinem ersten Post hat ja nicht funktioniert... wegen der Inline-Styles vermute ich... was soll da jetzt (nicht) funktionieren, wie in deinem ersten Post ???

Wenn du einen funktionierenden Code hast, dann solltest du tunlichst die Finger vom PHP und den darin aufgerufenen WordPress Funktionen lassen - es sei denn, du weißt ganz genau was du tust!
Wenn du doch meinst, du müsstest das tun, dann lege dir vorher ein Backup an ... erzeuge ein Child Theme und mache deine Änderungen dort!
Oh oh... wenn das mal nicht schief geht :(!

Und?... was ist passiert?

Du nutzt doch WordPress - oder? Sagt dir der Begriff 'zusätzliches CSS' irgendwas?

Was verstehst du unter 'einfacher'? Hast du die letzte vorgeschlagene Lösung ausprobiert?

Dann machst du jetzt folgendes.
in deinem <form..> Tag füllst du das action="..." mit dem Pfad/Dateiname zu deiner PHP Datei.
Direkt als Erstes im Body der PHP Datei fügst du den Code ein, denn ich dir ganz am Anfang (als Übungsobjekt) schon mal geschickt habe.
Dann testest du einfach, was passiert, wenn du das Formular ausfüllst und absendest.
Zu erwarten wäre, dass dann als Erstes in der Anzeige der eingegebene Wert für ID (glaube ich war es) ausgegeben wird.

Dann versuche bitte mal folgendes, um deinem Adressblock etwas besser in den Griff zu bekommen und weniger abhängig von anderen Elementen zu machen, nehmen wir den Code von oben, schmeißen da die Inline Styles raus und geben dem <div> eine ID---

<div id="adresse">
  <p>
    Dieser Text soll<br>
    So rechtsbündig<br>
    Wie eine Adresse<br>
    Aufgelistet stehen
  </p>
</div>

und dann musst du dieses CSS noch in dein Stylesheet unterbringen - ganz ans Ende anhängen.

#adresse {
   text-align: right;
}


#adresse p {
   text-align: left;
   display: inline-block;
   padding: 5px 20px 5px 0px;
}

Das 'padding' soll dafür sorgen, dass der Block nicht zu sehr am rechten Rand 'klebt'.

Jep.. gute Idee - aber nur auf dem ersten Blick! Auf dem Zweiten erkennt man doch deutliche Nachteile. Dieses Konstrukt sieht vielleicht nur auf deinem Monitor gut aus... alle anderen sehen vielleicht nichts, weil du die Adresse mit dem Margin aus dem Anzeigebereich geschoben hast ... oder die Adresse ist irgendwo, nur nicht rechtsbündig.
Kannst du näher beschreiben, wie das Ganze aufgebaut sein soll?
So was wie ein Briefkopf? Also wo links neben der Adresse noch irgendwelche Inhalte sein sollen - oder soll der freie Platz links ungenutzt bleiben?

- - - Aktualisiert - - -

Ach übrigens ... der Code aus deinem Anfangspost funktioniert!
Kann es sein, dass du auf deiner Seite noch andere CSS-Codes hast, die dir hier in die Quere kommen?

Und was ist der Inhalt der Dateien, die du jetzt hast?
In welcher Datei sollen das Eingaben aus dem Formular eingefügt werden. Dies Datei muss auf jeden Fall die Dateiendung .php haben, sonst kannst du dort keinen PHP Code einfügen.

Wo hast du denn jetzt deine HTML / PHP Dateien gespeichert?

... und auch schon installiert? Im Netz gibt es Hunderte von Anleitungen wie das geht und wie man anschließend damit arbeitet.

Soweit ich weiß, ist 'Brackets' eine Code Editor und eigenständig nicht in der Lage PHP zu parsen. Was du brauchst ist ein Local-Host, also ein Programm, dass einen Webserver auf deinem Rechner simuliert und dir eben den geparsten HTML Code, den du mit PHP erzeugst, zurück gibt damit er vom Browser angezeigt werden kann.
Alternativ könntest du auch jeweils deine Codes auf einen richtigen Server hochladen und testen - aber das ist viel zu umständlich.

Und nein... wir bleiben hier schön im Forum, vielleicht sind noch andere an diesem Thema interessiert und würden gerne erfahren, wie es weiter geht, warum soll ich denen verwehren, hier etwas zu lernen?

Ich helfe dir ja gerne -aber machen musst du schon alleine. Das ist hier ein 'ich helfe dir Forum' und kein 'ich mach für dich Forum'.
Außerdem willst du ja was lernen, wenn ich mache lernst du nichts.
Sag mir also was du machen willst, wie deine Versuche diesbezüglich aussehen und ich werde dir dann Schritt für Schritt bei den Dingen helfen, die dir Probleme bereiten.
Hast du überhaupt schon eine Entwicklungsumgebung für PHP (XAMPP oder änliches) auf deinem Rechner installiert?
Hast du dich schon mit den PHP Grundlagen beschäftigt (zB https://www.php-einfach.de/)?