Trick # 487 | Dieser Beitrag beinhaltet 594 Wörter. – Geschätzte Lesezeit: ca. 3 Minuten.
Das Portfolio, welches Sie mit dem filterbaren Portfolio-Modul des Divi-Themes erstellen können, zeigt die Kategoriefilter standardmässig als Button. Wenn Ihnen ein Dropdown-Manü besser zusagt, können Sie es auch als solches darstellen. Wie’s geht, zeigt dieser Trick.
Von Haus aus werden die Filter im filterbaren Portfolio-Modul als Buttons dargestellt. So wie nebenan:
Um die Ansicht auf ein Dropdown-Menü umzugestalten, benötigen Sie das folgende Script, welches Sie in den <head>-Bereich Ihrer Website integrieren. Unter Divi/Theme-Optionen/Integration:
<script>
jQuery(document).ready(function($){
$('.et_pb_portfolio_filters ul').each(function() {
var $select = $('<select />');
$(this).find('.et_pb_portfolio_filter a').each(function() {
var $option = $('<option />');
$option.attr('value', $(this).attr('data-category-slug')).html($(this).html());
$select.append($option);
});
$(this).prepend($select);
});
$('.et_pb_portfolio_filters select').each(function() {
$(this).on('change', function() {
var selectedFilter = $(this).val();
$(this).siblings().find("[data-category-slug='"+selectedFilter+"']").trigger('click');
});
});
$('.et_pb_portfolio_filters ul li').hide();
});
</script>Sogleich werden die Filter statt nebeneinander als Dropdown-Auswahl angezeigt:
Werbung
Das Divi-Theme verfügt über ein filterbares Portfoliomodul, mit dem Sie eine Liste von Projekten nach Kategorien filtern können. Standardmässig werden zunächst alle Kategorien angezeigt. Wenn Sie stattdessen eine bestimmte Kategorie als ...
Wenn Sie im Divi-Theme die Sidebar mit Widgets bestücken, ist oft nicht ganz klar, wo das eine Widget endet und das nächste beginnt. Mit ein wenig CSS können Sie ganz mühelos eine Trennlinie zwischen den Widgets anlegen.
Vielleicht haben Sie in Ihrem Divi-Theme Module, Zeilen oder gar ganze Sektionen, welche Sie nach dem Zufallsprinzip anzeigen wollen. Ein Headerbild vielleicht, das bei jedem Seitenaufruf zufällig erscheint oder ein Handlungsaufruf (Call to ...
Das Divi-Theme wird mit einem Blog-Modul geliefert, mit dem Sie eine Liste von Beiträgen an beliebiger Stelle auf Ihrer Website anzeigen können – komplett mit einem Bild, einem Auszug und einer Schaltfläche, um weiterzulesen. Wenn Sie noch eine ...
Keine Inhalte gefunden.
Werbung
