Online Kurs: Einheitliches Design der Kurs-Vorschau Boxen (Social E-Learning)

Die Social E-Learning Plattform bringt ein eigenes, modernes Kurs-Design mit sich. So sieht bspw. die Übersicht aller Kurs so aus:

Um die Kurs-Übersicht Darstellung benutzerdefiniert anzupassen (bspw. wenn nur die Kurse angezeigt werden sollen, in welcher der Benutzer eingeschrieben ist) kann aber auch der Kurs-Shortcode [ld_course_list] genutzt werden. Allerdings weicht dessen Standarddesign leicht von dem der Social E-Learning Plattform ab:

Um beide Darstellung zu vereinheitlichen, können wir über einen eigenen CSS-Code die Darstellung der Shortcode Ausgabe von [ld_course_list] anpassen.

Über diesen CSS Code blenden wir die Kurs-Beschreibung sowie den Kurs-Button aus:

/* make course overview with ld_course_list shortcode the same design as on the course-archive page (social e-learning) */
.ld-course-list-content.grid-view .ld-course-list-items .bb-card-course-details .entry-content,
.ld-course-list-content.grid-view .ld-course-list-items .bb-card-course-details .ld_course_grid_button {
    display: none !important;
}

Füge diesen Code im Backend deiner Spreadmind Plattform unter "Community" > "Theme Optionen" unter </> Individuell beim CSS Code ein.

Dadurch erreichen wir, dass die Shortcode Ausgabe identisch ist zu dem moderenen Kurs-Design der Social E-Learning Plattform:

Der Shortcode [ld_course_list] kann nun noch zusätzlich um den Parameter col="4" ergänzt werden, sodass die Kurse ebenfalls in einem 4-spaltigen Raster dargestellt werden:

• [ld_course_list col="4"]