Title: [Plugin: Section Widget] Different UI Widgets Last modified: August 19, 2016 --- # [Plugin: Section Widget] Different UI Widgets * [apatheticresistance](https://wordpress.org/support/users/apatheticresistance/) * (@apatheticresistance) * [16 years, 9 months ago](https://wordpress.org/support/topic/plugin-section-widget-different-ui-widgets/) * Hi, I am interested in implementing section widget as an Accordion, rather than a Tabs widget. From the jQuery UI documentation, I can tell that the markup is different for each widget. * Could you point me to the right place in your code where I could alter things a bit to get the accordion working? Or if you think it is unfeasible, please let me know your opinion about that too. * Thanks! Trevor * [http://wordpress.org/extend/plugins/section-widget/](http://wordpress.org/extend/plugins/section-widget/) Viewing 3 replies - 1 through 3 (of 3 total) * Thread Starter [apatheticresistance](https://wordpress.org/support/users/apatheticresistance/) * (@apatheticresistance) * [16 years, 9 months ago](https://wordpress.org/support/topic/plugin-section-widget-different-ui-widgets/#post-1187903) * So I found that section-widget-tabbed.php around lines 35-60 has some code for outputting the html content. * I managed to re-write this so that it matches the example on the jQuery UI Accordion page (h3 heading + div content). * Unfortunately I haven’t found how to make the javascript work on the new html, though. * I looked at section-widget.js, which is quite short. I tried changing $(‘.swt- wrapper’).tabs() to $(‘.swt-wrapper’).accordion({ header: ‘h3’ }) but it doesn’t work. * Any help with this next step would be amazing. Thanks! * [godfreykfc](https://wordpress.org/support/users/godfreykfc/) * (@godfreykfc) * [16 years, 9 months ago](https://wordpress.org/support/topic/plugin-section-widget-different-ui-widgets/#post-1188012) * Hi apatheticresistance, * It’s funny how my co-worker suggested me to implement the same thing a couple of days ago, so you might see that comes built-in in future versions 😉 * But you are on the right track though, all you need is add the relavent CSS. I would suggest you to disable the build in styling (choose “bring my own stylesheet”), then download the accordion CSS from jqueryui.com * Good luck! * Godfrey * Thread Starter [apatheticresistance](https://wordpress.org/support/users/apatheticresistance/) * (@apatheticresistance) * [16 years, 9 months ago](https://wordpress.org/support/topic/plugin-section-widget-different-ui-widgets/#post-1188057) * Hi Godfrey, * Yes, it would definitely be great to see other formats in the next Section Widget. * Just to share with anyone interested, I figured out what was missing from the equation. I did indeed download the Accordion CSS, and added that into the mix. I used the jQuery UI Themeroller, which is awesome. * But there was actually another step I think I needed to do. I think that your plugin only includes the jQuery for tabs, and so I had to be sure to include the full jQuery UI library in my templates, or at least the accordion javascript. * I added this to my , before wp_head() is called: wp_enqueue_script(‘jquery- ui-core’); * And it works! Viewing 3 replies - 1 through 3 (of 3 total) The topic ‘[Plugin: Section Widget] Different UI Widgets’ is closed to new replies. * 3 replies * 2 participants * Last reply from: [apatheticresistance](https://wordpress.org/support/users/apatheticresistance/) * Last activity: [16 years, 9 months ago](https://wordpress.org/support/topic/plugin-section-widget-different-ui-widgets/#post-1188057) * Status: not resolved ## Topics ### Topics with no replies ### Non-support topics ### Resolved topics ### Unresolved topics ### All topics