Floating Side Slider – Code Generator

Anwendungen für Webseiten. Künstliche Intelligenz verwenden.
Volker
Moderator
Moderator
Beiträge: 1678
Registriert: Sa 12. Dez 2020, 22:35

Floating Side Slider – Code Generator

Ungelesener Beitrag von Volker »

Hallo zusammen :D

es gibt noch nicht genug Generatoren von mir :D :D

Hier mal was, was bestimmt auch ganz nett wird ( ist noch im Aufbau )
Aber Das geile, man kann auch direkt HTML Code einbauen ;)

Schaut mal die Vorab Version an: https://www.niederastroth.de/slider/
Anregungen ? Kritik ?


Auf jeden Fall funktioniert das ganze : https://www.niederastroth.de

Ist noch nicht ganz perfekt, aber das kommt noch ;)
Volker
Moderator
Moderator
Beiträge: 1678
Registriert: Sa 12. Dez 2020, 22:35

Re: Floating Side Slider – Code Generator

Ungelesener Beitrag von Volker »

So, das Ding ist nun fast fertig :D

Ich habe mal meine Newsletter Anmeldung mit Iframe da integriert ;)

Man kann auch Texte, Bilder, Videos oder Formulare da rein bauen.
Man kann die Action z.B. mailer.php direkt eingeben und man kann Bilder in einen Ordner legen, den Namen kann man auch im Generator eingeben.

Ihr könnt ja mal testen :D Erklärt sich eigentlich von selber :) Aber Video kommt noch :D

https://www.niederastroth.de/

Ok ich hab jetzt etwas übertreiben :D Ist ja nur ein Test ;)
Volker
Moderator
Moderator
Beiträge: 1678
Registriert: Sa 12. Dez 2020, 22:35

Re: Floating Side Slider – Code Generator

Ungelesener Beitrag von Volker »

Neu überarbeitet und schöner und schlanker / halt wie ich :D

Super einfach zu bedienen, einfach Code in z.B. Mobirise befor end of Body in der globalen HTML und fertig.

https://www.niederastroth.de/slider/

Schaut es euch an ;)

https://www.youtube.com/watch?v=F_-jn-chXLQ&t=46s
Benutzeravatar
Tommy Herrmann
Site Admin
Site Admin
Beiträge: 7971
Registriert: So 6. Dez 2020, 07:37
Wohnort: Berlin
Kontaktdaten:

Re: Floating Side Slider – Code Generator

Ungelesener Beitrag von Tommy Herrmann »

Moin,

nur mal zur Info.

Kennst Du eigentlich die Bootstrap-Komponente "offcanvas" für so eine Sidebar:

https://getbootstrap.com/docs/5.2/components/offcanvas/

Da braucht es nicht viel mehr als die vom Framework Bootstrap existierende:

class="offcanvas"

Es gibt noch einen Haufen fertiger Optionen von Bootstrap zur Sidebar, wie die Position (links, rechts, oben, unten) oder ob zum Beispiel der Seiteninhalt scrollen darf oder wie man diese Sidebar schließen kann oder ob man diese z.B. als Menüleiste verwenden will. Da benötigt es dann auch kein extra JavaScript und nichts was Bootstrap nicht ohnehin schon in Mobirise lädt.

Eigentlich macht die nichts anderes, ist aber natürlich auch gleich und automatisch mit allen responsiven Bootstrap-Eigenschaften ausgestattet.

Am Handy habe ich diesen seitlichen Button ausgeblendet (der gehört da eigentlich sowieso nicht dazu), weil der am Handy immer schrecklich aussieht und zu viel Platz einnimmt. Dort kann man die Sidebar dann über einen Button oder Link öffnen. Die Sidebar ist auch scrollbar, was ganz wichtig ist.

Das fehlt bei Deiner noch, da kann man den Inhalt nämlich nicht vollständig sehen, auch nicht am Laptop. So stellt sich das an meinem Laptop dar, den unteren Bereich kann ich weder sehen noch bedienen:

Sidebar von Volker.jpg


Hier hatte ich "offcanvas" → auf Deutsch "außerhalb der Leinwand" → mal vor Ewigkeiten ausprobiert, als Menü und als Sidebar:

https://www.mobirise-tutorials.com/Test ... erlay.html


Der Sidebar Generator

... selbst scheint ja prima zu funktionieren :tu:

Die CSS sollte man jedoch in den <head> einbinden und nicht am Ende des <body> platzieren. Außerdem wäre eine kurze Anleitung hilfreich, die erklärt, wie man aus dem fertig erzeugten Formular einen funktionierenden Mailversand einrichtet, da ein solches Formular in der Sidebar für viele von Interesse sein dürfte und wohl fast niemand wirklich weiß, wie man das machen muss.

Wenn Du magst, kannst Du dafür gerne mein automatisiertes E‑Mail-Skript verwenden oder darauf verlinken:

https://www.mobirise-tutorials.com/Form ... amisch.php
Volker
Moderator
Moderator
Beiträge: 1678
Registriert: Sa 12. Dez 2020, 22:35

Re: Floating Side Slider – Code Generator

Ungelesener Beitrag von Volker »

Menno :angst:

da denkt man, man ist fertig und dann kommt Tommy wieder um die Ecke :D

Muss ich die KI nochmal ran lassen, bin zwar geistig und auch real schon beim nächsten Script ( Wasserzeichen )

Ich kenn doch nicht jede Bootstrap classe Tommy, bin froh das ich ein bisschen PHP kann mittlerweile ;)

Aber mal zu Deinem Forumlar: Du als Sicherheits Fan hast da keinerlei captcha oder Mathe Aufgabe drin ? Oder kommt das noch ? Oder gibts da was was ich noch nicht kenne :D

Die Templates hat claude ai da rein gehauen, meine Ur Version war nur das man Text oder eben HTML eingeben kann, so wie im Video zu sehen ist. Das man dann dem Formular eine Form action geben muss, erwarte ich von den Leuten die es einbauen, das die es wissen. Das ist jetzt nicht unbedingt ein Tool für totale Laien.

Aber ich lass das ganze nochmals checken....
Volker
Moderator
Moderator
Beiträge: 1678
Registriert: Sa 12. Dez 2020, 22:35

Re: Floating Side Slider – Code Generator

Ungelesener Beitrag von Volker »

Hab den Slider jetzt überarbeitet.
Schau mal auf meiner Seite Tommy, jetzt geht der Slider bei kleinen Monitoren ganz weg

https://www.niederastroth.de/
Benutzeravatar
Tommy Herrmann
Site Admin
Site Admin
Beiträge: 7971
Registriert: So 6. Dez 2020, 07:37
Wohnort: Berlin
Kontaktdaten:

Re: Floating Side Slider – Code Generator

Ungelesener Beitrag von Tommy Herrmann »

Ja - so ist es gut - nur der Button steht jetzt zu wenig vor (ist fast weg).

Jetzt scrollt auch der Inhalt von der Sidebar, so soll es sein :tu:
Antworten

Wer ist online?

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