Wanneer een pagina erg lang is, verdwijnt de zijbalk bij het scrollen en ziet de pagina er minder netjes uit. Dit artikel beschrijft hoe je plakkerige widgets kunt gebruiken om dit probleem te voorkomen.

Een Nieuwe Plakkerige Widget Aanmaken

Maak eerst een partial aan in de map layouts/partials. Laten we layouts/partials/custom/sticky-info.html als voorbeeld nemen.

1<div class="row card component position-sticky" style="top: 84px;">
2    <div class="text-center py-3 px-1">
3        MY STICKY WIDGET
4    </div>
5</div>

De bestandsnaam custom/sticky-info kan naar wens worden gewijzigd, maar we raden aan specifiekere namen te gebruiken om te voorkomen dat de partials van het thema later worden overschreven. Zoals custom of mywidgets.

Gebruik vervolgens de hook layouts/partials/hooks/sidebar-end.html om de plakkerige partial op te nemen.

1{{- partial "custom/sticky-info" . }}

De plakkerige widget moet de laatste widget van de zijbalk zijn, anders kunnen er vreemde problemen optreden.

Een Bestaande Widget Plakkerig Maken

Elke widget heeft een unieke klassenaam, zodat we CSS kunnen toepassen op een gewenste widget. Laten we de profielwidget als voorbeeld nemen.

1.sidebar {
2    .profile {
3        position: sticky !important;
4        top: 84px;
5        order: 5;
6    }
7}

We moeten de eigenschap order opgeven om de profielwidget de laatste widget van de zijbalk te maken.