Fragen und Antworten » Hintergrund(bild) für Artikel

25.02.2021 11:00 (zuletzt bearbeitet: 25.02.2021 11:07)

Arvin
#1 Hintergrund(bild) für Artikel

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à!

_______________________________________

https://neueweltcafe.xobor.de/

Antworten

Beitrag melden

#2

25.02.2021 11:51

Mike48
#2 RE: Hintergrund(bild) für Artikel

Mike48

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 - Template kann wechsel bei Pluin Tests)
www.seniorenclub-sel-koeln.de (578865 - V6 Template)

Antworten

Beitrag melden

#3

25.02.2021 12:07 (zuletzt bearbeitet: 25.02.2021 12:09)

Mike48
#3 RE: Hintergrund(bild) für Artikel

Mike48

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 - Template kann wechsel bei Pluin Tests)
www.seniorenclub-sel-koeln.de (578865 - V6 Template)

Antworten

Beitrag melden

#4

27.02.2021 05:53

Arvin
#4 RE: Hintergrund(bild) für Artikel

Arvin

Danke dir Mike, werd ich gleich mal ausprobieren.

https://neueweltcafe.xobor.de/

Antworten

Beitrag melden

#5

27.02.2021 14:33

Arvin
#5 RE: Hintergrund(bild) für Artikel

Arvin

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

https://neueweltcafe.xobor.de/

Antworten

Beitrag melden

#6

28.02.2021 09:24

Mike48
#6 RE: Hintergrund(bild) für Artikel

Mike48

So wie hier?
Hintergrundgrafik in Beiträgen

www.friends-of-xobor.de (621181 - Template kann wechsel bei Pluin Tests)
www.seniorenclub-sel-koeln.de (578865 - V6 Template)

Antworten

Beitrag melden

#7

28.02.2021 13:16 (zuletzt bearbeitet: 28.02.2021 13:23)

Mike48
#7 RE: Hintergrund(bild) für Artikel

Mike48

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 - Template kann wechsel bei Pluin Tests)
www.seniorenclub-sel-koeln.de (578865 - V6 Template)

Antworten

Beitrag melden

#8

28.02.2021 20:28 (zuletzt bearbeitet: 28.02.2021 20:30)

Arvin
#8 RE: Hintergrund(bild) für Artikel

Arvin

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.

_________________________________________