WordPress.org

Ready to get started?Download WordPress

Forums

Collapse-O-Matic
[resolved] Unwanted Linebreaks W/O wpauto modification (6 posts)

  1. thirdpotato
    Member
    Posted 1 year ago #

    I'm also experiencing unwanted linebreaks after shortcode, in this case, collapse-o-matic. I've tried a multitude of WPauto workarounds, trying to get the code to load before the plugins, but it never seemed to work with certain plugins I've tried before.

    How can I stop the automatic linebreaks while I'm trying to put collapsable images next to each other?

    Example: http://tobylotak.com/testcast/

    The thumbnails should be side by side, not vertically stacked.

    http://wordpress.org/extend/plugins/jquery-collapse-o-matic/

  2. Baden
    Member
    Plugin Author

    Posted 1 year ago #

    Step 1: See if this issue has been addressed before in another thread.

    Next:
    Wrap each expand element in a div with a unique class. We used ‘birdwire‘ because it makes all the images nice and need in a row like… birds on a wire! Hmmm, maybe we should have used ducksrow. Anyway, each element will now look like so:

    <div class="birdwire">[expand title="<img src='http://example.com/image.jpg' />" trigclass="noarrow" alt="turtles one"]This is the content of the first image[/expand]</div>

    Final Step
    Add the following to your theme’s style.css:

    .birdwire {
    display: inline;
    float: left;
    margin-right: 1.625em;
    width: 160px;
    }
  3. thirdpotato
    Member
    Posted 1 year ago #

    Hello, that only sort of works. But now when I click it and it expands, it still adds a linebreak, thus making a weird jump when you click the icon: http://tobylotak.com/testcast/

    Also, in the thread you linked to, the person was asking about all the target content being in the same div, to which you replied "The only idea you might try, is to use the roll-your-own method and then group all the target divs together." I'm not sure if this is what I'm trying to achieve too, but basically to have the target content appear in the same place. How do you group all the target divs together? I think right now, each target information (the profiles for each character) I am adding <div class="collapseomatic_content" to each block of target content. Is this correct?

    Thank you for all your direct help so far. I greatly appreciate it, and it's well explained.

  4. Baden
    Member
    Plugin Author

    Posted 1 year ago #

    Yes, for your needs, you will want to use the roll-your-own method that is described in the documentation. This will allow you to place all your images in a nice row, and then after these... place your target content areas. Spend some time playing with the roll-your-own method and it should be quite easy.

    Let us know if you get it working!

  5. thirdpotato
    Member
    Posted 1 year ago #

    Yay thank you, I think I got it all up and running!

  6. Baden
    Member
    Plugin Author

    Posted 1 year ago #

    Great to hear! Don't forget to vote for Pedro!

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic