Lightbox in image posts

Home Forums Automattic Photo Blog Lightbox in image posts

Tagged: ,

Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • #164777 Resolve

    a k wala

    I’ve seen this in many themes and am asking the question here because Photo Blog is a theme that comes close to what I want.

    On posts of the Gallery format, clicking/tapping on an image shows the image expanded, and/or scaled to fit the visible part of the page, in a lightbox (example).

    However, if the post is of the Image format, clicking/tapping on the image does not show it in a lightbox. The image in such a post can therefore not be expanded for a better view in the case of landscape images (example). If the image is a portrait image (example) it often extends beyond the visible part of the page and therefore can’t be seen in its entirety without the lightbox.

    This is an odd omission for a theme for photographs. Is there a way to make an image in a post of the Image format appear in a lightbox?

    The blog I need help with is dmql8.wordpress.com
    #164778

    Kathryn P.
    Happiness Engineer

    Hi there! The carousel (what you refer to as the lightbox) is only available from images within galleries. This isn’t a theme limitation, but the way carousels work – they are tied to the gallery functionality.

    There is a way in the WP Admin dashboard to create a gallery with a single image that will open in a carousel. Here are the steps:

    1. Go to https://dmql8.wordpress.com/wp-admin/

    2. Go to Posts > Add New
    https://dmql8.wordpress.com/wp-admin/post-new.php

    3. Click “Add Media”

    4. Click “Create Gallery”

    5. Click “Media Gallery ” to select an already uploaded file from your Media Gallery, or click “Add New” to upload a new one.

    6. Click the blue “Create New Gallery” button.

    7. Click the blue “Insert Gallery” button.

    8. Click “Publish” or “Update” to save the post.

    You should now have a single image that opens in a carousel.

    Let me know how it goes.

    Also just a heads-up that since your site has a Premium plan, you’re entitled to live-chat and email support, accessible here:

    https://wordpress.com/help/contact

    You’re welcome to still post in these forums, but those other support avenues may be faster, and you’ll always get a staff reply.

    #164780

    a k wala

    Thanks @kathrynwp. That worked for me.

    However, I noticed a discrepancy in the size of portrait images when the post/gallery has a single image. Compare the size of these galleries:

    1. with a single portrait image;
    2. with a single landscape image;
    3. with portrait and landscape images.

    The post (#1) with the single, portrait image (gallery), seems to be the only one showing the image in full size.

    #164781

    a k wala

    … here are the post links to compare — can’t preview/edit reply :(

    1. with a single portrait image;
    2. with a single landscape image;
    3. with portrait and landscape images.
    #164783

    David

    Hi there,

    The post (#1) with the single, portrait image (gallery), seems to be the only one showing the image in full size.

    Right, so when you insert a single portrait image, it will occupy more vertical space than a landscape image.

    This is because the theme limits how wide the images can be. It doesn’t allow a single landscape image to appear as tall as a portrait image. That landscape image would need to be significantly wider than the content area allows if it were to match the height of the portrait image. In that case, you’d have to scroll horizontally and vertically to see the whole image on most screens, which wouldn’t be ideal. Instead, it just lets it go as wide as the content area, and that results in a shorter height.

    As for the gallery with multiple images, the gallery just tries to fill the width of the content area while showing all of the images. So it’s essentially always trying to occupy the most width possible while also showing the image(s) on the page.

    Let me know if that helps.

    #164786

    a k wala

    Thanks for explaining, David.

    This is because the theme limits how wide the images can be. It doesn’t allow a single landscape image to appear as tall as a portrait image.

    So the width is limited but not the height — I haven’t seen any theme that limits the height of single portrait images, so it must be not be doable or particularly challenging to do.

    #164787

    David

    Hi again,

    So the width is limited but not the height

    Yep. The site is basically trying to keep the height/width proportions of the original image. So if you imagine that you are stretching a landscape image to be longer, it will also get taller. It just can’t do that because the site doesn’t let it get wider in order to also get taller.

    I haven’t seen any theme that limits the height of single portrait images

    It may be possible, but since we tend to scroll vertically, it’s more common to let images be as tall as they can be so long as they don’t cause the visitor to need to also scroll horizontally.

    #164794

    a k wala

    I get why pages need to avoid requiring horizontal scrolling, and that the width of images is limited for that reason.

    For text, vertical scrolling isn’t an issue, generally speaking. An image, however, should be visible in its entirety, which is often not possible with a portrait image, as is the case with my post #1 above. This is why I think a portrait image should, ideally, be scaled so that all of it is within the visible part of a page. In order to have that happen currently, a portrait image has to be in a gallery and, if it’s the only image in the gallery, then it takes an additional click to launch the carousel to see the image in its entirety.

    #164798

    David

    Hi again,

    An image, however, should be visible in its entirety, which is often not possible with a portrait image

    The best way to achieve this would be to insert the portrait images at a smaller size. In that case, you won’t need to insert them as their own galleries. Instead, you’ll be able to use the editor’s controls to choose from a few different image sizes. In doing so, you can still link the images to their full sized versions for people who would like to view them that way.

    #164801

    a k wala

    The best way to achieve this would be to insert the portrait images at a smaller size. In that case, you won’t need to insert them as their own galleries. Instead, you’ll be able to use the editor’s controls to choose from a few different image sizes.

    Ah! Good to know. So far, all my posts have been imported from Tumblr, so I haven’t seen all the options when creating a new post. Thanks again for the info.

    #164803

    David

    You bet! Happy to help.

Viewing 11 posts - 1 through 11 (of 11 total)

You must be logged in to reply to this topic.