iyx-hoft-uan (TexBuilt — logo gallery block review)

Chris LaFay: Did it work?

Kate Marnik: Yeah.

Chris LaFay: Yay, Tastic. Okay, so I wanted to show you this. If I can pull up one of the 15 tabs that I have open. Here we go. Okay. So this one right there. So we got all these in and obviously some of them are a little bit larger than others because they have to get. They're getting cropped in different ways. So just depending on where they kind of fall within the wall, depends on how they get cropped. So what I wanted to ask you was, are you good with the way that these look?

Kate Marnik: I'm noticing that some of them like my logos. Some are smaller than others. So yeah. So I'll try and make that a little more uniform.

Chris LaFay: Do you want me to just make them all squares?

Kate Marnik: I mean, that could work. I'm fine with that.

Chris LaFay: Okay. It would. Because I'm realizing now, because we're gonna. The way that the way that the code is written is and very intentionally generic. You upload a number of images that you want to show and it crops them at slightly different crops just to make them feel different as they're kind of scrolling by. So it doesn't feel as uniform. But there also isn't a science behind it either. In terms of like the first image you upload will always be a square. It's about the total number of images. And it's basically long, square, square, long, square, square. And so and then it divides them up into two rows and puts them in. So there is.

Kate Marnik: Well, and that wouldn't be a problem if we didn't want logos on all of them. So which that would be a problem.

Chris LaFay: And that's. Nor the way that this block was built was that there wasn't text going to be on top of things. And so that's why this works on the text built site. But here with the logos, it's funky. So if you're okay with me making these all squares, can I actually. Is this possible to do? Give me one second. Can I just do this in. Yeah, I can actually. Hold on.

Kate Marnik: I know that we're probably not going to have these same photos forever, but this is still something we'd have to figure out soonish. Oh, hey, that's. That's awesome.

Chris LaFay: It's not saved. It's not saved there. It's. This is a temporary thing. But are you okay with that?

Kate Marnik: I. I have to ask Rebecca. I personally like that better since we're using the logos. I'm still noticing though that my logos, some of them are still bigger than others, I guess because all the images are different sizes.

Chris LaFay: Bingo. Exactly. So if what we can do. Let me actually do this one. Give me one second. Actually, they're all slightly. Let's get rid of that and then let's go. If we did this, it's going to mess up for one second here. So what we could do is for this in particular, and this is not going. This would not be the same. 420. 420. Yeah. Those are all the same. Okay. It's the same.

Kate Marnik: Better than the squares. Yeah.

Chris LaFay: There we go. So this will, this will be a deviation between the text, this site and all the other ones when it comes to this block. Basically the aspect ratio is one by one and a half.

Kate Marnik: Okay.

Chris LaFay: Extrapolate that, that aspect ratio out to whatever pixels you want.

Kate Marnik: Sure. Okay.

Chris LaFay: And so that's what that can be. And so all the images that you sent over, I'm not done a one by one by one comparison, but I'm assuming they're all slightly different dimensions and correct whatnot. So if you were to send over images that were one, one by one and a half and then you had them all the exact same pixel size and you put the logo in the same spot now, now it's all, now it's all samey samey for sure. The other websites that use this block will still have the, the long square square. Long square square.

Kate Marnik: Okay, that's perfect. Yeah, let's go with this for now. And you can even show her if you're like due to like talk to her about it. But in the back end I will go fix some photos and then re upload them. All of them, because I think they're all different sizes.

Chris LaFay: Yeah. So the, the dimensions that you want to shoot for, you want to double this, but it's a 420 by 280. But then double each of those numbers. So 420, doubled is 840. 280 Doubled is 560.

Kate Marnik: Okay.

Chris LaFay: Sorry, that was a very confusing way of getting to this.

Kate Marnik: That's totally okay.

Chris LaFay: But here we are. So if you, if you set your canvas to that size, toss all the images in, save them away, then you should be good to go at that point.

Kate Marnik: Got it. I am on that right now. So you will have that today.

Chris LaFay: Wonderful. That all sounds good. I will go ahead and get the aspect ratios coded out. So that's in there. Sorry for the back and forth on this. When you asked for the ratios in the beginning, I didn't process in my brain that logo placement when the images were stretched to fit into their thing would then. And. And get. It just didn't.

Kate Marnik: Well, and we. And we didn't know either. I mean, we didn't know till you put it in there. We're like, oh, yeah, okay. Yeah. No, some of the.

Chris LaFay: There's good things about moving quickly, there's bad things about moving quickly. So a lot of the stuff we've been doing has just been, hey, change this, change this, change this, and it's all good to go. But sometimes when you just move quick, sometimes things get missed. And so. So this is the third time you're doing this and this will be the last time you're doing this.

Kate Marnik: No problem. You're still doing the like giant lift. So I'm going with that.

Chris LaFay: There we go.

Kate Marnik: Perfect.

Chris LaFay: All that sounds good. Everything else is done. So really the last thing that's left is this. So once you get those images, I'll do the ratios and then I think the BLDR site's done, so.

Kate Marnik: I think so, yeah. As far as I know. I mean, I've been keeping up with all yalls back and forth and everything she's told me and giving me feedback and I'm like, I think that will be the last thing. So.

Chris LaFay: Fantastic. Cool. Well, shoot me an email when those are updated. Do you. What. What do you use to make those graphics? Are you doing AI to do that? Say what? Photoshop. Save them as. When you export them, save them as JPEGs.

Kate Marnik: Ah, okay.

Chris LaFay: And another note as well, when you export images and they're mostly just photos, there's a quality setting when you save out of Photoshop when you're doing JPEGs. And you can pretty much always reduce web images to medium quality.

Kate Marnik: Okay.

Chris LaFay: Now I have a tool that I use that goes through all of your things and has transferred them all. But I know you're doing a lot of website maintenance in the future. It's a good rule of thumb that the. So not this in particular, but in general, unless you're talking about a very large banner image. The maximum width that you ever need on any website right now is about a thousand pixels wide. JPEGs are great. The. There's a newer file type called webp, which was made by Google.

Kate Marnik: I've been seeing those a lot. Yeah, yeah, yeah.

Chris LaFay: WebP by default is a lot better on page load speeds. But if you are going to save it as a JPEG file, saving it as medium quality, it's basically the same.

Kate Marnik: Got it.

Chris LaFay: And you get a lot of file size savings with that. So you don't have to remember these things as we're building the site out. I don't care. I have a system to where you send me images and I plumble them all through before they get uploaded. That's all fine and dandy, but it's just a good thing to know if you're like, why is the page loading slowly? Maybe you uploaded PNG files that were too many.

Kate Marnik: Got it. Okay. Yeah. And the last place I worked out, we got a lot of complaints about that. So yeah, whatever we can do up front to make that faster the better.

Chris LaFay: So there are tools. People are like, well, websites should be smart now. They yes, there are tools that like take an Image Upload in WordPress and do all the conversions and this, then the other and blah blah. A lot of them do cost money. They're not expensive, but they do cost. But they do rely on a third party service to do it a lot of times. And if something breaks there, you probably don't know, blah, blah, blah. So it's just good to get into good habits at the beginning when you're saving stuff for sure.

Kate Marnik: Well, and chances are I'll be the one working on these going forward, so I should probably know that.

Chris LaFay: Yep, exactly. So awesome. That sounds good. Well, shoot me, shoot me an email when you have those done and in the folder. Much appreciated. And probably at some point tomorrow I'll get those updated. Updated. And going live with this site should actually be the click of a button because I think we're already in the bldr environment. So I think going live will literally just be like promote this website to production and it's done. So hell yeah.

Kate Marnik: Okay. Perfect.

Chris LaFay: Cool beans. Well, thank you for hopping on a Google Meet with me. I appreciate it.

Kate Marnik: Yeah, awesome.

Chris LaFay: Take care. Have a good rest of the day.

Kate Marnik: Thank you. You too. Bye.