Tip:
Highlight text to annotate it
X
Okay, let's look at creating this other lightbox content promo content type and again we're
going to, it's the same one each time, create section promo lightbox image, and the previous
one, the lightbox, was actually not an image, it was the video, and then this one we're
actually going to input the image and you'll be able to click and see that in a larger
size. So, I'm just going to say this is test promo lightbox image. I'm going to give it
a default block placement tag and select one of the homepage positions so that'll line
up next to the one I had previously input. I'm just going to browse and find my image,
and if I upload that, I'm going to get an alt text field, which again I need to fill
that out just for accessibility reasons so I believe these are students in anthropology
class. That's also going to output when the image displays in the lightbox, it's going
to output as a caption. Promo title, some type of promo header for this block. In the
promo summary, this is where you know some additional information to entice visitors
to click and I probably want to be clear that this because it's styled very much like the
video one and it's going to be styled like the click and actually go to another page
so you probably want to put something in here, click on image to see at a larger size, or
something to that effect. Maybe I want to put this in bold so it stands out a little
bit more. Okay, I'm going to go down here. I'm going to pick section home page promo
two which will be that second slide over, and so when I save this, and I go back to
the home page by clicking on testing group two and I roll down here. Now that I've got
that image placed where I want it on the page in that second position, when I click on that,
again I'm going to get the lightbox overlay that pops up. Again, because of this sort
of resolution image where I'm trying to get this large enough where you can see it, the
image is not displaying as large as it normally would. Again, we covered this when I was going
over photo gallery and sort of how the lightbox works at this resolution. At more of a, you
now, a normal resolution, you're going to see that image again displayed significantly
larger as an overlay when you click on the promo window. So, that's basically how section
promo with lightbox image works, and another thing just real quickly to complete the thought
on the promo with lightbox image, I went back and substituted out that four by three image
for a three by four, a vertical image because I wasn't 100 percent sure what would happen
but kind of what I suspected is and as you can see here it's taken that three by four
image and hopefully you can tell how it's rendering here but it has constrained and
squeezed those proportions or distorted those proportions so it's taken the three by four
image and making it fit at four by three and we don't want to do that. It just basically
corrupts the proper proportions of the image. So don't use the three by four image on any
of these promo blocks that are set up to be preformatted at four by three and that's basically
going to be this one and the next one we'll talk about which is section promo linked to
URL or section promo with URL.