6.1. Agenda-Listing Unterschiedlicher Look nach Sessiontyp

„Best“- Practice

1. Im CPT (Custom Post Type) SESSION/Agendapunkt wird unter dem Sessiontitel der Sessiontyp (Keynote/Pause,Breakout,,..) gepflegt.
   Das kann man auch differenzierter definieren, indem man (unter Menüpunkt: Indivduelle Felder die Optionen Platin, Gold, Silber,… einrichtet) die entsprechende Klasse anklickt. Zu Vorführzwecken kann man dann beispeilsweise auch 2 Variantnen wie platin und platinlila zur Auswahl stellen.
2. Im JET-Listing des Agendapunktes definiert man im Spaltenobjekt (siehe 2.Bild) unter ERWEITERT die Klasse. Diese ergibt sich aus dem Prefix (Vorher) pxsessiontyp_ , der unter Erweitert angegeben werden kann und dem ACF (Advanced Field ) Sessiontyp per Klick auf das Werkzeug/Zange-Symbol. Nun steht in dem äßeresn DIV-Conatiner in class=“pxsessiontyp_platinlila“ (oder was man definiert hat) Dazu wurde noch eine ID definiert pxSession und im Sessiontitel die ID pxSessiontitel
3. Unter Design→Customizer→Zusätzliches CSS kann nun die Hintergrundfabe oder eine Hintergrundverlauf in Gold, Platin,… die Rahmenfarbe, der rahmentyp und gegebenenfalls eine Plakette hinter den Sessiontitel konfiguriert werden.
   siehe https://codepen.io/bradyfe/pen/gxVYLm für silberne ,goldige Farbverläufe

#pxSession.pxsessiontyp_platinlila
{
border:8px ridge #ccbbff;
color: #8000ff;
box-shadow:
7px 7px 0.9em rgb(115, 1, 191, 0.55),
}

#pxSession.pxsessiontyp_gold
{
color: rgba(82, 82, 34, 0.72);
text-decoration: none;
font-weight: bold;
text-shadow: 1px 1px 0 #ffdeca;
box-shadow:
2px 2px 0.5em rgba(155, 122, 89, 0.55),
inset 1px 1px 0 rgba(255, 255, 255, 0.9),
inset -1px -1px 0 rgba(0, 0, 0, 0.5)
;
border: 2px solid #dd9933;
background:
-moz-linear-gradient(
-72deg,
#ffdea1,
#ffffff 16%,
#ffdea1 21%,
#ffffff 24%,
#ffdea1 27%,
#ffdea1 36%,
#ffffff 45%,
#ffffff 60%,
#ffdea1 72%,
#ffffff 80%,
#ffdea1 84%,
#736445
);

}

#pxSession.pxsessiontyp_platinum #sessiontitel div.jet-listing-dynamic-field__inline-wrap:after
,
#pxSession.pxsessiontyp_platinlila #sessiontitel div.jet-listing-dynamic-field__inline-wrap:after
{
content: “;
background-image: url(„/wp-content/uploads/sponsors/Sponsor-Platinum.png“) ;
background-size: 30px 30px;
display: inline-block;
width: 30px;
height: 30px;
content:““;
transform: scale(.7);

}