Using to simply collapse a widget – problems

  • Resolved csburdick

    (@csburdick)


    9 years, 8 months ago

    Hi there, great plugin but having a problem. I’m trying to use this to simply collapse a widget menu. It’s obviously not an option (and I wasn’t able to find a plug in to do it,) so I kind of hacked it together a bit.

    I wanted one of my custom menus expand/collapsible to expand upon clicking the title. You can see it here at the bottom: pokersites(dot)us

    So technically it works but it looks like crap and could really use a simpler way than to paste in the source code.

    Also I’d like an arrow after the title to show it’s expandable.

    Could you please help me out?

    Thank you!

    https://wordpress.org/plugins/jquery-collapse-o-matic/

Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Author Baden

    (@baden03)

    9 years, 8 months ago

    Hmmm… so the State Pages widget… and you are using the roll-your-own method?
    The arrow is actually there, but is bing overwritten by your blue background. I think you will need some kind of special brand of CSS kung-fu to make this work as you want.

    Fret not, we’ll help point you in the right direction.

    Pro tip: Collapse-Pro-Matic comes with some advanced features that will be useful, kung-fu support, to be specific 🙂

    But, in the meantime, we’ll do what we can here.

    What exactly is the

    looks like crap

    part you want to un-crapify?

    Thread Starter csburdick

    (@csburdick)

    9 years, 8 months ago

    Perhaps “crap” was a bit harsh, but certainly “off” and maybe even “wonky” are pretty accurate. Basically if you look at the widget titles above that one, it’s different than how the Game Guides bit is being displayed. There’s an awkward light blue border around this one, and especially when expanded, looks a bit cut off on the right as if it’s being pushed over a bit. You’ll notice after expanding that the borders between list items and the li background [the arrow on the left] are pushed to the right about 20px or so compared to the others (the others don’t hit the right side, the Games Guides one doesn’t hit the left.) And for the light blue bit, it seems the content within the widget or whatever is encasing the whole thing, title and all. I’ll paste the code I’m using in a standard text widget:

    <aside id="nav_menu-5" class="widget widget_nav_menu">[expand title="State Pages" tag="h3" targclass="widget-title"]<div class="menu-states-container"><ul id="menu-states" class="menu"><li id="menu-item-3659" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3659"><a href="http://www.pokersites.us/legal/alabama/">Alabama</a></li>
<li id="menu-item-3660" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3660"><a href="http://www.pokersites.us/legal/alaska/">Alaska</a></li>
<li id="menu-item-3661" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3661"><a href="http://www.pokersites.us/legal/arizona/">Arizona</a></li>
<li id="menu-item-3662" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3662"><a href="http://www.pokersites.us/legal/arkansas/">Arkansas</a></li>
<li id="menu-item-3663" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3663"><a href="http://www.pokersites.us/legal/california/">California</a></li>
<li id="menu-item-3664" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3664"><a href="http://www.pokersites.us/legal/colorado/">Colorado</a></li>
<li id="menu-item-3665" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3665"><a href="http://www.pokersites.us/legal/connecticut/">Connecticut</a></li>
<li id="menu-item-3666" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3666"><a href="http://www.pokersites.us/legal/delaware/">Delaware</a></li>
<li id="menu-item-3667" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3667"><a href="http://www.pokersites.us/legal/florida/">Florida</a></li>
<li id="menu-item-3668" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3668"><a href="http://www.pokersites.us/legal/georgia/">Georgia</a></li>
<li id="menu-item-3669" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3669"><a href="http://www.pokersites.us/legal/hawaii/">Hawaii</a></li>
<li id="menu-item-3670" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3670"><a href="http://www.pokersites.us/legal/illinois/">Illinois</a></li>
<li id="menu-item-3671" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3671"><a href="http://www.pokersites.us/legal/iowa/">Iowa</a></li>
<li id="menu-item-3672" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3672"><a href="http://www.pokersites.us/legal/kansas/">Kansas</a></li>
<li id="menu-item-3673" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3673"><a href="http://www.pokersites.us/legal/kentucky/">Kentucky</a></li>
<li id="menu-item-3674" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3674"><a href="http://www.pokersites.us/legal/louisiana/">Louisiana</a></li>
<li id="menu-item-3675" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3675"><a href="http://www.pokersites.us/legal/maine/">Maine</a></li>
<li id="menu-item-3676" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3676"><a href="http://www.pokersites.us/legal/maryland/">Maryland</a></li>
<li id="menu-item-3677" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3677"><a href="http://www.pokersites.us/legal/massachusetts/">Massachusetts</a></li>
<li id="menu-item-3678" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3678"><a href="http://www.pokersites.us/legal/michigan/">Michigan</a></li>
<li id="menu-item-3679" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3679"><a href="http://www.pokersites.us/legal/minnesota/">Minnesota</a></li>
<li id="menu-item-3680" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3680"><a href="http://www.pokersites.us/legal/mississippi/">Mississippi</a></li>
<li id="menu-item-3681" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3681"><a href="http://www.pokersites.us/legal/missouri/">Missouri</a></li>
<li id="menu-item-3682" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3682"><a href="http://www.pokersites.us/legal/montana/">Montana</a></li>
<li id="menu-item-3683" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3683"><a href="http://www.pokersites.us/legal/nebraska/">Nebraska</a></li>
<li id="menu-item-3684" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3684"><a href="http://www.pokersites.us/legal/nevada/">Nevada</a></li>
<li id="menu-item-3685" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3685"><a href="http://www.pokersites.us/legal/new-hampshire/">New Hampshire</a></li>
<li id="menu-item-3686" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3686"><a href="http://www.pokersites.us/legal/new-jersey/">New Jersey</a></li>
<li id="menu-item-3687" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3687"><a href="http://www.pokersites.us/legal/new-mexico/">New Mexico</a></li>
<li id="menu-item-3688" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3688"><a href="http://www.pokersites.us/legal/new-york/">New York</a></li>
<li id="menu-item-3689" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3689"><a href="http://www.pokersites.us/legal/north-dakota/">North Dakota</a></li>
<li id="menu-item-3690" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3690"><a href="http://www.pokersites.us/legal/ohio/">Ohio</a></li>
<li id="menu-item-3691" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3691"><a href="http://www.pokersites.us/legal/oklahoma/">Oklahoma</a></li>
<li id="menu-item-3692" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3692"><a href="http://www.pokersites.us/legal/oregon/">Oregon</a></li>
<li id="menu-item-3693" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3693"><a href="http://www.pokersites.us/legal/pennsylvania/">Pennsylvania</a></li>
</ul></div>[/expand]</aside>

    I hope that helps. Thanks again.

    Thread Starter csburdick

    (@csburdick)

    9 years, 8 months ago

    And to clarify, that code was taken from the source code when I used a normal menu widget and displayed that menu, then I took the [expand] shortcode from the plugin and integrated it best I could find.

    Thread Starter csburdick

    (@csburdick)

    9 years, 8 months ago

    Just a friendly bump 🙂

    Plugin Author Baden

    (@baden03)

    9 years, 7 months ago

    Collapse-O-Matic no longer used on your site. Issue marked as resolved.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Using to simply collapse a widget – problems’ is closed to new replies.