Random Hintergrundbilder

chris1278 · Beitrag von **chris1278** » 03.07.2021 22:03

69bruno hat geschrieben: 03.07.2021 21:53 was wird denn jetzt genau gemacht ? skaliert oder vervielfältigt ?

Also das bild wird zwar eingeblendet aber nach unten vervielfältigt. Und im bestenfalls sollte das Bild eben den Browser ausfüllen und der Foren Wrap sollte darüber hinweg scrollen. Das tut es leider nicht.

phpBB 3.0 Mods · Beitrag von **hackepeter13** » 04.07.2021 11:59

Also zu phpBB 3.0 Zeiten habe ich sowas mit dem php-Befehl mt_rand() gelöst.

In die funktions.php wurde die Zeile 'RANDOM_BG' => mt_rand(1, 8),

In der overall_header.html wurde dann an entsprechender Stelle bspw. dann style="background: url('{T_THEME_PATH}/images/random-bg{RANDOM_BG}.jpg') 0 0 no-repeat;" eingesetzt.

Die Bilder dazu wurden in dem images-Ordner als "random-bg1.jpg", "random-bg2.jpg", usw. bis 8 in diesem Fall abgelegt.

Wie und ob man das nun auch so in eine Extension für 3.2/3.3 einsetzen kann, weiß ich nicht.

chris1278 · Beitrag von **chris1278** » 04.07.2021 12:03

Das mag sein aber ich ändere nix in den Core Dateien dafür. Das ganze soll wenn auch über Extension laufen. Aber ich werde das mal anschauen evtl. bekomme ich das so hin.

Aber danke.

phpBB 3.0 Mods · Beitrag von **hackepeter13** » 04.07.2021 12:18

chris1278 hat geschrieben: 03.07.2021 22:03
Also das bild wird zwar eingeblendet aber nach unten vervielfältigt. Und im bestenfalls sollte das Bild eben den Browser ausfüllen und der Foren Wrap sollte darüber hinweg scrollen. Das tut es leider nicht.

Das sollte dann doch theoretisch nur noch eine Frage der CSS-Einstellung sein.
Gegen die Vervielfältigung hilft doch no-repeat für das Ausfüllen cover, zusätzlich gibt es auch noch fixed.
Bspw. für <html> oder <body>:

Code: Alles auswählen

background: url(images/bg.jpg) no-repeat center center fixed; 
-webkit-background-size: cover;
background-size: cover;

chris1278 · Beitrag von **chris1278** » 04.07.2021 12:37

Das Problem ist das mit css schwierig ist weil das Skript das direkt als style baum in den Code einbindet der sich nicht direkt mit css bearbeiten lässt.

Aber ich kann dir gern mal die erste Version meiner Extension zukommen lassen dann kannst dir das gern mal anschauen.

@edit Hackepeter

Also die methode mit dem mt_rand funktioniert auch noch in 3.3.4 ich mus jetzt nur noch sehen wie man das als extension umsetzen kann. das wäre super. weil diese Lösung viel einfacher wäre.

phpBB 3.0 Mods · Beitrag von **hackepeter13** » 04.07.2021 13:15

chris1278 hat geschrieben: 04.07.2021 12:37 Aber ich kann dir gern mal die erste Version meiner Extension zukommen lassen dann kannst dir das gern mal anschauen.

Das habe ich eben mal fix gemacht und folgende Änderung hat bei mir ein fixen Hintergrund erzeugt:

Im JS-Teil muss du nur document.write('<body style="background:url('+ hintergrund[x] +')">')
in document.write('<body style="background:url('+ hintergrund[x] +') no-repeat center center fixed;height:100%;">') ändern.

PS: height:100%; muss sein, weil das <body> standardmäßig im phpBB-Style keine Höhe zugewiesen bekommen hat und somit bei wenig/kurzem Seiteninhalt body schon vor dem unterem Browserrand endet (sprich wenn der Seiteninhalt nicht das ganzen Browserfenster füllt).
Problem ist nun dabei, dass das phpBB-Standardstyle bei .body ein padding: 12px 0; verwendet.
Ergo bei 100% Höhe, wird body 24px nach unten verlängert.

chris1278 · Beitrag von **chris1278** » 04.07.2021 13:28

ich werde das auch mal ausprobieren. und dann sehen welche variante sich besser umsetzen lässt. Aber danke für deinen Tip. Der war wieder mal Gold wert.

Also mit der mt:rand konnte ich es tatsächlich in einer ext lösen. Der einzige nachteil ist das ich dafür mit 2 events einen deit der overall header ausblenden mus und durch eine beue body zeile ersetzen mus.

Im Grunde hab ich über die Events:
overall_header_stylesheets_after.html <- Das direkte event vor dem befehl </head> blendet an dieser stell <!-- ein

overall_header_body_before.html <- Das direkte event nach besagter body Befehlszeile. Und mit diesem Event wird dann der neue Code geladen

diese Zeilen ausgeblendet:

Code: Alles auswählen

</head>
<body style="background: url('{T_THEME_PATH}/images/random-bg{RANDOM_BG}.jpg') no-repeat center fixed;" id="phpbb" class="nojs notouch section-{SCRIPT_NAME} {S_CONTENT_DIRECTION} {BODY_CLASS}">

durch diesen Code hier:

Code: Alles auswählen

-->
</head>
<body style="background: url('{{ T_EXT_IMAGERANDOM_THEME_PATH }}/images/random-bg{RANDOM_BG}.jpg') no-repeat center fixed;" id="phpbb" class="nojs notouch section-{SCRIPT_NAME} {S_CONTENT_DIRECTION} {BODY_CLASS}">

Somit wurde das eigentlich perfekt gelöst. Und man mus nur aufpassen falls sich in der overall_header.html bei einem Update hier was ändert:

Code: Alles auswählen

<body id="phpbb" class="nojs notouch section-{SCRIPT_NAME} {S_CONTENT_DIRECTION} {BODY_CLASS}">

das man besagte Änderung dann auch in der Extension übernimmt.

ich mus aber mal schauen ob ich aus dem anderen Schnipsel nicht eine Lösung mit Einfließen lassen kann der den style baum per document.write einbindet. mal schauen. Aber ich bin auf einem guten weg. Da ich ja jetzt mehrere Lösungwege habe.

69bruno · Beitrag von **69bruno** » 05.07.2021 10:39

Die Hackepeter-Lösung funktioniert mit der Änderung einer Zeile.....
Zumindest finde ich keinen Fehler......

chris1278 · Beitrag von **chris1278** » 05.07.2021 12:19

Hi Bruno. Ja aber die Lösung die ich jetzt umgesetzt habe mit diesem mt-rand wäre im eigentlichen sinne die besserer. weil diese JavaScript Lösung der ersten Version beim Untersuchen der Seite immer ne Meldung verursacht das diese Variante nicht mehr zeitgemäß und aktuell wäre. Daher denke ich das ich die mt-rand methode verwende. Das einzige was man eben dabei aufpassenmus sollte sich in besagter body zeile:

Code: Alles auswählen

<body id="phpbb" class="nojs notouch section-{SCRIPT_NAME} {S_CONTENT_DIRECTION} {BODY_CLASS}">

Hier das ist die aktuelle Original zeile. Etwas ändern dieses in der Extension auch anpasst.

69bruno · Beitrag von **69bruno** » 11.07.2021 17:41

Ich bin hier mal mit eingestiegen und versuche an der Lösung mitzuarbeiten.
Bisher haben wir ein funktionierendes php-script, welches zufällig ein Bild aus dem Extverzeichnis auswählt. Daraus generieren wir eine Url und übergeben die an's template.
Danach soll die url als hintergrundbild gesetzt werden,
Da stecke ich gerade fest, weil alle im Netz zu findenden Lösungen daran scheitern, dass der "body" nicht gefunden werden kann.

Kann das daran liegen, dass wir einen Event nehmen, der viel zu früh stattfindet, wo also noch gar kein body definiert wurde ?l

Welchen Event würdet Ihr nehmen, um den Hintergrund zu manipulueren ?

Nach der Eventliste liebäugel ich mit : forumlist_body_category_header_after

phpBB.de

Random Hintergrundbilder

Re: Random Hintergrundbilder

Re: Random Hintergrundbilder

Re: Random Hintergrundbilder

Re: Random Hintergrundbilder

Re: Random Hintergrundbilder

Re: Random Hintergrundbilder

Re: Random Hintergrundbilder

Re: Random Hintergrundbilder

Re: Random Hintergrundbilder

Re: Random Hintergrundbilder