Extra space before and after a gallery

  • Author
    Posts
  • #876792

    cravingthis
    Member

    When I insert a gallery into my post, there are extra lines before and after my text. I am doing shift + enter for all returns. I can get rid of the extra lines before the gallery, but not after. I tried to press delete and backspace to remove the lines in Visual mode, but when I view the post, the extras space is still there.

    I’m not familiar with HTML editor, but if someone can tell me where to go and how to delete what’s necessary, or some other workaround, that would be great.

    My theme is twenty eleven.

    The post is in private mode so I’m not able to enter the url here.

    Note: I googled for this issue and came up with some solutions for wordpress.org, which is not useful as I have wordpress.com and I didn’t understand the coding they suggested.

    Thanks in advance!

    The blog I need help with is cravingthis.wordpress.com.

    #876964

    jackiedana
    Member

    I have a hunch what’s happening is that you’re getting some extra nonbreaking spaces inserted into the posts.

    Go into your HTML view and look for extraneous instances of the following code:

     

    You can remove them pretty much at will. Conversely, if you want to force an extra line, adding one can be helpful too.

    #876966

    jackiedana
    Member

    Let’s try this again. Look for the following code:

     

    #876967

    jackiedana
    Member

    hah, I haven’t ever typed the character into the forum.

     

    #876976

    justjennifer
    Moderator

    If in the HTML Editor you aren’t seeing those non-break spaces that jackiedana mentioned, it’s quite possible that the extra space is coded into the theme’s style sheet (CSS) for the Gallery feature. If so, you would have to purchase the Custom Design upgrade to tinker with the spacing and a working knowledge of CSS is recommended before upgrading.

    #877033

    justpi
    Member

    It might also be possible to tinker with the spacing in the HTML editor, but we can’t tell that without a link to the post in question.

    #877112

    cravingthis
    Member

    I think it must be the theme, I don’t see any extra spaces otherwise, I can live with it as is.

    Thank you.

    #877116

    cravingthis
    Member

    Hi everyone, well, I thought I could live with the extra space, but it just looks awful to me. I checked for the code ” ” under the HTML editor and didn’t find any. I also noticed an extra line between my gallery and the first sentence where the white space occurs, so while in HTML (which is very new to me), I deleted the extra space. I also use shift+enter for all my hard returns. Those steps didn’t worki.

    Here is the link:

    I am using twenty eleven theme. Can someone confirm if I do have to purchase the Custom Design upgrade? I’d like to know if there is a work-around, but I am not experienced with HTML.

    Thanks!

    #877117

    cravingthis
    Member

    Sorry, I did include the link but it doesn’t seem to be appearing?

    Here it is again:

    http://cravingthis.wordpress.com/2012/05/07/bobbette-belle-review/

    #877118

    justpi
    Member

    The extra space after a gallery is part of the default styling of the theme. You can counter it by enclosing the gallery in a div with negative bottom margin (in the HTML post editor):
    <div style="margin-bottom:-1.4em;">[gallery]</div>

    Change the number to adjust the space.

    #877119

    cravingthis
    Member

    Would you mind to explain it more for me, I am at a loss with HTML, codes, etc.
    You suggested to enclose the gallery with your code.

    Would I copy the code given before “gallery” and then the remaining after the “gallery”

    Thanks again

    #877121

    justpi
    Member

    If you switch the editor to HTML, you’ll see this:
    [gallery]

    Replace it with the code I gave above.

    #877122

    cravingthis
    Member

    It deleted a bit more of the white space. Thank you so much!
    I’ll keep the code on hand for my next gallery inserts.

    Thanks also for explaining it in simpler terms for me!

    I’m curious, for those that are very new to codes and HTML, do they just keep a list of codes on hand (that they’ve found) and it’s just knowing where to insert them?

    #877123

    justpi
    Member

    You’re welcome.

    Yes, when you’re a beginner you probably start with collecting useful bits of coding. But that’s comparable to a phrase book with phrases of a language you don’t speak: little by little you need to start understanding what each word means, and start understanding the grammar, till you get to the point where you can build your own phrases. This article of mine might help you get acquainted with the basics:
    http://wpbtips.wordpress.com/2012/02/05/introduction-to-html-for-wordpress-com-users/

    #877125

    justjennifer
    Moderator

    Actually, bookmark that entire site. You’ll be coming back to it often. :)

    #877126

    cravingthis
    Member

    I did, thanks again!

    #877130

    cravingthis
    Member

    I’m starting to think I need an upgrade! I currently have the twentyeleven theme.

    While the code for deleting some white space worked perfectly (thanks again justpi), when I insert multiple galleries (which I just learned by using the include/exclude codes), I’m getting the white space again.

    I can’t delete [gallery] since I am now entering a different code all together, such as:
    [galleryexclude=“1128,1129,1130,1131,1132,1133,1134,1135,1136,1137,1138,1139,1140”]

    Could someone tell me if I’m just stuck with extra white space while using multiple galleries in one post, if there is a workaround, or I’m asking too much (lol) and I’ll have to look at an upgrade?

    Thanks again!

    #877131

    cravingthis
    Member

    I meant to add that I’m not able to add a link as my post is still in edit/private mode.

    #877136

    justpi
    Member

    This is the basic form of the gallery shortcode:
    [gallery]

    It means insert a gallery here, with default settings ( = all the images that are attached to the post, thumbnail size, three columns).
    You can change the settings, by adding the appropriate commands inside the brackets. Examples:
    [gallery columns="2"]
    ( = insert a gallery here, but display the thumbnails in 2 columns instead of 3 )

    [gallery size="full" columns="1"]
    ( = insert a gallery here, but display full-size images in one column )

    [gallery exclude="1128,1130"]
    ( = insert a gallery here, but exclude those two images )

    But all these are just different versions of the same shortcode. So think of my code like this:

    <div style="margin-bottom:-1.6em;">
    GALLERY SHORTCODE HERE
    </div>

    By the way, having to find and use so many image ID numbers is a very tedious way to insert multiple galleries. After I see your post I can suggest alternatives. (Do you want the carousel slideshow that shows up when you click on gallery images or not?)

    #877137

    cravingthis
    Member

    Hi justpi, wow, thank you for taking the time to provide all those codes.

    I was so proud to learn the include/exclude code, but it is a pain! I have too many pictures and the hover feature to “see” the picture I.D. doesn’t work for me, I have to click on each image to get the I.D #, then sort them all out on a word document, edit the code and then insert.

    I tried uploading the second gallery in another published post to get the ID of that post and use it in the post I want with this:[gallery id="NUMBER_HERE"]. I found this method to be way easier, however, I’m left with several posts that are marked private, but I can see them on my homepage, which is an eyesore for me. I tried to google for a way to hide them from my view, but I don’t think there is.

    You mentioned the carousel, is that the same as the slideshow? I would like the pictures to show in columns. Yes, I would love to know some shortcuts!

    I just wanted to add that I’m grateful for your help, along with timethief and others. I’m slowly figuring things out …. and couldn’t have reached this far without the forum support members!

The topic ‘Extra space before and after a gallery’ is closed to new replies.