1. Home
  2. Knowledge Base
  3. Customizations
  4. CSS
  5. Hide the Course Banner on Mobile View

Hide the Course Banner on Mobile View

Introduction

By default, BuddyBoss does not provide a built-in option to hide the LearnDash course banner on mobile devices. If you want to improve the mobile learning experience by removing the course banner on smaller screens, you can do so using a custom CSS snippet.

Custom Workaround

Follow the steps below to hide the course banner on mobile view only:

  1. Go to BuddyBoss > Theme Options
  2. Under Custom Codes, enable CSS
  3. Append the following code:
@media screen and (max-width: 767px) {

    .bb-learndash-banner {

        display: none;

    }

}

  1. Save changes

Note: Any modifications are considered as custom work already. Know more about our Support policy here: https://buddyboss.com/support-policy/

Troubleshooting and FAQs

Q: Will this hide the course banner on desktop as well?

A: No. This CSS only applies to screens with a maximum width of 767px, which targets mobile devices.

Q: Does this affect all courses or just a specific one?

A: This will hide the course banner on all LearnDash course pages when viewed on mobile devices.

Q: The course banner is still visible on mobile. What should I do?

A: Try clearing your site cache and browser cache. If the code is not working, submit a ticket to the support team for assistance.

Q: Can I target tablets separately from mobile phones?

A: Yes. You can adjust the max-width value in the media query to better match your desired screen sizes.

Was this article helpful?

Related Articles

Subscribe to Our Newsletter

Stay In Touch

Subscribe to our Newsletter, and we’ll send you the latest news from BuddyBoss

This field is for validation purposes and should be left unchanged.
This field is hidden when viewing the form

To speak to our Agency consultant, fill in the form found at our Contact Page.