/* Comments or code */
/* */
				
			

Video Summary

Alright, we are talking about comments and comments is a great feature to use when we are working within WordPress. Because when when when we’re working with other people’s themes, by the time everything’s said and done, it’s not going to be unheard of that you might have 100 to 1000 plus lines of CSS code that you put into changing and transforming your, your WordPress website. Now, that might sound like a lot, but it’s really not. If you have a space with nothing on there, that’s considered a line technically, right? And we’re gonna have a lot of sections that we’re gonna be going through. And if we think about the progression of when you build a website, you’re gonna start off and you’re gonna build one page and you’re gonna build another page, and you’re gonna build another page. And then you might have to go back and edit something on another page. So we’re gonna have is, is this big string of, you know, elements, classes, IDs that we’ve been targeting and manipulating to for our stones that we want. So we want to use the the common for is to explain to ourselves or another potential developer coming in that this series of declarations and these properties and values are transforming this section or transforming that feature. Or transforming this element. 

And that’s, that’s gonna help you out in the long term, to be able to go in and decipher because what happens if what happens if you styled your whole website, and now you want to change button color, and you set up in the CSS and now you might have to go and sift through 100 or 1000 lines of code that you’ve written, and try to figure out where you use or where’s that element, you know, residing. And another thing we can use this comment for, is to be able to take away certain certain declarations to say what happens if we take this out? What does that look like and without having to delete it, and then retype it back out? So I think, but So, before we get in here, I’ll just talk about the syntax real quick. Everything that you have a forward slash and asterisk and then at the end of the whenever you have anything in here comments or code and then have an asterisk and then forward slash, anything in between here will not get read by the compiler. So what does that mean? So that means when the machine that’s reading your code, and that’s putting onto the screen for the user when it comes to anything that’s in between these two aspects won’t get read. So it’ll make more sense when we have more we’re going to code them. 

So I’m gonna sit and go off of this last example. What if you think about what when we’re going through this whole course and we were typing out, you know, multiple different, we’re targeting multiple different elements. We have maybe, you know, five or six or seven lines of code that you know, after a while, this will add up. I mean, this is just one paragraph. Imagine if we were manipulating say 50 different elements, how long is this? How long is this? 

I don’t know how many lines but you have on your CSS document, right? So what we want to do is say, so we have this as the red class and what originally we’re calling this to say this was read or the background was read and for the green paragraph, we originally column this green, but now we come down here and this P is overriding that. So when we might want to do is if and then here you can go and just hit Ctrl or Command and if you put in the forward slash, that automatically opens that up for you and does the same thing in WordPress. So what you’d have to do is now we just type in anything we want you know, this is over. Override, have the blue back background. 

And the other thing too is you can take this and you can go to the next line the next line it does not matter. You could have a full paragraph here if you wanted to the compiler or the machine that’s reading this will never read this. So what’s nice is that when we’re in your editing in the CSS editor on WordPress, and we’re scrolling through we’re gonna be able to just you know you could invoice but you could do too is you could even just take this and do it blue override, right, or you can say page Card button right or homepage, top image. So that way when you’re scrolling through, you go okay, this is the section that I’m going to use or that I use to style that homepage top image. And let’s just kind of hop over to lead or the Lincoln site real quick. And I just choose this billboard They call this the billboard home slider, right? So this is what we’re seeing here. But if we look over here on the CSS that they have, this is just how much CSS that they have that is getting read by this section. So just imagine that’s just one section. And we’re not going to be able to we’re not coding everything from scratch. But if you have a 1020 30 page what are three pages on your site, including blog articles, you know, you might have styled certain things that so the blog URL, cool, looks good, so that this contact form looks good. I want the same contact form but it will look different on a different page, right? So after a while, you’re going to have a ton of you’re gonna have a ton of code and this is a great way to remain organized. 

And Norway where we can use this common code to is is what happens if I want to just see what this what these paragraphs look like with how a white color for the tax for the font. So you go here and now we can we can just within one button can easily just go back and forth and see what happens if we don’t have a 25% width. Now we can go well, that looks like you know that doesn’t look great. And what you can do too is like let’s say if we want to change the different borders, we were debating between two different border colors. So let’s do two pencils, solid, and let’s do that. 

Maybe orange isn’t a color. Oh no, I gotta put a semicolon at the bottom. Right. So now what we can do is we can go here so what does that look like? And you can pretty much hold Ctrl or Command and a forward slash array by an array of array below the question mark. Going to just keep doing that. You know, I don’t know which one I like. Just, that’s just a really cool way just to be able to go back and forth. If you’re debating between two different stylings, you know. So that is just the power of comments. we will be using this to keep organized in our CSS And our CSS editors and WordPress. and we might be using this just to go back and forth and see which you know which properties are going to look better. So that being said, let’s hop on to the next section.