WordPress 5 – All About Image Blocks – Gutenberg Tutorial Series


(gentle music) – [Instructor] Hello everybody and welcome to our mini-series on WordPress 5.0, Gutenberg Blocks. So what I’m gonna talk about today is just the different
types of image blocks so that you can see how they work. So what I’ve done is I’ve
pulled up a post here and I’m just gonna go ahead
and click the add button and I’m going to add an image. And I already have some
pretty cool water images here. So I’m just gonna grab one of these, and then what you can do with these is you’ve got a lot of settings. So you can left align,
you can center align, you can have your text
right above and below where the image is a little wider or you can have it go full width, which this is a new feature
which is really awesome to not have to use CSS
to make this happen. The other thing and I’m just gonna add just some text in here just so that it breaks things up a bit. But what I’m gonna do is I’m
going to actually add in, I’m actually gonna add a cover block. So a cover block is going to allow you to add text on top of your block. So I’m going to grab something
that will look kind of cool, and we’re gonna make this full width. And then I can just say
California Vacation. And then this is just, when you see how this comes out, your settings are gonna be the same as far as if you wanna left align, right align, center, something
a little wider or full width. But what it’s going to do is allow you to put this text on top, which is another phenomenal
feature that we’re seeing. I just added a little bit more text just to kind of break things up a bit. And then I’m just going… So now I’m gonna use the
other method of adding blocks. I’m gonna add a gallery, and so that way you can see the different settings that you have for galleries. So now we can pick a bunch of pictures. I’m gonna create a new gallery, and you can caption
these images if you want. And you can see how the captions work. But the cool thing
about this is we’re able over on the other side to
adjust the number of columns. How the images get cropped. So you can say crop images
or don’t crop images. You can link it to the media
file or an attachment page. And you can also still adjust your settings as far as left align, right align, full width. So then what we’re gonna do is we’re just gonna preview this. Those are your different image types. So you’ve got your full screen
image, your block of text. You’ve got your cover image. And then you’ve got your gallery. Now if I wanted to come
in here and just adjust some of these settings, like this. Then what you would
get is just your image, your full cover and then your gallery. So no matter how you slice it, no matter what your settings are, you get to have a lot more control over the way your images display
in what you’re working on. And that is your images

One Reply to “WordPress 5 – All About Image Blocks – Gutenberg Tutorial Series”

  1. Im trying to make clickable links on individual pictures inside of the gallery .

    If not insert images and align them like a gallery. How can I do this?

Leave a Reply

Your email address will not be published. Required fields are marked *