Skip to:
Content
Pages
Categories
Search
Top
Bottom

BBP-Style-Pack change Forum Display for Mobile views


  • uksentinel
    Participant

    @uksentinel

    I use the BBP-Style-Pack and am looking to see if there is any CSS I can use to change Forum Display List from Horizontal to Vertical for Mobile views (devices)

    Ref: BBP-Style-Pack > Forum Display > Forum List > (Change to Column List)

Viewing 5 replies - 1 through 5 (of 5 total)

  • Robin W
    Moderator

    @robin-w

    not sure what you are after, it does exactly that on my test site.

    Link to an example please


    uksentinel
    Participant

    @uksentinel

    Hi Robin
    Your test forum I believe is arranged as bbp style pack > Forum Templates > Alternate Forum template 1
    My Forum is arranged as bbp style pack > Forum Templates > Default Forum Template > Click to Select
    Then under bbp style pack > Forum Display > (Item 1 checkbox is not Selected)

    My Forum presents all Forums in a horizontal format, which is great for views on Desktop / PC etc.
    But what I am looking to achieve is to change that horizontal format to a vertical format when somebody views my forums on a mobile device < 400 dpi.

    Horizontal View Mobile
    https://uktechhub.com/wp/wp-content/uploads/2024/08/horizontal-view.png

    Vertical View Mobile
    https://uktechhub.com/wp/wp-content/uploads/2024/08/vertical-view.png

    Horizontal View when bbp style pack > Forum Templates > Default Forum Template > Click to Select
    And looking to change this view to Vertical for mobile screens
    https://uktechhub.com/wp/wp-content/uploads/2024/08/horizontal-view-template-horizontal.png

    My Site URL: https://uktechhub.com/forums/


    Robin W
    Moderator

    @robin-w

    it works on both templates for me.

    so when I go to your last link (my site url) I see the forums in list view (NOT vertical) on both a laptop and a mobile.

    Do you see differently?


    uksentinel
    Participant

    @uksentinel

    I do not see differently, Currently I see list view for both Mobile and Laptop.

    Ideally looking to change only mobile view to VERTICAL so my Forum icons all line up exactly like Vertical View Mobile above.

    Hope that makes sense.


    uksentinel
    Participant

    @uksentinel

    So finally worked out how to achieve as above using the below CSS. and hopefully this helps others.

    Now just have to remove some pesky comma’s from sub forums list display that have appeared.

    /* small devices (phones, 400px and down) */

    @media
    only screen and (max-width: 400px) {

    a.bbp-forum-link {
    display : block !important ;
    }

Viewing 5 replies - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.
Skip to toolbar