Kommentarbox von Werner Zenk

PHP, CSS und JavaScript lernen. Anwendungen für Webseiten
Benutzeravatar
struggle
Mitglied (Level 10)
Mitglied (Level 10)
Beiträge: 438
Registriert: So 4. Dez 2022, 11:55
Wohnort: Brandenburg

Re: Kommentarbox von Werner Zenk

Ungelesener Beitrag von struggle »

Hallo Tommy,

ich bin schon einen Schritt weiter, jetzt fehlen nur noch ein paar Kleinigkeiten:
kommen3.PNG
1) grüner Pfeil ganz oben, "Kommentare", wie und wo kriege ich die Schrift weiss ?

2) grüner Pfeil auf der Sprechblase, wo kann ich die Farbe für diesen kleinen Zipfel einstellen ?

3) grüner Pfeil auf den Bewertungssternchen:
Da habe ich in der kommentar.css für OK ein stärkeres Blau eingestellt und für KO die Hintergrundfarbe der Kommentarbox, so dass man dann nur die Sternchen für OK sieht, das wurde aber nicht übernommen.
Muss ich das woander einstellen ?

Den Inlineframe nehme ich noch raus, der war nur für Testzwecke !

https://www.meinlangengrassau.de/quatschen.php
Gruss
Reinhard
Benutzeravatar
struggle
Mitglied (Level 10)
Mitglied (Level 10)
Beiträge: 438
Registriert: So 4. Dez 2022, 11:55
Wohnort: Brandenburg

Re: Kommentarbox von Werner Zenk

Ungelesener Beitrag von struggle »

struggle hat geschrieben: Sa 2. Dez 2023, 18:56 Hallo Tommy,

ich bin schon einen Schritt weiter, jetzt fehlen nur noch ein paar Kleinigkeiten:

kommen3.PNG

1) grüner Pfeil ganz oben, "Kommentare", wie und wo kriege ich die Schrift weiss ?

2) grüner Pfeil auf der Sprechblase, wo kann ich die Farbe für diesen kleinen Zipfel einstellen ?

3) grüner Pfeil auf den Bewertungssternchen:
Da habe ich in der kommentar.css für OK ein stärkeres Blau eingestellt und für KO die Hintergrundfarbe der Kommentarbox, so dass man dann nur die Sternchen für OK sieht, das wurde aber nicht übernommen.
Muss ich das woander einstellen ?

Den Inlineframe nehme ich noch raus, der war nur für Testzwecke !

https://www.meinlangengrassau.de/quatschen.php
PS: Die Farbenstellungen für die Bewertungssternchen (ok + ko) habe ich im Editor gefunden!
Und den Rest finde ich auch noch!
Gruss
Reinhard
Benutzeravatar
Tommy Herrmann
Site Admin
Site Admin
Beiträge: 5865
Registriert: So 6. Dez 2020, 07:37
Wohnort: Berlin
Kontaktdaten:

Re: Kommentarbox von Werner Zenk

Ungelesener Beitrag von Tommy Herrmann »

Moin,

meinst Du mit "Pfeil ganz oben" das Häkchen aus den "Windows Emojis"? Dieses Häkchen habe ich über die Emoji-Funktion vom Windows - also folgende Tastenkombination - in das Script "kommentar.php" eingefügt:

Windowstaste :windows: + Punkt

Falls Du dieses Häkchen entfernen wolltest, müsstest Du das Script "kommentar.php" öffnen und suchen nach:

Kommentar eintragen

Das steht hier in meinem Script in Zeile 362. Das Häkchen kannst Du dort nur löschen - in einer andere Farbe kann man diese Windows-Zeichen nicht darstellen.

Bitte vorsichtig sein beim Löschen! Passe auf, dass Du ausschließlich das Häkchen entfernst.


Script kommentar.jpg


P.S.:

hatte gar nicht gesehen, dass Du 2 Beiträge geschrieben hast, den ersten der beiden Einträge hatte ich zunächst übersehen. Jetzt weiß ich auch was Du mit "Pfeil ganz oben" meintest, Deinen Pfeil der auf die Schriftfarbe von "Kommentar eintragen" zeigt. Das mit dieser Schriftfarbe hast Du also auch schon gefunden :tu:






struggle hat geschrieben: Sa 2. Dez 2023, 18:56 Da habe ich in der kommentar.css für OK ein stärkeres Blau eingestellt und für KO die Hintergrundfarbe der Kommentarbox, so dass man dann nur die Sternchen für OK sieht, das wurde aber nicht übernommen.

Die CSS-Datei vom Werner mit dem Namen "kommentar.css" verwendest Du doch überhaupt nicht. Die hast Du doch gar nicht in die Mobirise-Seite integriert, in dieser Datei brauchst Du dann auch nichts ändern :D

Ohne Dich jetzt verwirren zu wollen - Du musst das aber verstehen, sonst passiert es wieder. Lasse das mit der CSS-Datei also, was ich jetzt erkläre. Ich schreibe das jetzt nur zum besseren Verständnis und zum Lernen für Dich.

Wenn man eine CSS-Datei in eine HTML-Seite integrieren wollte, dann müsste man das über einen solchen Verweis (Link) im Bereich "Inside <head> code" der Seiteneinstellungen von Mobirise tun:

Code: Alles auswählen

<link rel="stylesheet" href="kommentar.css">
Somit würde der Browser den Inhalt dieser CSS-Datei lesen und auch in seinem Cache ablegen. Dann wird der Browser die dort eingetragenen CSS-Klassen eben entsprechend auch verarbeiten, denn diese Klassen stehen ja auch an den einzelnen HTML-Elementen der Seite mit dran, eben dort wo sie wirken sollen.

Dann würde man aber nicht zusätzlich die CSS-Klassen in den "CSS Editor" des Blocks kopieren, denn dann hätte man sie ja doppelt. Außerdem würde diese CSS dann eben über alle Blöcke der gesamten Seite wirken und nicht nur in dem Block mit der Kommentar-Box. Daher ist das ein großer Unterschied.



Du hast doch Deine gesamte CSS direkt in den "CSS Editor" von Deinem Block eingetragen, somit auch die CSS für diese Sternchen.

Das sind diese CSS-Klassen (unten) und dort kannst Du auch die Farbe bei "color:" der beiden Klassen ändern, wobei ich das nicht gewählte Sternchen (bewertung_ko) eher so "ausgegraut" lassen würde oder vielleicht ein wenig anderes Rot verwenden als es mit der Hintergrundfarbe ganz unsichtbar zu machen. Das sieht für mein Empfinden sonst etwas falsch aus:

Code: Alles auswählen

fieldset.kommentarBox span.bewertung_ok {
  color: #0f2d4e;
}

fieldset.kommentarBox span.bewertung_ko {
  color: #c8c8c8;
}



Tipp:

falls Du die Sprechblase (so wie ich) etwas weiter vorne (links) anzeigen möchtest, dann könntest Du das in dieser CSS-Klasse anpassen - von jetzt:

Code: Alles auswählen

fieldset.kommentarBox dl.kommentar dd {
  margin-left: 40px;
  font-size: 1.2rem;
}
ändern auf z.B. nur 15px anstatt 40px:

Code: Alles auswählen

fieldset.kommentarBox dl.kommentar dd {
  margin-left: 15px;
  font-size: 1.2rem;
}

margin-15px.jpg


oder auch z.B. ganz links ohne Abstand:

Code: Alles auswählen

fieldset.kommentarBox dl.kommentar dd {
  margin-left: 0px;
  font-size: 1.2rem;
}

margin-0px.jpg
Benutzeravatar
struggle
Mitglied (Level 10)
Mitglied (Level 10)
Beiträge: 438
Registriert: So 4. Dez 2022, 11:55
Wohnort: Brandenburg

Re: Kommentarbox von Werner Zenk

Ungelesener Beitrag von struggle »

Hallo Tommy,

ganz ohne Abstand gefällt mir am besten ! Hab´ ich geändert !

Ein Problem hat sich eingestellt, wenn ich einen Eintrag vorgenommen habe, wurde ich immer per e-Mail benachrichtigt. Dies erfolgt nicht mehr. An den Einstellungen wurde nichts geändert. E-Mail-Adresse stimmt nach wie vor. Kann das was damit zu tun haben, daß "Bearbeiten" aktiviert ist ?
Wenn ich nicht selbst einen Eintrag vorgenommen hätte, wüßte ich ja nichts davon.

Und dann noch was, kann man den Nachrichtentext innerhalb der Sprechblase zur Ansicht auf dem Handy etwas verkleinern. Bei einer längeren Nachricht sieht das nicht sehr schön aus:
schrift.jpg
Gruss
Reinhard
Benutzeravatar
Tommy Herrmann
Site Admin
Site Admin
Beiträge: 5865
Registriert: So 6. Dez 2020, 07:37
Wohnort: Berlin
Kontaktdaten:

Re: Kommentarbox von Werner Zenk

Ungelesener Beitrag von Tommy Herrmann »

Moin,

also eine E-Mail solltest Du weiterhin erhalten.

Ich habe selbst gerade alles nochmals überarbeitet, da Werner gestern eine neu Version erstellt hat. Da gibt es aber keine Änderungen, die uns betreffen. Er hat nur Kleinigkeiten korrigiert und zum Beispiel diese "333333333" entfernt. Einige CSS-Klassen angepasst und neue Anker-Namen gesetzt. Ich habe lediglich das Nummernfeld für die Rechenaufgabe in meinen Download vom Script übernommen.

Überprüfe die in Deinem Script eingetragene E-Mail Adresse nochmals, vielleicht hast Du diese irgendwann vergessen und dort steht noch immer:

Code: Alles auswählen

// E-Mail - Empfänger
// Eine beim Provider registrierte E-Mail Adresse als Empfänger eintragen!
$EMAIL = "name@example.com"; // name@example.com
Das mit dem Handy ist schwierig. Man könnte ja nur die Textgröße für das Handy anpassen, damit der Eintrag nicht zu lang erscheint. Nur - gerade am Handy sollte der Text ja eher größer als kleiner werden. Zu kleiner Text am Handy wird auch von Google mit einer schlechten Platzierung "bestraft".

Hast Du mal versucht die Breite von Deiner Mobirise-Box etwas breiter zu machen? Das wird aber wahrscheinlich auch nichts ändern und am Handy dann gleich sein.


Breite Mobirise-Block.jpg


Da müsste man mal gucken, ob man da die Ränder (padding) von Deinem Mobirise-Thema etwas schmaler einstellen kann. Viel wird das dann aber auch nicht am Handy bringen. Vielleicht so 15px links und rechts.

... und wenn dann jemand noch mehr schreibt - wird es wieder ewig lang. Aber sei unbesorgt, wenn da überhaupt mal jemand etwas schreibt, dann mit Sicherheit nur kurze Sätze.

Ich würde Dir raten das so zu lassen.
Benutzeravatar
Tommy Herrmann
Site Admin
Site Admin
Beiträge: 5865
Registriert: So 6. Dez 2020, 07:37
Wohnort: Berlin
Kontaktdaten:

Re: Kommentarbox von Werner Zenk

Ungelesener Beitrag von Tommy Herrmann »

Versuche das mal noch in Deinen CSS-Editor, so wird die Schrift am Handy etwas kleiner (aber noch lesbar):

Code: Alles auswählen

@media (max-width: 991px) {
  fieldset.kommentarBox dl.kommentar dt {
    font-size: 1rem;
  }
  fieldset.kommentarBox dl.kommentar dd {
    font-size: 1rem;
  }
}
@media spricht das Gerät, bzw das Display an. Wenn es also maximal 991px breit ist (oder schmaler) greift diese CSS-Anweisung. Das kannst Du dann auch schon sehen, wenn Du das Browser-Fenster zusammen schiebst.

1rem (Root "EM") ist hier 16px

Du könntest auch versuchen z.B. einzutragen:

font-size: 0.8rem;

das wird dann aber eher sehr klein.
Benutzeravatar
struggle
Mitglied (Level 10)
Mitglied (Level 10)
Beiträge: 438
Registriert: So 4. Dez 2022, 11:55
Wohnort: Brandenburg

Re: Kommentarbox von Werner Zenk

Ungelesener Beitrag von struggle »

Das ist doch was, dankeschön, jetzt geht es erst Mal mit Hund raus
Gruss
Reinhard
Benutzeravatar
Tommy Herrmann
Site Admin
Site Admin
Beiträge: 5865
Registriert: So 6. Dez 2020, 07:37
Wohnort: Berlin
Kontaktdaten:

Re: Kommentarbox von Werner Zenk

Ungelesener Beitrag von Tommy Herrmann »

ja - und ich rufe schon die ganze Zeit meine Katze 🐱 - bei der irren Kälte hier
Benutzeravatar
struggle
Mitglied (Level 10)
Mitglied (Level 10)
Beiträge: 438
Registriert: So 4. Dez 2022, 11:55
Wohnort: Brandenburg

Re: Kommentarbox von Werner Zenk

Ungelesener Beitrag von struggle »

Ich habe die Media-Anweisung übernommen, das gefällt mir sehr gut.

E-Mail.Nachrichten bekomme ich auch wieder, hatte mich beim neu ausfüllen der kommentar.php wirklich verschrieben.

Warum ist Dir kalt ? Du wohnst doch im Süden von Berlin :cool: , oder ? Ich komme ja aus dem Norden von Berlin :( !
Gruss
Reinhard
Benutzeravatar
Tommy Herrmann
Site Admin
Site Admin
Beiträge: 5865
Registriert: So 6. Dez 2020, 07:37
Wohnort: Berlin
Kontaktdaten:

Re: Kommentarbox von Werner Zenk

Ungelesener Beitrag von Tommy Herrmann »

ja - ganz im Süden vom Bezirk "Zehlendorf".

... na ja - im Norden ist es auch noch 10° kälter :schnee:
Benutzeravatar
Werner-Zenk.de
Mitglied (Level 10)
Mitglied (Level 10)
Beiträge: 755
Registriert: Di 8. Dez 2020, 19:42
Wohnort: Bamberg
Kontaktdaten:

Re: Kommentarbox von Werner Zenk

Ungelesener Beitrag von Werner-Zenk.de »

Tommy Herrmann hat geschrieben: So 3. Dez 2023, 08:33 Moin,

also eine E-Mail solltest Du weiterhin erhalten.

Ich habe selbst gerade alles nochmals überarbeitet, da Werner gestern eine neu Version erstellt hat. Da gibt es aber keine Änderungen, die uns betreffen. Er hat nur Kleinigkeiten korrigiert und zum Beispiel diese "333333333" entfernt. Einige CSS-Klassen angepasst und neue Anker-Namen gesetzt. Ich habe lediglich das Nummernfeld für die Rechenaufgabe in meinen Download vom Script übernommen.
Bei meiner letzten Änderung war mir vor allem wichtig, dass ich dieses veraltete JavaScript (am Ende des Formulars beim Eintragen):

Code: Alles auswählen

  <script> document.write(\'<input type="hidden" name="titel" value="\' + document.title + \'">\'); </script>
  <button type="submit">Eintragen</button>
ersetze durch:

Code: Alles auswählen

  <input type="hidden" name="titel" id="titel">
  <script>document.querySelector("#titel").value = document.title;</script>
  <button type="submit">Eintragen</button>
Dadurch wird der Seitentitel (der <title> zwischen </title> steht) in die Datenbank-Tabelle übernommen.
Benutzeravatar
Tommy Herrmann
Site Admin
Site Admin
Beiträge: 5865
Registriert: So 6. Dez 2020, 07:37
Wohnort: Berlin
Kontaktdaten:

Re: Kommentarbox von Werner Zenk

Ungelesener Beitrag von Tommy Herrmann »

Moin Werner,

ja - das hatte ich gestern schon entdeckt und bei mir im Script und im Download auch geändert.

Ich habe da lediglich noch eine Bootstrap-Class für den Button hinzugefügt, die in allen Mobirise-Versionen ähnlich verwendet wird:

class="btn btn-primary btn-sm"

Code: Alles auswählen

  <input type="hidden" name="titel" id="titel">
  <script>document.querySelector("#titel").value = document.title;</script>
  <button class="btn btn-primary btn-sm" type="submit">Eintragen</button>
Verstanden hatte ich diesen Umbau vom alten Script nicht so ganz - also danke für die Erklärung! :tu:

Ich wollte eigentliche auch die neue id="anker", die Du mächtig oft umgebaut hast und einige "href" anstelle der <span> überall übernehmen, das habe ich aber wieder zurück gebaut, denn da gingen dann wieder meine Seiten-Sprünge nicht mehr. Vielleicht habe ich dabei aber auch einen Fehler gemacht.

Hatte mit "WinMerge" haarklein Zeile für Zeile verglichen, weil ich ja auch inzwischen sehr viel selbst angepasst habe, was ich schon gar nicht mehr alles weiß.

Der Seitentitel wurde aber mit dem alten Script ebenso schon übernommen, wie man unten in der Datenbank sieht. Ich hatte ja meine ersten Einträge über Deine Datei "demo.php" gemacht und diese stehen lassen. Damit sie dennoch angezeigt werden, hatte ich die URL in der Spalte "pfad" angepasst:


Kommentar-Box Datenbank.jpg
Benutzeravatar
Tommy Herrmann
Site Admin
Site Admin
Beiträge: 5865
Registriert: So 6. Dez 2020, 07:37
Wohnort: Berlin
Kontaktdaten:

Re: Kommentarbox von Werner Zenk

Ungelesener Beitrag von Tommy Herrmann »

Moin Reinhard,

falls Dich das mit der Datenbank (mein Screenshot oben) interessiert. Diese kannst Du bei Deinem Provider auch einsehen.

Was ich oft verwende, weil ich das viel einfacher finde, ist die Anwendung "Adminer":

https://www.adminer.org/

Da kannst Du Dir das mal am allerersten Link unter "Downloads" downloaden.

Du kopierst dann lediglich diese Datei in irgendein Verzeichnis und rufst die Datei "adminer.php" über die URL-Eingabe im Browser auf. Also z.B. im Stammverzeichnis (Root) des Projektes so:

Code: Alles auswählen

www.DeineDoamin.de/adminer.php
Das sieht dann so aus:


Adminer-Datenbank-Anwendung.jpg


... und trägst die gleichen Zugangsdaten, wie in Werners Script "kommentar.php", für diese MySQL-Datenbank ein.

Dann kannst Du Einträge auch über die Datenbank ändern oder auch die Datenbank sichern (exportieren) und vieles mehr.

Das funktioniert mit MySQL-Datenbanken (wie hier) ebenso wie mit den SQLite-Datenbanken, die Werner ja auch oft und gerne verwendet.
Benutzeravatar
struggle
Mitglied (Level 10)
Mitglied (Level 10)
Beiträge: 438
Registriert: So 4. Dez 2022, 11:55
Wohnort: Brandenburg

Re: Kommentarbox von Werner Zenk

Ungelesener Beitrag von struggle »

Hallo Tommy,

besten Dank für den Tipp, damit werde ich mich noch beschäftigen. Zur Zeit habe ich lediglich 2 Datenbanken, also sehr übersichtlich.
Gruss
Reinhard
Antworten

Wer ist online?

Mitglieder in diesem Forum: 0 Mitglieder und 94 Gäste