Posting Labels to Images
-
Dear NextGen,
How does one post labels to images in NextGen Gallery? I am able to upload my images to the webpage, but cannot figure out how to post labels above them, like “Image A” or “Image B” etc.
Thanks,
John
-
@egshow.tv – Have you tried using the “captions” template with the NextGEN Basic Thumbnails display type? This will render the image description below the thumbnails. If you wish to display the “title” above the thumbnail you will likely need to create a custom template that suits your needs.
Thanks!
– Cais.
Hi,
I tried the captions template under gallery settings but I am unable to achieve a text description under the photo, nothing happens.
I would like my photo gallery to look like this one:
http://wpbugs.com/wp-content/uploads/2012/04/ngggallery-new-layout.png
Please advise.
Thanks,
John@egshow.tv – Are you using the “captions” template for the specific gallery display you want them to appear in? Please see your other topic for reference on setting that option.
Thanks!
– Cais.
Hello,
I was able to add the captions under the images. Thanks!
But now I am facing two new problems:
1. I need to add a couple spaces below each image caption to so page is easier to read, otherwise it is difficult to decipher which caption goes with which image. I am following the model below:
http://wpbugs.com/wp-content/uploads/2012/04/ngggallery-new-layout.png
2. Also, I cannot center my gallery in the middle of the page. It sits on the left margin by default and won’t go to the center.
Please help!
@egshow.tv – The first item might be accomplished with a custom template and/or custom CSS … the second item is commonly sorted out with custom CSS. Try something like the following:
/** Center Basic Thumbnails */ .ngg-galleryoverview { text-align: center !important; } .ngg-gallery-thumbnail-box { float: none !important; display: inline-block !important; }Thanks!
– Cais.
Cais,
Thanks for your help. I was able to get the thumbnails centered but I can’t seem to build a gap between thumbnail rows. Here is the CSS code I am using; it’s probably wrong:
<img class=”ngg_displayed_gallery mceItem” src=”http://egshow.tv/nextgen-attach_to_post/preview/id–218″ alt=”” data-mce-placeholder=”1″;
float: none !important; display: inline-block !important;/>Please help!
John
@egshow.tv – The
<img>tag is a placeholder and should not have inline styles applied to it (aside from them not being used by NextGEN Gallery at all in this case).You would need to use custom CSS that applies to the rendered display.
– Cais.
Dear Cais,
Sorry to bother you again about this but I still cannot achieve the desired results. I am trying to get my photo gallery to look like the following image below, with centered photos and a gap between rows, as in the example:
http://wpbugs.com/wp-content/uploads/2012/04/ngggallery-new-layout.png
Is this possible in NextGen Gallery? I am at a loss as I cannot get my photo gallery to look like the example.
I am completely new to wordpress and do not have a background in webpage design.
and don’t know CSS custom codes. Please provide instructions and CSS required, if known.Thank you,
John@egshow.tv – What does your gallery display look like now?
– Cais.
Here is the link to my page:
http://egshow.tv/page-d-featured-artist/
You’ll see under the “Art Gallery” that Image #5 has multiple forward slashes under it implemented by me to create a gap between the two image rows, which is the look I am going for, as by default the two rows of photos are directly on top of one another.
How can I create a space between the two image rows with using slashes?
Thanks,
JohnHow can I create a space between the two image rows WITHOUT using slashes?
@egshow.tv – Using the Google browser’s developer tools you can see this element as one to consider applying custom CSS to:
#ngg-gallery-362-123 > br:nth-child(6)This is very specific to your site and this particular display … but you should be able to extend it as necessary for other similar displays on your site.
– Cais.
Thank you. I’ll give it a go~
John
@egshow.tv – you’re welcome!
– Cais.
Cais,
I have a bit of a problem. The CSS code you gave me didn’t create the gap I was hoping for between the gallery rows — Images #1 – #5 are right on top of Images #6 – #10.
http://egshow.tv/page-d-featured-artist/
Please advise.
Thanks,
John
The topic ‘Posting Labels to Images’ is closed to new replies.