DevDmBootstrap3

Twitter Bootstrap 3 WordPress Starter Theme for Developers

Home Community Tips and Tricks Reording sidebars for mobile view

Tagged: , ,

This topic contains 0 replies, has 1 voice, and was last updated by  danny 5 years, 12 months ago.

  • Author
    Posts
  • #401

    danny
    Keymaster

    Someone asked on the WordPress support forums about how to do this.

    Here was my response.

    Hey Retrokevin,

    I did some messing around and came up with this. Keep in mind I’m not a JS wizard.

    You’ll need to create some files in your child theme (if you don’t have them already) to follow along here.

    functions.php
    /js/reorder-sidebars-mobile.js

    In your functions.php you want to enqueue the script

    In your reorder-sidebars-mobile.js file you can use this code

    The first function sets the “order” when the window is loaded. Moves the left column on top of the right column if mobilewidth threshold is hit.

    The resize function will ping every time the window is re-sized. I “think” this is triggered with a screen rotation so we are doubling up to cover all our bases. It will also put the left sidebar back when the threshold is detected as no longer hit.

    Hope this helps!

    • This topic was modified 5 years, 12 months ago by  danny.

You must be logged in to reply to this topic.