[PunBB]Portal Modul transparent

[Necrow]

Sers,
wie bekomme ich es hin das auf der Portal Seite mein Modul transparent ist?

Es sollte eigentlich so aussehen wie auf dem Bild.


Zu PunBB Foren hab ich leider nix gefunden.

[Günther]

Ebenfalls sers,

transparent sind deine Module bereits:


Was du auf dem Screenshot siehst, wird mit "Halbtransparenz" bezeichnet und kann derzeit nur über eine halbtransparente Grafik umgesetzt werden, wenn du dasselbe Ziel browserübergreifend erreichen möchtest.
Dazu solltest du die betreffenden persönlichen Indexmodule ohne Standardaufstellung (manche sind ja absolut platziert, z.B. Google Translator, und sollten davon ausgenommen werden) in eine Klasse setzen und ihnen dann in deinem Stylesheet eine halbtransparente Hintergrundgrafik zuweisen:

Code:

.KLASSENNAME {
  background-image: url("BILDURL HALBTRANSPARENTE GRAFIK");
  background-repeat: repeat;
}

Nähere Infos/Angaben dazu findest du über eine Suche nach transparen* oder halbtransparen* sowie auf CSS-Websites wie http://www.css4you.de/.
Solche Themen werden in diesen Quellen noch detaillierter erklärt, und weil du damit persönliche Indexmodule ohne Standardaufstellung ansprechen möchtest, kannst du selbst HTML/CSS-Zuweisungen setzen, die nicht speziell auf PunBB bezogen sind. Ich bin mir sicher, dass du dich damit nun beschäftigen kannst.

Liebe Grüße
Günther

[Necrow]

Danke Günther,
ich werd mal ein bissl rumprobieren.

[Günther]

Bitte.

Ist das hier damit erledigt oder gibst du mir noch eine Rückmeldung?

[Necrow]

ich schau grad noch irgendwie will das net so wie es soll.

Also ich muss ein Modul erstellen. Name z.B. Wilkkomen2
Dort dann mein Inhalt reinschreiben
und dann im css stylesheet folgendes eintragen:

Code:

.Willkommen2 {
  background-image: url("http://i17.servimg.com/u/f17/15/52/31/99/logo10.jpg");
  background-repeat: repeat;
}

Ist das so richtig oder ist irgendwas verkehrt weil es tut sich nix.

[darkgronaddel]

Da Günther gerade nicht online ist, melde ich mich.
Ich vermute es liegt an deiner Grafik.
Deine Grafik sollte auch halbtransparent sein. Wenn ich mir diese ansehe, ist sie es nämlich nicht.

[Necrow]

Ich wüsste jetzt nicht wie man ein Bild halbtransparent macht.
Ich arbeite mit Paint.net da kann man ja in der Ebene die Deckfähigkeit
ein stellen, aber wenn ich die von 255(standart) auf 127 stelle und dann abspeicher, wird das Bild ganz normal gespeichert.

[darkgronaddel]

Du musst die Grafik dann als "PNG" abspeichern und am besten auch bei einem anderen Bilderhoster hochladen, da Servimg.com da gerne mal Probleme macht.

[Necrow]

Also ich hab es mit Imageshack und Directupload probiert,
immer das selbe Ergebniss. Tut sich nix

[Günther]

Dazu solltest du die betreffenden persönlichen Indexmodule ohne Standardaufstellung (manche sind ja absolut platziert, z.B. Google Translator, und sollten davon ausgenommen werden) in eine Klasse setzen und ihnen dann in deinem Stylesheet eine halbtransparente Hintergrundgrafik zuweisen

"In eine Klasse setzen" ist nicht dasselbe wie:

Also ich muss ein Modul erstellen. Name z.B. Wilkkomen2

Hast du denn unter http://www.css4you.de/, wie ich es dir empfohlen habe, dazu mal nachgesehen?

Da dir in diesem Bereich (HTML/CSS) offenbar die Grundlagen fehlen, machen wir es ein wenig anders.
Du erstellst die Module mit der Einstellung
Die Standardaufstellung nutzen: Ja,
fügst darin wie gewohnt deinen Inhalt ein und trägst den CSS-Code dann folgendermaßen in dein Stylesheet ein:

Code:

.module.main .main-content {
  background-image: url("URL HALBTRANSPARENTE GRAFIK");
}

Das wird dann alle Indexmodule betreffen, die du als persönliche Module erstellt hast (inkl. Standardaufstellung) sowie jene, die bereits als Standardmodule zur Verfügung gestellt werden.
Ich denke, das ist für dich wesentlich einfacher umzusetzen und führt genauso schnell zum Ergebnis.

Zu beachten ist noch, dass die Grafik auch tatsächlich halbtransparent ist. Das bedeutet: Mit einem Grafikprogramm wird die Deckkraft auf z.B. 40-50% reduziert, sodass sie teilweise transparent (= durchlässig) ist. Dahinter sollte ein Alphakanal zur Transparenz festgelegt werden und ein dafür fähiges Format wie PNG gewählt werden.
Darkgronaddels Hinweis ist insofern sehr gut, dass Servimg unter gewissen Umständen (zu hohe Grafik-/Dateigröße, Skalierung...) die Transparenz nicht korrekt wiedergibt. Deshalb hat sie dir andere Bilderhoster zu diesem Zweck. empfohlen.
Wie du mit GIMP eine Halbtransparenz erzeugen kannst, findest du unter einer Googlesuche nach GIMP Halbtransparenz heraus, z.B. in diesem Suchergebnis:
http://docs.gimp.org/de/gimp-using-web-transparency.html
Deine aktuell verwendete Grafik ist nicht passend verarbeitet worden.

[Necrow]

ok danke, ja das mit dem Bildhostern hatte ich ja befolgt, auf
Directupload hat es funktioniert mit der halbtransparenz.

Ok so reicht das erstmal, dass einzige was mich ein wenig stört ist das die statistik mit betroffen ist aber naja hauptsache es klappt einiger maßen.

[Günther]

Das klang bisher aber anders:

Also ich hab es mit Imageshack und Directupload probiert,
immer das selbe Ergebniss. Tut sich nix

ok danke, ja das mit dem Bildhostern hatte ich ja befolgt, auf
Directupload hat es funktioniert mit der halbtransparenz.

Aber wenn du es jetzt hinbekommen hast, freut mich das natürlich.

Deiner Eingangsbeschreibung habe ich entnommen, dass du alle Portalmodule mit dem halbtransparenten Hintergrund versehen möchtest. Wenn nun das Statistik-Portalmodul davon ausgenommen werden soll, dann ergänze einfach diesen CSS-Eintrag:

Code:

.module.main:last-child .main-content {
  background-image: none;
}

Solange du das Statistik-Modul an derselben Stelle belässt, ist nämlich ein HTML-Eingriff nicht nötig und du sparst dir etwas Arbeit.

Passt es so?

[Necrow]

Ja das passt so, gibt es auch noch die möglichkeit das man den rahmen von der chat box in eine bestimmte Farbe machen kann?
Ansonsten hast du bzw ihr mir sehr geholfen dafür nochmal ein dickes dank.

[Günther]

Gern geschehen.

Zu deiner Frage bzgl. des Chatbox-Rahmens muss ich dich darauf hinweisen, dass bei uns pro eigener Frage auch ein getrennter Thread nötig ist. Verwende zuvor aber bitte die Suchfunktion.
Da deine Eingangsfrage zu deiner Zufriedenheit gelöst wurde, schließe ich hier als ab.
-closed-