Hintergrund(bild) für Artikel

25.02.2021 11:00 (zuletzt bearbeitet: 25.02.2021 11:07)
avatar  Arvin
#1 Hintergrund(bild) für Artikel
avatar
Mitglied

Hallo Leute,

melde mich mal wieder mit einem kniffligen Anliegen.
Diesmal bitte ich jedoch darum es mir so zu erklären, wie wenn du es deiner Oma erklären würdest.

Bin nämlich kein Goldfinger im Programieren und auch nicht mit Tastatur zur Welt gekommen.
Eine schöne Anleitung, Schritt für Schritt zum Mitstricken wäre schön.

Also worum geht es mir nun ganz genau?
Ich möchte die Artikel, also das, wo ich auch hier grad drin schreibe
mit einem transparenten Hintergrund versehen.
Also so, dass die Schrift über dem Bild liegt und gut zu lesen ist.

________________________________________________________________________________

Wie das mit dem Bild transparent machen geht, weiß ich und stelle es gerne gleich für jene, die über dieses Thema stolpern mit vor.

Es ist ganz einfach. Du möchtest ein schönes Bild als Hintergrund haben, um dann später darüber deinen Text zu schreiben.
Hierfür bearbeitest du das Bild, was du verwenden willst, mit folgendem Online-Programm: https://www.peko-step.com/de/tool/alphachannel.html -
1. Datei hochladen -
2. unter dem Bild Opazität Pfeil verändern
3. auf Anwenden klicken
4. speichern mit rechter Maustaste auf Bild... voilà!

_______________________________________


 Antworten

 Beitrag melden
25.02.2021 11:51
avatar  Mike48
#2 RE: Hintergrund(bild) für Artikel
avatar
Mitglied

Meinen Erachtens ist das falsche herum. Das Bild soll doch in den Hintergrund. Warum sollte ich es durchsichtig machen?

Soll das Bild in die Beiträge oder soll es als Forenhintergrund dienen?

Welches Templates?


www.friends-of-xobor.de (621181 - V4 Template)
www.seniorenclub-sel-koeln.de (578865 - V6 Template)

 Antworten

 Beitrag melden
25.02.2021 12:07 (zuletzt bearbeitet: 25.02.2021 12:09)
avatar  Mike48
#3 RE: Hintergrund(bild) für Artikel
avatar
Mitglied

Hiermit kannst du ein Hintergrundbild in die Beiträge setzen.
//files.homepagemodules.de/b578865/pictures_u690_11b92f.jpg ist ein Beispiel. Hier musst du dein Bild eintragen.

1
2
3
4
5
 
.xquoteable {
background-image: url("//files.homepagemodules.de/b578865/pictures_u690_11b92f.jpg");
background-repeat: no-repeat;
background-size: 100% 100%;
}
 


Eintragen unter
Admin → Layout → CSS/SCSS → CSS / SCSS Addon


www.friends-of-xobor.de (621181 - V4 Template)
www.seniorenclub-sel-koeln.de (578865 - V6 Template)

 Antworten

 Beitrag melden
27.02.2021 05:53
avatar  Arvin
#4 RE: Hintergrund(bild) für Artikel
avatar
Mitglied

Danke dir Mike, werd ich gleich mal ausprobieren.


 Antworten

 Beitrag melden
27.02.2021 14:33
avatar  Arvin
#5 RE: Hintergrund(bild) für Artikel
avatar
Mitglied

Hallo Mike,

jetzt hab ich es probiert und es klappt. Herzliches Danke dafür.
Für jene, die sich das noch immer nicht so recht vorstellen können, hier mal zum Schauen.

Gäbe es denn auch die Möglichkeit, das Ganze auch so einzubauen, dass die Hintergrundbilder in einzelnen Artikeln eingefügt werden können? Bin halt neugierig.

L.G. Arvin


 Antworten

 Beitrag melden
28.02.2021 09:24
avatar  Mike48
#6 RE: Hintergrund(bild) für Artikel
avatar
Mitglied

www.friends-of-xobor.de (621181 - V4 Template)
www.seniorenclub-sel-koeln.de (578865 - V6 Template)

 Antworten

 Beitrag melden
28.02.2021 13:16 (zuletzt bearbeitet: 28.02.2021 13:23)
avatar  Mike48
#7 RE: Hintergrund(bild) für Artikel
avatar
Mitglied

Hintergrundgrafik in Beiträgen habe ich für die Benutzer noch etwas vereinfacht.

Admin → Layout → Iconbar

Icon anlegen und in die Liste nicht sichtbar verschieben



Neues Icon vom Type HTML anlegen.

Name: [hgimbeitrag1][/hgimbeitrag1]
HTML:

1
2
3
4
5
6
7
8
9
 
<script>
function inserthgimbeitrag1() {
var hg_url = prompt("Hintergrundbild Adresse eingeben:", "");
console.log("hg_url: "+hg_url);
return returnTag('[bg_img_1=background-image: url("'+hg_url+'" );background-repeat: no-repeat; background-size: 100% 100%;] [/bg_img_1]');
}
</script>
<div onclick="inserthgimbeitrag1()" class="xob_icon_cont"><img title="[Beitraghintergrund][/Beitraghintergrund]" alt="[hgimbeitrag1][/hgimbeitrag1]" class="xob_icon" src="//files.homepagemodules.de/b643516/a_54_9e2dfc33.png" >
</div>
 




So geht ein Dialog auf um die url für die Grafik einzugeben.

So kann man auch mehrere Hintergründe in einen Beitrag setzen. Zum Beispiel je Absatz.


www.friends-of-xobor.de (621181 - V4 Template)
www.seniorenclub-sel-koeln.de (578865 - V6 Template)

 Antworten

 Beitrag melden
28.02.2021 20:28 (zuletzt bearbeitet: 28.02.2021 20:30)
avatar  Arvin
#8 RE: Hintergrund(bild) für Artikel
avatar
Mitglied

Du bist ja brilliant Mike.
Hab vielen Dank für dein Engagement.

Gerade habe ich beides probiert,
es hat auch geklappt, habe nur folgendes dabei herausgefunden.

Mein gewähltes Templete: Xobor V6
Zusätzlich dazu das Plugin TinyMCE installiert
Dadurch konnte ich deine beiden Hinweise aus Beitrag 6 & 7 lediglich im Xobor - Talk der Textbearbeitung wiederfinden -
dort war es zwar wunderbar zu sehen, allerdings in beiden Fällen nicht umsetzbar
(mit der html Variante lief es besser, allerdings wurde das eingegebene Hintergrundbild nicht im Beitrag angezeigt)

Dennoch war es eine kleine Erfahrung des Erfolges!

Alles in allem habe ich mich jetzt entschieden, es so zu belassen,
wie ich es auf deinem ersten Tip hin zurückführen kann,
also behalte die Einstellung von einem Hintergrund für das ganze Forum.
Das fühlt sich gut für mich an.

Nochmals herzlichen Dank.

_________________________________________


 Antworten

 Beitrag melden
28.02.2021 20:51
avatar  Mike48
#9 RE: Hintergrund(bild) für Artikel
avatar
Mitglied

Das tinyMCE kann nicht alle BBC übersetzen. Das ist nun mal die Krux damit. Da ich den nie verwende weiß ich nicht wie das aussieht.


www.friends-of-xobor.de (621181 - V4 Template)
www.seniorenclub-sel-koeln.de (578865 - V6 Template)

 Antworten

 Beitrag melden
Bereits Mitglied?
Jetzt anmelden!
Mitglied werden?
Jetzt registrieren!