WordPress adding divs and removing spaces

  • Wonderful Wanderings

    (@wonderful-wanderings)


    9 years, 9 months ago

    Hi,

    I’m using <div class=”content-2-col-left”> and <div class=”content-2-col-right”> to make colums on this page:
    http://wonderfulwanderings.com/test/

    It works well for what is simply text, but as soon as I add images, things get messed up.
    I first added all the images and the text without creating the columns in the visual editor. Then checked the preview to make sure all the images were aligned properly etc because the problem is that when they are nicely under each other in the preview, they’re all messed up in the visual editor, so you have to check in the preview and then adapt stuff in the visual editor.
    Either way, I got them all perfectly underneath each other and then added the columns just like I did for the other parts of the page, only that seemed to mess up how the images were aligned.
    Suddenly images were glued to the text above or titles (the links in blue) were split up one part before and one part after the image…
    All seemed fine in the text editor, so I had to change stuff in the visual editor.
    I know you’re not supposed to switch between the two, but it was the only way I could drag the images to where they needed to be.
    Of course as soon as I switched back to edit, wordpress had inserted a bunch of divs and other columns.
    So the question is: how can I make sure that both my text and my images look good in two columns without wordpress messing everything up?
    I could do this part of the page last and everything else before, but I’m guessing the problem will recur each time I add something to the travel gear list:/

    By the way: I really don’t understand why using both editors at once is still such a problem in WordPress.

Viewing 2 replies - 1 through 2 (of 2 total)
  • Moderator Jan Dembowski

    (@jdembowski)

    Forum Moderator and Brute Squad

    9 years, 9 months ago

    By the way: I really don’t understand why using both editors at once is still such a problem in WordPress.

    I’m sorry but if you use the post editor, Visual or text, to apply raw HTML then yes it will mung and otherwise abuse your HTML. Always has and I don’t recall why. I’m 99.999% sure that’s not going to change anytime soon.

    So the question is: how can I make sure that both my text and my images look good in two columns without wordpress messing everything up?

    That really depends on what and how exactly you are trying to accomplish. For example if you wish to insert columns into a post or page using the post editor then a short code plugin would work best.

    Give this presentation from @bluelimemedia a look, it has some very good examples.

    http://www.bluelimemedia.com/wcyvr-2013/#/

    In those examples you can see that Christine uses short codes to control the columns starting at slide 6.

    Thread Starter Wonderful Wanderings

    (@wonderful-wanderings)

    9 years, 9 months ago

    Hi, thanks for responding.
    I found a way to make it work using solely the text editor.
    The problem wasn’t with the columns (I have a shortcode for that), but with the image formatting.
    I’ll close this off as I seemed to have found a workaround.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘WordPress adding divs and removing spaces’ is closed to new replies.