pragmaMx Support Forum

pragmaMx => Themes & Design => Thema gestartet von: reddragon am 28 Dezember 2012, 02:12:17

Titel: In pmx-blank die Blöcke unterschiedlich gestalten?
Beitrag von: reddragon am 28 Dezember 2012, 02:12:17
HI,

lassen sich im "pmx-blank" die Blöcke unterschiedlich gestalten?

Wenn ich mit den Quelltext ansehe, dann ist theoretisch festgelegt, wo sich welcher Block befindet.

Zitat<div class="block block-l-0-bid-20">
<div class="block block-l-1-bid-2">
<div class="block block-l-2-bid-9">
<div class="block block-l-3-bid-10">
<div class="block block-l-4-bid-11">
<div class="block block-l-5-bid-12">

das hier sind die linken Blöcke, "l" für links, dann die Zahlen für die Nummerierungen, die auf der HP zu sehen sind und zum Schluss die jeweilige Block-ID.

Ist das eine potentielle Schnittstelle, oder findet das demnächst Umsetzung?
Titel: Re:In pmx-blank die Blöcke unterschiedlich gestalten?
Beitrag von: Andi am 28 Dezember 2012, 12:43:35
Hi :)

jop, das ist die Schnittstelle zum individuellen Gestalten einzelner Blöcke per CSS.
Du kannst jeden Block, entweder über seine Block-ID, oder über seine Position in der Themespalte per CSS ansprechen.

Beispiele:


/* die Überschrift des dritten (Zählung beginnt bei null) Blocks
  in der rechten Spalte mit blauem Hintergrund versehen */
block.block-r-2 .block-title {
  background-color: blue;
}

/* bei dem Block mit der ID 32 den Hintergrund des Inhalts rot färben*/
block.bid-32 .block-content {
  background-color: red;
}



Diese Möglichkeit ist in den meisten neuen Themes in ähnlicher Weise eingebaut...
Titel: Re:In pmx-blank die Blöcke unterschiedlich gestalten?
Beitrag von: reddragon am 01 Januar 2013, 15:52:52
Alles klar :thumbup:

Das bedeutet also, dass ich, wenn ich 3 Blöcke in grün haben möchte, zwei in Rot und einen in blau, dass ich dann für jeden Block die CSS "einzeln" ansprechen muss, denn ansonsten kommt die Standardfarbe?


block.block-r-2 .block-title {
   background-color: blue;
}

block.block-r-4 .block-title,
block.block-l-7 .block-title,
block.block-r-7 .block-title {
   background-color: gruen;
}

block.block-l-1 .block-title,
block.block-l-2 .block-title {
   background-color: rot;
}