Bildergalerie extra für den Einbau in Mobirise

[Volker]

So, nun mal was extra für Mobirise

Eine ganz einfache Bilder Galerie die direkt in Mobirise eingebaut werden kann.

Hier gehts zur Galerie Frontend in Mobirise eingebaut: https://www.niederastroth.de/bilder/

Hier zum Admin Panel : https://www.niederastroth.de/bilder/admin.php

Passwort: admin123

Zur Technik:
Das ganze besteht aus 2 Scripten admin.php und galerie.php
Es wird auf dem Server im Verzeichnis wo sich die beiden Scripte befinden ein Ordner uploads angelegt. In diesem auch ein Ordner thumbs. Dort werden die Bilder abgelegt und behalten auch den original Namen ( Wichtig für Tommy )

Man kann theoretisch mehrere Bilder gleichzeitig hoch laden, ist aber durch eure jeweilige PHP ini Einstellung eventuell auf 8 MB begrenzt. Dann eben nur ein oder zwei Bilder gleichzeitig hoch laden. ( eventuell bau ich da aber noch eine anderes System zum Hochladen ein ) später

Ich glaube das haben einige gesucht ... Endlich mal mehr Bilder auf die Webseite bringen, wie Mobirise mit den Galerie Blöcken zulässt, bzw. möglich sind.


Hab es jetzt mal mit include gemacht. Ja ich weiss kann zu falschen HTML führen
Tut es aber nicht, laut Console alles tippi toppi - hab ich ja auch drauf geachtet beim Erstellen

Bin gespannt ob Tommy da Fehler findet

Ich bau morgen noch die admin.php ein bisschen um und dann geht alles in den download.

Mir gefälltes

Die Links oben sind nun tot, da das Script zum Download steht und bei mir und Tommy auch angeschaut werden kann

[Tommy Herrmann]

Moin,

… na fleißig, fleißig

Ich benötige das zwar nicht, werde es aber dennoch eventuell mal testen und einbauen. Ich weiß nicht wann, wahrscheinlich komme ich heute nicht dazu und morgen ganz sicher nicht.

Sieht aber brauchbar aus

Wo ist der Download ???


P.S.:

Ich passe diesmal, denn ich habe bereits so viele Fotogalerien, auch separate mit eigenem Upload, sodass ich das nur wiederholen würde. Ich persönlich finde die unzähligen Galerien und Slider, die Mobirise anbietet, völlig ausreichend.

[Volker]

Moin Tommy,

Download kommt gleich, musste noch die admin.php ändern, hatte mir so noch nicht gefallen.
Will auch ein Video dazu machen und den Einbau in Mobirise zeigen.

So gefällt es mir jetzt, hab den Upload geändert, damit man in viele Bilder auf einmal hoch laden kann.

[Volker]

Fertig



Download: https://www.niederastroth.de/bildergalerie.7z

[Tommy Herrmann]

Moin,

ja - das funktioniert so alles

https://www.mobirise-tutorials.com/Tuto ... Upload.php

Die CSS in den CSS-Editor zu kopieren macht keinen Unterschied. Es ist doch restlos egal wo eine CSS steht, solange diese geladen wird. Das wäre jetzt überflüssige extra Arbeit.

Das Eingabefeld für das Passwort ist wieder nicht leer gesetzt (das könnte ich wohl auch alleine), das solltest Du aber noch verbessern, denn sonst ist das nervig immer erst die 6 Punkte vom Browser-Passwortmanager weg zu machen. Den benutzen ja nun fast alle.

Die Thumbs sind extrem unscharf. Durch das Mausüber werden sie extrem unscharf - das geht nicht. Das kann meiner Meinung nach nicht so bleiben. Zur Not sollten einfach die Originalbilder verkleinert dargestellt werden, denn geladen werden müssen die ja ohnehin.

Die vergrößerten Popup-Bilder sind am Handy viel zu klein (halb so groß wie die Thumbs).

[Volker]

Unscharf ??

[Tommy Herrmann]

JA- total

[Volker]

Ich hab mir jetzt extra die Brille geputzt

Ich finde die total OK so, als Vorschaubild. Du kannst ja drauf klicken dann siehst du es in Groß.
Ich lasse das jetzt mal alles so. Um die zu Löschen reicht meiner Meinung die Bildqualität. Mehr kann man in der Admin eh nicht machen. Hochladen und löschen. So wars gedacht

[Tommy Herrmann]

Die Thumbs sind 300px breit und werden zum Beispiel dann am mobilen Gerät vergrößert, also auf z.B. 350 oder 400px. Dann werden sie krass unscharf. Das gleiche am Desktop. Auch da werden die Thumbs grundsätzlich vergrößert und dadurch total unscharf.

Die Popup-Bilder sollten ja dann die großen Bilder sein, nur sind die am Handy winzig

[Volker]

dann mach ich die kleiner

welche Größe würde denn passen ?

[Tommy Herrmann]

Du müsstest die Thumbs viel größer machen - so ca. 50% der Originalbilder. Das ist aber kritisch, denn niemand kann voraussagen welche Größe die Originalbilder von Usern haben.

Bilder dürfen niemals vergrößert werden.

Ich würde vorschlagen, lasse die Thumbs ganz weg und stelle die Originalbilder als Galerie ein. Dann passt das immer, denn verkleinerte Bilder sehen eher schärfer aus.

Dann musst Du auch nochmals gucken, warum die großen Bilder im Popup am Handy so winzig sind. Das kann auch nicht so bleiben.


Beispiel dieses Thumb ist auf meiner Webseite auf eine Breite von 327px vergrößert und daher total unscharf:

Thumbnails-unscharf.jpg (32.16 KiB) 1515 mal betrachtet

Das Original Thumb ist nur 200px breit:

Original-200.jpg (10.45 KiB) 1515 mal betrachtet

[Volker]

Hab ich nun geändert. Besser so?

https://www.niederastroth.de/bilder/

[Tommy Herrmann]

Ja - das ist jetzt unverändert die Originalgröße oder? Das wäre gut.


Die Bilder müssen auch im alphabetischen Index dargestellt werden. Diese sind jetzt wild durcheinander. Das ist manchmal sehr wichtig, wie man die Bilder sortiert darstellen will.

https://www.mobirise-tutorials.com/Tuto ... Upload.php

Meine Bilder sollten z.B. dann von 001.jpg bis 012.jpg geordnet dargestellt werden, wobei man wahrscheinlich das Extention ".jpg" abschneiden und nicht anzeigen sollte. Das macht eine schönere Beschriftung möglich.

[Volker]

Im Moment wird nach Datum sortiert, ändere ich nach Bild Nummer um

Jetzt gehts nach Reihenfolge der Beschriftung. Probier mal aus

[Tommy Herrmann]

Ja - das fände ich besser. Vielleicht benötigen andere das Datum Wäre eine Option im Admin-Bereich villeicht sehr gut.


Ich weiß nicht wie das Popup konstruiert ist, aber so geht das am Handy irgendwie nicht.


So ist die Ansicht der Galerie (kleine Bilder):

So ist die Ansicht der großen Bilder im Popup. Vielleicht müssen die mit einer Media-Abfrage auf 90% der Breite gesetzt werden:

Code: Alles auswählen

@media (max-width: 767px) {
  img {
    width: 90%;
  }
}

[Volker]

Ja ich und CSS

Das wird nie gut gehen

Muss ich schauen

Das muss die KI für mich machen

[Volker]

Problem gelöst durch KI

CSS ist wirklich nicht meins

Ist im Zip jetzt gefixt und geht auch am handy

[Tommy Herrmann]

Ist das Download schon geändert?

... ach ja - steht ja da

[Volker]

jatezt tommy , hab es online

[Volker]

bitte JETZT runter laden