Please follow these steps:
- First make a custom sidebar from the wplms->sidebar manager.
- Now this sidebar will appear in appearance->widgets: Now add buddypress course search widget in the sidebar.
Make sure your location is enabled from the wplms->course manager->enable course manager.
- Now go to home page in backend and add new full screen stripe column below layer slider and use sidebar content in it,
- Now edit the content and fill the content as per the screenshot,
- In the last screenshot, use the following css code:
@media (min-width:991px){.search_stripe.stripe{
position:absolute;
top:30vh;
width:90%;
}}
@media (max-width:768px){
.scontent {
display:none;
}}
.scontent {
margin-left:130px;
background:rgba(255, 255, 255, 255);
}
.scontent ul li {
max-width:200px;
padding-left:10px;
}
The final Output:
