WDD LIVE 076: Website Rescue! The Race to Rebuild “Artisan Scapes”

More about this video

Agenda

A family friend recently reached out about their company’s website that was built and subsequently abandoned by the freelancer/agency who was supposed to be managing it. It’s not built on WordPress and the forms are down and all leads have stopped. Can we use ACSS and Frames to do a rapid website rescue and get them back up and running? Tune in to find out!


Join me LIVE every Tuesday at 11am Eastern for in-depth web design and development critiques, plus spur-of-the-moment mini-tutorials based on our discussion!

WANT TO GET YOUR SITE CRITIQUED? SUBMIT YOUR URL AT https://geary.co/critique-application/

Through the critique process, you’ll learn tips, insights, and best practices for things like:

  • UX Design
  • UI Design
  • Technical SEO
  • On-Page SEO
  • Copywriting
  • Content Marketing
  • Conversion Optimization
  • Offer Strategy
  • Technical Development Best Practices w/ DOM Inspection
  • And more!

Video Transcript

Hello hello hello hello welcome back to another wdd live it is tuesday sarah is in the house we got marcus sharon mackie uh jason welcome welcome curtis derek wp dev jim good to see you guys uh throw up a like on the stream when you arrive drop a comment in the chat say hi we are pretty much going to get right into action today uh here’s the agenda essentially uh one of my one of my assistant softball coaches uh who’s also a friend has a landscaping company and the agency or freelancer whoever it was he hired to do his website apparently this was a while back um kind of yeah it’s like nowhere to be found right and his website’s not working it’s not getting leads it’s um i i went to it it’s i’m i’m sure i’ll show it to you in a second it’s obviously uh the bare minimum was done this is like just this is kind of like a standard experience you know when i when clients come to me and they’re like yeah this company did our website you know we we really need it to be better whatever the story happens to be i go there and look at it and this is like a common thing that i see and it’s like man what are they what are like what are people in this industry doing what what are they doing what are they doing in this industry um you’re gonna you’re gonna see when we when we take a look at it but it’s like well i mean what like there’s no there’s no standards anymore just no just everything’s half-assed you know everything’s half-assed so what we’re gonna do we are going to try to rescue this website we are going to try to build a replacement website today uh obviously you know this is a free project you know just donating it just saying hey you know i i help you out right um so we’re not going to spend tons and tons and tons of time on it but we are going to use automatic css and frames to do a lot of the heavy lifting see how far we can get and um see if we can get him a replacement that actually looks decent and it is functional it works it actually uh gets leads and maybe we can rank it a little bit um you know we’ll we’ll see i mean we’ll see how far we get i don’t know we’ll try to get to the seo side of things we’ll um we’ll put a little conversion um kind of situation in place and then uh eventually you know we’ll put analytics in and track it and just i don’t know see if we can help him out right okay but that’s what we’re going to do together on this stream so say hi throw up a like and uh if you’re ready to get started say uh let’s go or lfg or something like that in the chat we got cool web design in the house gabron uh arcane covers derrick derrick i already said derrick paul welcome paul good to see you curtis is in the house uh good to see andrea is here shad is here we got we got actually a lot of new names brendan o’connell mark good to see you okay all right we’re up to 216 already when you pass the 200 mark that’s essentially like we need to get started so let me go ahead and share my screen this is this is what they’re working with right now uh while i’m here i’m just going to go ahead and oh hold on an ecamm window extra ecamm window came up uh we’re going to go ahead and steal this logo i’m not even sure what’s going on with that logo right there artisanscapes logo uh let’s open this up i’ve got a dropbox going with their stuff uh let’s go right he sent me some photos and some drone footage that’s essentially all i have to work with um and it the whole photo library is like you know he’s like i don’t know which ones are good these are all the photos that i have uh so none of this is organized yet we’re just going to kind of do all of this as we go okay what kind of file was that that just uh they just downloaded there a web p a good old web p not even not even an svg not even okay uh looks like we have hardscaping as a service landscaping as a service power washing and sealing as a service obviously there’s a lot more that could be done here in terms of seo but our goal right now is kind of just to replace what’s theirs we can right now the site’s getting zero leads because i’ll show you if you go to book estimate uh exactly right like they people can’t even do anything they can’t even do anything uh all they can do is really go to the contact page they can apparently message on whatsapp and they can call the phone number which oddly in more than one place is missing the opening parentheses why why is why if we go back to the home page look it’s missing it there too uh i wonder if that’s some sort of dynamic data situation where they’re just like you know they put it in wrong and so it’s wrong everywhere i don’t know uh but she is can’t this is just not i mean what what are what are what are agencies and freelancers what are they doing these days what is who did this who who’s responsible right that’s just kind of what i what i wonder about okay so obviously uh it looks like the color scheme is is black and red or charcoal and red um i don’t know if that’s the best i don’t know if that’s the best color scheme i’m just gonna be honest i don’t and there’s no red in the logo i don’t know i don’t know if that’s the the best color scheme for a for a uh landscaping website um this looks like crap what did he pay i don’t know i don’t i honestly don’t know i don’t know anything about it all i said was i’ll i’ll fix it that’s all i said i’ll rescue you from the situation um okay let’s let’s go ahead i’ve got a um here’s here’s our site that we’re starting with right here all right so look it even says site title uh so we’ve got nothing done so far so we’re gonna go artisan scapes and we’re gonna come down and just save those changes i think everything else is good on that page so far uh let’s just start rocking and rolling on some semblance of a of a home page and we’ll kind of like wireframe this and just add a little styling as we go um we’re not gonna we’re not gonna overdo any of this we’re not gonna spend tons and tons of time on it i’m gonna go ahead and open the bricks library and we’re just gonna start with a hero section let’s go import images here and um well okay good that was that was taking a while bricks was taking a while to access that uh all right so again we are oh you know what we might want to go with hero section north brand new hero section um gives you the opportunity to show a lot of media kind of right off the bat in a uh in an interesting layout i i’m thinking i’m thinking this is actually just a perfect we just released this frame not long ago uh so let’s pop that in all right so now what we need to decide um this also is going to give you some some like a little stats area down here as well okay so that’s going to handle that i would do maybe a um just a classic kind of intro section um or we could go yeah i’m gonna i’m gonna go with like a classic intro section here uh let’s go with content and let’s search through our content actually you know what um maybe this content section tampa right here we just did a bunch of media so i don’t think we need any more media in this section right uh and most of these content sections are going to have media elements here’s one we could go with but i think that’s a little bit too much content content section charlie is a possibility but i’m i’m thinking i’m thinking we just for now we pop in that content section it’s got a little cta action for us now i’m gonna go services now we’re gonna go services which usually is gonna be like a feature section of some sort um he’s got three services right now but my guess is we’re gonna need support for more than that going forwards right um mm-hmm let’s see what we what kind of uh what kind of action do we want to go with here we could go very classic and maybe that’s the easiest way to go feature card sierra we could do uh i don’t want to go full width though i don’t want it to go edge to edge hmm i might go just something simple right off the bat and then we’ll come back later if we want actually you know this maybe something classic like india feature section india might work it’s going to give you the overlay it’s going to give you media to look at mm-hmm mm-hmm or you always have the delta situation i mean he’s already got kind of a delta situation going on right there right the question is is that the best way i mean when that when you start to add more it’s definitely not the best way um this might be cleaner i think india india might be a little bit cleaner of a way to go and i know there’s only three right now but this definitely is going to help us support more than three and we’re not going to scroll endlessly to to get it done so we’ll just we’ll go with that for right now okay so that’s going to be our let’s just map this out real quick so this is going to be services all everything else so far is is fairly obvious okay um what else do we want to do we probably want to go with testimonials now we want some sort of uh social proof so how do we want to do i’m not going to bother with something like this where we have to categorize our testimonials we’re going to we’re going to start out slow and easy i don’t want this because it’s this is more like a um preview of testimonials and i don’t know how many they actually have um let’s go with a classic kind of testimonials situation just nice and something nice and easy we don’t need any logos for social proof let’s just go with alpha let’s just pop that in keep it basic keep it simple okay all right so if we look at our flow so far we’ve got our hero lots of good visuals we’ve got our kind of intro content we’re going to go straight into like hey here’s what we do here’s what we offer here’s our services we’re going to give you the social proof to go along with it we’re probably going to need to close up with a cta here but i want to check my footer options and see if we have a footer that has a cta attached or if we want to go with a simple ct a simple footer i’m thinking he doesn’t have a lot of pages and stuff to put into the footer so we don’t have to go crazy with the footer we can just do a basic footer kind of like alpha this is way too this is way too much this is this is too modern for this kind of website we can do something like this maybe lima let’s go with lima if we do lima then we’re going to need a cta ahead of lima but i’m going to still put the cta in the in the footer template so let’s actually save what we’ve got so far and let’s hop over to templates we’ll do a header we’ll choose a header real quick we’ll choose a footer real quick uh so let’s go to bricks templates add new let’s go header and say that this is the header let’s publish this okay and we’ll edit um are we good is uh is resolution and everything good what what is that i’ve never seen that error before uh permalinks i’m just gonna go resave permalinks because sometimes i don’t know sometimes they get sometimes they get a little mixed up okay all right we’re in uh let’s go templates header header okay uh what kind of what kind of situation remember what we have for our logo it’s kind of a kind of a square logo they’re a little bit difficult to deal with uh and i’m not even convinced that we can’t even go with a dark website like because the this piece of the logo is dark i don’t have the logo file and it’s not an svg so there’s nothing we can do about it at least for now uh it’s not so i wouldn’t say it’s a good logo either right needs a lot of needs a lot of work needs a lot of work uh maybe it’ll look better on light what how do we want to attack this because i i hate i really i’m not a fan of square logos uh we could do something like this but these headers take up so much space how do we want to attack and what else do we we’re not going to need a big nav it’s going to be a fairly simple nav so let’s just go let’s just go with alpha for right now we don’t need anything we don’t need anything fancy and crazy okay all right let’s just keep it under control uh bg ultra light instead of light for now and let’s get out of here now let’s go to footer footer okay footer footer footer okay publish and let’s bring it in you don’t need to come out of the builder in order to add a template i know you kind of do though you kind of do uh you can create the template in here but you can’t assign it to anywhere and then you have to go to it anyway uh to do the assignments so yeah it’s pretty sure you pretty sure you you kind of do um all right let’s go footer we said we were going to do lima so let’s pop lima in lima’s got a little scroll kind of action going on which would be nice uh let’s go with white on these for now or text light pretty much what we want to rock with and let’s add a cta here so let’s see what cta sections we have this one’s not super appropriate not super appropriate not super appropriate none of these none of these are a good fit thinking a very classic cta kind of thing going on here um yeah something like something like cta section bravo i like the fact that it’s got the media in the background because we’re not going to have any other media in the footer itself we’ll at least start with that uh definitely added it to the wrong spot let’s drag it up there okay good fantastic why is my accent heading not ordered let’s go fix that real quick my minus my minus one thank you all right let’s go here and typography text light okay fantastic all right um what buttons are these button white button white okay we’re gonna need it we’re gonna need those are old those are old school uh those are are deprecated i don’t want to turn on any deprecated stuff let’s see what we got so far so we got a header we got a nice little hero we get that we got services we’ve got our testimonial and then we’ve got a call to action and then we’ve got our footer okay all right uh let’s go in and get our menu going let’s customize and let’s hop over to the menu now i do like to skip around a lot i like to kind of do um overarching things 30 000 foot view kind of stuff and then i come back and i start to clean up some of the details right we’re going to go navigation and we’re going to add items and we’re going to add uh let’s add our home page um let’s add oops we don’t want it twice um services is gonna yeah do we do we want to drop down for the services probably uh let’s get a contact page going so we’ll drop that in what else does he have up there anything else he’s got the gallery i’m not a fan of like a gallery page i mean maybe we’ll do it maybe you could facet it so that they can control what category like what category of images they’re looking at but i like to put a gallery on the actual services pages like if i’m already looking at like landscaping then when i’m reading about your landscaping service that’s when i want to see the gallery of landscaping photos right i don’t i don’t want to have to navigate somewhere else to a gallery page and then facet myself into your your photos for the thing i want to see i just wanted to be there on the page i’m already looking at so i i tend to avoid these like gallery pages um but i understand it could be helpful in some cases so like he mentioned he wants to be able to pull up the gallery on the ipad when he’s talking to a customer and then like choose a category and flip through the photos and like show them in person it’s kind of like a you know it’s it’s him using the website as a sales tool and not like relying on a visitor to come to the website so there’s that kind of thing that we need to keep in mind as well uh we’ll we’ll throw an about page in here all right add great okay and then the rest will be based on our services i think um we we do want a cta right we do want a cta uh so let’s say that’s actually not going to be there let’s add items this is going to be a custom link let’s make it a pound sign for now and we’ll say uh get uh get i can’t get an estimate we’re going to need to think about this we’re going to need i don’t i don’t that’s not my favorite cta text uh but we’ll throw that in for now now uh because wordpress is so fantastic um oh oh actually you can you can now maybe did they change this that you can add css classes now here okay so we will say uh cta we’ll just we’ll just throw that on for right now uh or how about this header cta uh publish all right let’s get out of here there we go so we’ve got home about contact get an estimate um let’s go ahead and we don’t you know i’m not even going to worry about styling that right now we’ll get there in just a second let’s do the cpt for services uh let’s go acf let’s do post types let’s do add new let’s do services service service services advanced configuration urls undo the front prefix add the archive page save all right add new service we are dealing with let’s go back hardscaping landscaping power washing and sealing hardscaping publish publish back add new landscaping publish publish i think we can just wait right here and add new service okay uh power washing and and what was the other power washing and uh power washing uh let’s just do let’s uh i mean all right we’ll have a conversation about it i’m gonna just have to he’s not here to talk to him right now so we’re just gonna have to go with it i’m not convinced those two things should be paired together i think we would look at the seo at this point and say yeah is that the best way to go it’s probably not based on my experience probably not the best way to go uh so we’ll talk about separating those things out all right um and and here’s the thing it’s like sometimes when agencies and freelancers um they charge per page right to save money people will go oh can’t you put those together right and it’s like but those don’t really belong together so we shouldn’t really be making the decision based on that right i don’t know if that’s what happened it’s a possibility okay uh and i will do some q a’s but you need to make sure that uh hashtag q hashtag question so that i can easily get to them we’ll take some breaks here and there because i like to let my brain rest as we go through these kind of things and then i just use that time to answer questions yeah see carl says power washing and sealing is two services yeah you know what carl this is make an executive decision this is how it this is how it goes this you know ask for forgiveness later we just do it this way now the problem is i don’t know that uh you know what was patio ceiling maybe because then there’s going to be a deck ceiling there’s going to be a patio ceiling uh there’s maybe a driveway ceiling i don’t even know this is where you got to go into the seo you got to go into seo research mode you got to figure out what these things are going to be but you know we’re not getting paid to do that right now what we’re what our mission is right now is to get a site up and running that looks good and that can actually convert visitors because the current site can’t do any of that stuff we can figure out this side like the architecture the seo finalization we can figure that stuff out later all right we’ll just go with patio ceiling for right now because that’s what i actually have a photo of it’s what i saw i didn’t see him building a deck you know so i don’t know um but again yeah let’s see what grant says somebody said good call grant so let’s see what grant says uh schedule a quote well you don’t have to schedule the quote uh because you can just do it with the form right schedule a consultation if they do on-site estimates they do do on-site estimates um yeah maybe it’s very it’s a little wordy it’s a little long it’s uh you know we can but we can brainstorm again we’ll come back to that all right so we have home about contact get an estimate we need to go back to our header now let’s go to our menus uh navigation add items services service archive let’s pop that in here and change this to services and then let’s add items add items thank you and go patio ceiling power washing landscaping hardscaping okay uh let’s go i don’t know which one he feels is most important maybe landscaping i know the money is probably in hardscaping uh we’ll throw patio ceiling in there and power washing last i don’t know publish okay so we’ve got our little drop down good menu kind of builds itself we just got to customize it a little bit as we go okay okay okay okay hmm now let’s go to the about page and let’s get a little see what we’re kind of doing tackling this is like with a wire framing phase it’s like all right we’ve got i feel like we’ve got this wire framed out essentially uh now one thing you could come in here is just break things up just a little bit like this services page it would probably be good if we went like with a little bg uh ultra light on here what’s happening to these frames what’s happening to is that just a rendering issue oh is it no i feel like you know what this feature card india let’s try something real quick we can do a little isolation isolate maybe i feel like stuff’s going behind things yeah okay hmm andreas if you’re in the chat andrea if you’re in the chat uh feature card india needs an isolation isolate on it uh okay let’s go back and see what we’ve got going on yeah yeah all right good okay let’s go about edit with bricks let’s get out of this one hopefully i saved sometimes i like to trick you like to pretend you didn’t save when you really did save all right let’s look at a hero what kind of hero do we want to go with for our about page um i’m not a huge fan of like you know how people go oh it’s a sub page let’s get a sub page hero and use the same sub page here on every single page yeah i mean we could go that route it’s not my favorite thing to do uh like it would be something like this you know like a hero foxtrot situation you use that on every single page or like a hero hotel situation use that on every single page i almost think i’m not even going to go hero here we’re going to go see what content has to offer because i think there’s some things that we could you know it’s the about page um it could be like this even this could be a hero like content section echo could be a hero uh content section delta could clearly be a hero as well um i’m thinking more like i’m almost like this like content well no that’s a little it’s a little moderny uh let’s go with where’s the one i was okay something even like this like content section mike but i’d have to i have to brainstorm how i want to use this little message bubble content feature i don’t think anything’s going to help us out in feature here let’s just come out let’s go all i don’t want to let’s let’s uncategorize for a second and just see if anything pops out at us you do i mean we could obviously you know go much faster but i i like to take my time and just you know i like to put a little thought into it just put a little bit of thought into i’m gonna go with content section papa if we don’t find anything else or even uniform i don’t know why i didn’t see that when i was going through the heroes the first time a hero uniform might be because again i like the fact that we can show three different media elements up there this is a it’s kind of a way to sneak in more media and on a site like this like the media really does a good job of obviously you’re showing the person’s work as you’re determining you know how to lay out this content let’s go hero and then uniform it’s right there let’s let’s let’s start with that at least okay um what else do we want to do on this let’s think about what we want to say i mean his about page is so classic i mean so even down to the centered paragraphs of text which you should never do on the internet i get it you should never do this on the internet but what do we find we find the things that you should never do on the internet over and over and over again uh this is just this is essentially like it is it is whoever did this is essentially raising their hand being like i am in fact the laziest web designer that has ever existed uh this this is like the calling card of lazy web designers right here i like does this page need a layout of any sort no does this page need any creativity of any sort no does this page need any thought of any no what should we do just throw in the content just get a box and just throw in the content and and we’re we’re moving on that’s what we’re doing uh it’s just absolutely just you hate to see it you hate to see it don’t you okay so obviously we’re not doing this and that’s you know all right let’s let’s see is this content even worthy to keep welcome to artisan scapes where we redefine it’s going to all be we we we me me me right as we’ve talked about before where we redefine outdoor living with our uh unparalleled expertise exquisite craftsmanship uh with it’s like glazing yourself you’re just everybody’s is glazing themselves at all times like it’s just not let’s not focus on the customer let’s just glaze ourselves for six centered paragraphs of text with a commitment to impeccable design attention detail transform or okay we’re not getting we’re not using any of this copy um we’ll tell you that right now all right um so what do we want to say i don’t think we need to put a team on there we do want a i i think an about the owner about like you do want to put a person on here somewhere right uh so about the owner would be good let’s see uh we could use ctas maybe for this see what we got here see what we got how do we want to present the owner um all right let’s do let’s go go back to content and see what we have here um we could do something like this something simple this would even be more intro text this would give us more introduction to the company text uh it’s not going to be for the owner though what else can be what could be for the owner maybe something as simple as this right here content section papa let’s see what features have to offer us uh let’s come down even something like that could work you could use this by itself feature card uniform that way you could almost use the the person’s content as the divider between other content i’m thinking we might go that route we just use that wide feature card because it also provides a little bit of depth let’s go feature card uniform by itself and let’s take that and put it in a i bet it already is a container okay let’s just we’re gonna have to piece this together let’s get that other content section in here that i was thinking about uh this one right here this this might look okay under that other one because the media is offset back to the other side so it’s like here’s content media going this way and then it reverses itself going back which is good and now this one under this one is not going to be a fantastic look but what we might be able to do is put again a testimonial section in between and i think what we’re going to do is go back maybe to the home page let’s go back here edit with bricks okay let’s grab this one right there we’ll just use this to break up this page so we’ll pop that in right there okay so we got it’s gonna be like about us then the social proof and then the about that’s gonna mean we’re gonna wrap this in a section okay fantastic that’s gonna be kind of the uh about uh owner we’ll do owner intro right here looks like this needs to be text light okay fantastic and then it’s gonna go right into the call to action at the bottom probably all we need there it’s probably all we need um let’s go with trying to figure out which one of these sections maybe this section might need little bg ultra light let’s just see adding a background color there let’s see how this flows on the front end okay there’s that there’s that there’s that i think it’s yeah i’m not super happy with that but we’ll we’ll get back to it we don’t need to we don’t need to spend too much time okay we’re gonna go with a we need a we need a services page and then we need a service template we are gonna make all of these look exactly the same all of these service pages are gonna be exactly the same uh then we need a service archive template so let’s go back go bricks templates let’s go add new uh let’s go archive template okay this is gonna be services and i’ll say services archive okay let’s go publish edit with bricks uh let’s assign this template settings conditions add condition archive post type services save uh populate content from the i guess yeah let’s let’s do that single post page uh what is it uh land landscaping service apply preview okay all right think about what we want from our services page now let’s get back to heroes see what our options are here i’m thinking that we could even go something like hero victor right here because it’s going to give us three selling point cards right off the bat it’s going to give us one kind of main media element but it’s also going to give us three selling points right off the bat uh which might be a good way to go and because i don’t want to spend too much time on this kind of like go with your first gut feeling you could go with this one but that that’s going to require us to get three images for every service right off the bat not super excited about that let’s try hero victor for right now okay so this takes care of our our immediate selling points how do you sell a landscaping service what do you need to show people to sell a landscaping service let’s think about this for a minute i mean we we know we’re going to need we’re going to go back to um do we do i still have it on my clipboard i do look at that testimonial section alpha we’re going to need social proof on there for sure um we’re going to keep using the same boring uh testimonial cards over and over and over again i don’t think we need anything crazy um okay you’re going to need some main you’re going to need let’s see this thing about landscaping in general we want maybe three visuals here’s here’s where it kind of you do need to know if you’re going to do like sub service pages or not uh like if there’s other services within landscaping that you’re going to want to make pages for or other services within hardscaping like for sure i mean in the future you’re going to you’re going to have like patios for example like under hardscaping there’s patios and then there’s other kinds of hardscaping and you’re going to want service pages for those in the future but the thing is we don’t have them right now and so we can’t we can’t put in content for them right now we’re gonna have to come back later in a in a separate phase and solve those problems so uh let me let me let’s take a break with the brain here beautiful pictures of landscapes exactly we are going to need a gallery let’s let’s let’s see if we can uh what kind of um gallery situation gallery section alpha i wonder if that’s i don’t know if this was built so long ago i wonder what it actually does gallery section alpha well it’s blank right off the bat so that’s a good start let’s get into i don’t think it imported the placeholder images okay let’s just get rid of all these i really wish i knew let’s just do placeholders for now get see if we can get some semblance of what it’s going to look like uh oh i can’t it’s not going to let me like multiply them all right all right uh uh uh uh uh uh i don’t i don’t yeah i don’t know if i want to do that or not maybe we do maybe we could use it as a divider section somewhere we need other content we can use it as a divider section okay let’s let’s look at our let’s look at general page content and see what kind of because you’re going to need general content for each service right so let’s find a good way to display some general content something like this that gives you additional media might be an option something like this content section bravo we’re going to be scrolling down next to images like instead of a gallery by itself you can actually have content next to some semblance of a gallery that’s an option for you this is going to require maybe too many too many images a little too much going on for for right now let’s try content section bravo this is actually going to add some movement to the page see how we have a sticky got a little sticky situation going on here uh so where would we put that let’s do maybe not yet maybe you go gallery to divide it you start off straight up yeah i’m thinking this gallery is going to be full like we’re going to make this eventually go edge to edge probably two rows of square images get you a lot of interactive gallery type images right off the bat then you go into more like selling the service maybe more detailed images right here uh then you’re going to go into social proof down below let’s see if we have any uh let’s see what what what kind of categories can we search through here that i’m forgetting about content content cta’s we are going to need an faqs let’s go into faqs and figure out how we want to do faqs for this probably something simple like alpha so for sure you’re going to have faqs on every single page so let’s pop that in oh the accordion doesn’t exist okay let’s go into frames let’s go into components we’re going to need uh what are we let’s just turn them all on they don’t actually load code until you use them so it’s pretty safe to just enable all of them all right like how you can do that without going to a magic area to do it i find that i find that fascinating i find that fascinating all right let’s refresh and now look at that we have an accordion from frames uh okay so we have faqs we have testimonials we have that content section we have a gallery we have a hero with selling points i still feel like we need a little bit an area for a little bit longer form content maybe um let’s check our cta’s here hmm hmm cta card charlie okay i’m thinking of maybe like using a cta as a divider between some of these just as an additional cta in our in our sandwich but i don’t know i’m not not fully well maybe maybe echo maybe echo what is that is that a section yeah is that a section no it’s just a div it’s just a div um that’s rapid in a section and then we’re probably going to have to we’ll come in and uh we we will remove the padding from that so it goes back to edge to edge but i do want the section tag on there okay let’s go typography text light all right maybe i maybe we center this while we’re here too um center and then go back to center here but then on mobile we’re definitely going to left left this left and go back to typography and left that okay all right so that’s that for now let’s just do it now um fr cta echo okay this section i don’t was there no section for this nope nope there’s not okay cta uh section echo we’ll just make our own and let’s go layout zero zero zero i just said play on something i don’t know what that audio was sorry uh okay so let’s go cta section echo and then we can use this as a divider there we go so we’re going to go gallery more a little bit of content to sell the service and we can probably add our own i’m thinking about adding our own like bullet points here because we have plenty of room uh we could we could add some more little talking points selling points here if we need to like you could almost just come in here grab this and go like list alpha and or this like feature list tango we don’t need icons do we um let’s do list alpha and this is what i like about oh that didn’t go inside hold on that needs to go where are you all right list alpha needs to go in here maybe under the lead paragraph there you go see it’s it’s very easy like this is what i like about the modularity of frames you can go get this little tiny little piece and just it wasn’t here but now we can insert it we obviously need a better check mark because that’s not a landscaping check it’s like a very modern check mark or something um okay but we can do something like that right okay um i’m still not you know i’m never 100 sold on these these could add like we’re just wireframing right this stuff could get removed as we go because i i might get to a point where i’m like nah it’s not working it’s not working um okay so first of all where are we what am i even editing right now this is the archive page i was actually in my brain uh doing a single service page so it’s no problem though all we need to do is copy all and we need to go back and we just need to make our service single services single and then we’re going to say single and we’re going to publish and then we’re going to edit with bricks and then we’re going to paste and now we have our service single okay template settings conditions add condition uh we’re going to go post type is services now it’s assigned we can still populate the content single post page this is where we want to do you know something like landscaping apply preview okay the next thing we need to decide is is this all going to be it’s it’s going to it’s we’re probably going to use dynamic content for all of this um so we’re going to have to make the custom fields for all this stuff but again i want to get it to i want to i’m going to start with static content and then i would come back and replace it with dynamic data because until i don’t want to do all the dynamic data work until i know i’m happy with the layout and i’m not happy with the layout until i put in real static content and see if i’m happy with the layout okay that’s kind of the process that i go through bricks templates let’s go archive so now we need to go back in our mind and think all right this is not what we were doing before this is something different okay this is where we need a grid so we can get rid of gallery we didn’t do all this work for nothing because i just copied it over to the single service template uh we’re not going to need that we’re not going to need that we’re not going to need that we’re not going to this is a routing page effectively okay so we can have maybe hero victor but i don’t even think we need that i think we need to go very very uh simple for this like a feature page might work really well and just get a feature grid going and it might be we could honestly use the feature cards we used on the home page we really wanted to just be kind of boring we could go back to the feature section india and just use those probably it’s probably what i’m going to do to not spend any more time on that let’s go they’re right here let’s just grab this services section and bring it over and paste it in and then all you do is change this to an h1 see how i’m not this is not a like it’s not a hero right so but i’m using it as almost as a hero uh almost as like the entire page like i don’t what else do we need to to be doing here not much okay so this is just going to loop through all the services and then we have our cta all right so i i think we’re good to go let’s let’s go back to the front end here just see what we’ve got see if everything’s coming along so we’ve got a home page we’ve got an about page we’ve got services page we’ve got which i don’t i don’t like this to be the actual link here um i like to put all the links in the drop down for people so i might do like all services link up here and then landscaping hardscaping patio ceiling power washing in fact let’s do that real quick let’s do menus navigation add items uh let’s do a custom link uh let’s do a custom link that is services and put that right here and now you actually have to come back and you can remove the link from it and then we can go landscaping hardscaping patio ceiling power washing and then i can come in and do all services something like that with the actual archive come on bruh all right publish there you go nice all right that might that might work a little bit better i don’t know we’ll continue to revisit that contact page edit with bricks okay come in again not a ton needs to be going on on this page right here we’re not going to do a service area network yet yet we might do one not yet um hmm hmm hmm okay maybe we’ll start with a hero a normal hero hmm hmm hmm i i i do want to keep the contact info and stuff very close to the top let’s go back and see again what i have as my options here something like something like this might like echo let’s let’s go with echo to start out the page change this to an h1 get rid of this form we’re going to use a form there but we’re going to use a ws form we’re not going to use a bricks form um what’s going on with these icons did they not get brought in okay we’ll get we’ll get icons going in a minute uh this will give us the rating situation which will be nice um we can even link out to the profiles there okay let’s get a since i’m ocd i don’t want that i don’t want that like gaping hole there so let’s go to ws form real quick and click to start i’m a developer skip whatever get started okay uh let’s just use the contact us template great fantastic gdpr immediately goes in the trash can okay uh get an estimate all right let’s just actually this is not going to be the get an estimate form um send send message this is a this is going to be different from get an estimate all right your inquiry phone first name last name got it got it publish got it publish fantastic contact refresh pop this in ws form in bang select your form contact us form light styled it up save great nice job all right um what else do we want we do want one of those maybe fancy map sections going on but i don’t i don’t know i don’t know we don’t need a map because it’s like um ah we could we could we could we could we could do something like this let’s see what charlie gives us yeah yeah that might be good because it’s going to give us an area for our address our phone and the email I’m gonna change the email probably to nobody wants to fucking follow a landscaping company on social media can’t change it to social media but we also don’t want emails maybe we just do address phone maybe we maybe we come here is this a grid how is this done contact info bravo okay what is the info wrapper that’s not that is a grid okay it’s a super old school one look at that look how fucking old school that is so let’s just change that to two and then let’s just get rid of the email block we don’t need that ain’t nobody need that all right let’s go here style layout width bring this in see this you can just clean this up with a little width action and then I’ll just I’ll just make these actual cards like if these had background colors we’ll just do this for right now uh and it had some padding because like if it doesn’t have padding you’re like a psychopath look and then we just stretch we just stretch our grid stretch look at this I don’t know what the fuck this icon’s doing um what were what were these what were these doing icon content wrapper what okay icon is that an order situation do we need to order minus okay now some semblance there’s a little chaos going on there for a second let’s go um content gap but half okay whew man all right that looks a little bit better let’s pop a radius on here border border radius radius okay all sides just need our global radius to be an action there there we go there we go we need to get rid of the cta on here um we’re gonna need to add a little conditional logic switch i think we’ve seen this this done before but we’ll get to that later but what i’m gonna do is put in conditional logic so i can turn off this footer cta on specific pages right okay but i think that’s you know that’s decent for right now what i want to go to this address and phone situation we’re going to make an options page so we’re going to go acf options pages add options page um and we’ll go business info right uh or we’ll say global data yeah yeah global global data i don’t what do you like to call these things what do you guys like to call these things um let’s go with let’s go with the globe because it’s global data uh redirect to child page okay i don’t usually these are set up in my blueprint i don’t know why it’s not already set up but let’s just go save changes give me that options page let’s go to field groups add new options okay uh we’ll say global data just name it the same just name it the same thing post type isn’t there an options page yep options page global data save uh let’s go phone number i think we’ll just use the text field for it uh we’ll go add fields text area we’ll give us our uh okay there’s two ways to do this you can go just the whole address together or you can piecemeal it and then that kind of gives you more flexibility but it’s also you know more setup and right now you know we’re not getting paid it’s you know this is we’ll just we’ll just do the do the minimum required here for this kind of thing okay so what we want is is there any other data that we want to put in i mean eventually i’d put in your social media channels but again not really concerned with that right now so let’s go to the global data page and let’s put in the phone number for this company contact okay let’s try to put it in the right way you know without the missing parenthesis so i would just say do it like this all right and then let’s go with their address okay fantastic bang there’s your address update i don’t think i don’t know there’s not supposed to be a comma there we don’t need usa i don’t know if you can do line breaks in these text areas but i guess we’re going to find out okay so now let’s go back to our contact page pages contact and let’s just insert some dynamic data so grab this okay address phone phone okay fantastic fantastic we probably want to make this entire card clickable don’t we maybe this whole address card this whole situation probably needs to be clickable let’s go let’s go with how do we want do we want to we want to wrap this in a div and call this the link we’ll just call this a link wrapper okay and then what we’ll do is we’ll change this to a link and we will say that this is going to be uh i want to do custom url custom url this is going to go their google maps page right google my business so let’s go with uh google.com artists and scapes georgia here’s their thing right here share copy link i’ll go back and i don’t know if that’s the best link to grab um let’s open this in a new tab let’s go no opener open ur i hate that word just absolutely that was an awful way to do that bad html decision on their part in my opinion okay uh let’s do ooh let’s see if um so what we need is clickable parent so i’m gonna and i want it on all cards i’m gonna go to bravo uh i’m gonna go to this link wrapper we need to give that a class what is uh contact info bravo let’s just do contact info card contact info card rename classes sync labels apply okay so this is now content okay so this is contact info card double underscore link wrapper fantastic style css at clickable parent there we go okay okay and then we can remove this i don’t care about not being able to click in there in the builder okay configure your selector if you have more than one link this is targeting oh okay yeah we need to do this i believe on the card itself contact info card come down here let’s just check that real quick on the front end look at this look at this look at this um no yeah okay we need to disable ws forms uh let’s go go to settings no ws form settings where’s that developer i don’t i don’t need the developer console where do we turn off the developer console where is it where is it where is it is it under advanced i don’t want to spend too much time looking for this where is that does anybody know off the top of their head where that developer console switch is it’s always off on my things and where is it where is it who knows who knows advanced it’s under advanced skin html comment cms compile dynamic and queuing cache duration source max i don’t know is it is it i don’t see it i don’t see it there i always like that’s why i disable it on my blueprints like i always have problems finding the switch for it oh there it is it’s because it’s this drop down i’m looking for my brain is looking for a toggle switch and it’s always this drop down for the debug console okay save changes all right let’s go back uh global data edit we got too many tabs we’re too tabby let’s get rid of our tab situation here okay so there’s that there’s that no more developer console this is fantastic okay let’s go into phone custom url tell and we’re going to replace the tell with the phone number there you go okay save this is good this is good this is good okay so let me make sure that those i believe the recipe for clickable parent positions that relative it does it does okay good to go so now i’ve got clickable parent on all these cards let’s just animate that card for real quick just real quick just animate it real quick uh okay we’re going to think about how we’re going to do this for when there’s when there’s clickable parent maybe maybe do we i don’t know if we do i don’t know if we do okay root hover translate um minus one m zero oh that’s that’s the dyslexia it’s zero minus one m always get them backwards just always get them backwards okay uh transition oh no we need to go back to root for this transition translate 0.3 seconds ease okay maybe actually uh i don’t know we can’t uh transition transition what fuck see i’m gonna have to go to yeah i even have to go to the docs for my own uh system let’s see if i can trigger my memory here additional styling transition okay transition i think transition duration hold on background background background okay we don’t want to add to that transition um all right transition i think it’s just all it’s all this named exactly the same all right so 0.3 seconds uh this is going to be translate 0.3 seconds um timing function transition i think transition timing function probably not doesn’t seem like it is um i’d have to go look at the docs okay uh we’ll just do ease in out for right now come back and replace that later have to look up what the variable name is okay contact look at this okay um we don’t need berlin i mean why are we looking at berlin what do we we need to we need to put an address in don’t we oh fuck do you really have to get the longitude and the latitude really oh gosh okay um all right here we go let’s let’s try claude come here claude what are the longitude and latitude coordinates for this address you know what we’re not we don’t even need to put the address in um let’s do what are the longitude and latitude coordinates for lawrenceville georgia okay let’s grab this bang thank you maybe maybe this works let’s see if is that the which one comes first longitude or latitude latitude latitude okay good uh let’s go into contact there’s our latitude let’s get our longitude never done it this way so we’ll see what the fuck happens uh longitude save i already see oh there there you go do we we may not even need great still berlin uh it’s because this right i forgot you can alternative to latitude longitude okay so we just delete those um i need to get rid of that and save this i i don’t i don’t why is it i have a feeling it’s there we go okay good look at this fantastic fantastic remember this cta is not going to be there um okay okay all right we’re good so this is going to say get in touch all right very nice i think what we can do here is take this form wrapper um and we will what is that fr form alpha wrapper form light fr form we’ll just we’re just going to rename this form wrapper that’s all i want i just want a form wrapper and then we have form light okay and on our form wrapper we’re going to go backgrounds we’ll just go bg ultralight for right now layout uh drop in some padding maybe l link all those sides together let’s go border border um pop in our radius okay great fantastic let’s look here contact automatic css form i just want to see real quick input uh oh we need to go to our light styles okay input what is yeah i’m using deprecated colors on here this is an old blueprint okay let’s get rid of that let’s just reset these essentially just reset all these okay save now we’re looking good i was like why is that like a super dark border okay let’s get out of there ah that’s coming along okay so we have our contact we need to get an estimate page this is going to be super easy oh did i never link that up okay customize menus navigation get an estimate is a custom link okay we’ll just call this estimate estimate publish okay get out of there go to it all right and then i can’t edit from here fantastic fantastic oh because i didn’t make an actual page why do we do it like that i don’t know why i did it like that let’s put let’s publish that was dumb that was very dumb all right we’ll fix it in a second so we just need uh i don’t even need a frame for this i just need a section with an intro give me an intro um let’s use an intro by itself and i just want a super simple actually you know what i think this might this might be a good idea here watch this let’s go intro i’m just going to steal this one because it’s going to allow me to put these badges right above right above the form wouldn’t you like to see my my star rating as you’re getting an estimate that might work out okay let’s do form wrapper here and let’s do form not that one did the wrong one let’s delete this one okay save let’s go back to ws form we’re going to make a quick little estimate form all right so ws form uh add new do they have an estimate form they might have an estimate form somewhere uh human race sales quizzes let’s go to uh booking no request appointment no no no no no no no maybe people want to see us build one maybe maybe we want to see us build one let’s just build one let’s say f it build it okay we need a submit button gonna drag i like to actually put this in a separate little section here um okay so submit button um let’s go with uh text text text uh text that’s first name last name let’s go email uh let’s go with uh phone let’s go with address google let’s do a google address i think we’re gonna need an api key for that if i’m not mistaken so we might do a dummy address line if i do uh just to get it working and then we’ll come back and spice it up later all right um we need we could we could actually probably pull in maybe from a cpt here our services so let’s do a select field and this is gonna be uh no no no no no we need probably check boxes because i want them to be able to easily select and see more than one uh so let’s go with uh which services are you interested in okay um mm-hmm check boxes data source uh post post type service status is published i think think that’s all we need to do but i’m not sure i have to come back and check that again in a minute um okay what else do we need which services are you interested in um should we do date and time like date of request i don’t know if we want to do it that way uh might that might over complicate things how about how how soon let’s go select let’s go with uh how soon would you like um when would you like service to begin okay um required and then let’s go to options and say uh this week um this month um this summer if you didn’t know you know like uh this is very it’s very uh like if it’s landscaping for example or like you know uh stuff where like winter is very dead time for them uh but people may be looking you know you never know i don’t know we’d have to have a conversation about this um i’m not sold on it not sold on it i want to capitalize all these the same way okay uh we’ll just say as soon as possible okay um i don’t know those are just dummy options for right now we gotta come back and refine everything i think that’s probably probably all we’re gonna need for now okay and we’ll say schedule this is where we can say schedule an estimate save okay and this is gonna be first name and i actually want to bring this out to about there okay let’s bring that in and then let’s go last name and bring that in bang email phone those can have their own lines i think everything else can have their own line let’s go ahead and publish this this is gonna be an estimate fantastic let’s go let’s go estimate awesome on this form wrapper we just go with a little width action right there and then we will go with form light great great great great okay get an estimate pop that to h1 okay google rating yelp rating let’s go thinking how to do this because we got those badges now appearing in two different places so we’re gonna go like an alarm should go off in your head that’s gonna be a lot of places to update that shit so let’s go with group group um ratings okay and let’s go with google rating okay let’s go add a field let’s go with uh do they want to do yelp oh we’ll do that for now i don’t i don’t even know i don’t even know if they have a yelp profile but that’s what we’re gonna do for now okay global data google rating is uh 4.3 okay gotta get that up a little bit you know what i’m saying uh yelp artisan scapes ga yelp’s a tough one man yelp is uh i hate yelp i really really hate yelp i don’t think they have i don’t think they have a profile for yelp uh but we’ll pretend for right now we’ll just say it’s 4.2 okay update okay now let’s go back to estimate refresh fantastic um this is i believe in an attribute data attribute google uh google rating bang and then yelp rating because you can pull this is what this is kind of made for you pull this in dynamically yelp rating look at this look at this why does that not look centered um let’s get rid of this tab let’s get rid of that tab we don’t need those anymore let’s go edit with bricks what is going on with it’s just it just doesn’t it needs a longer title that’s we’re just seeing it’s a weird look because of the length of the title okay um how about this how about this we go we change this to a paragraph um but we pop on an h1 class and then what we do we’re gonna style that h1 in just a minute uh then what we do is we get a real h1 and we uh put in uh get get an get an estimate but then we go with accent heading we style it like an accent heading uh which we need to apparently choose 400 explicitly on we haven’t even styled our fucking accent heading yet how do we want to handle this accent heading guys how do we want to handle the accent heading uh i think for sure we’re gonna go oh i don’t i don’t even know yet i don’t even know yet let’s do text arc muted for now let’s just do something like uppercase for now uh let’s do s for now um let’s make s a little bit we haven’t even chosen a font yet so i’m not even gonna worry about font sizes till we actually choose a font but i do need to say these h1s need to be explicitly 700 okay oh that’s interesting the accent heading is not overriding the font weight oh it probably is just not for live preview that’s that’s probably what’s going on okay yeah see there we go now we’re free now to because we got our h1 saying the explicit thing um fill out the form below and we’ll schedule your estimate within 24 hours okay width sculpt this down like that okay save i don’t know why bricks is not it’s like refusing to open in a new tab so every time i try to go to the front end to look at this it takes me out of the builder which is very very annoying i think these are the services they just have the wrong labels um and they the text box style i have i gotta clear out all these old defaults this is an old blueprint um light styles uh option input yeah gotta get rid of those and these things will pop back into action okay um global and submit buttons secondary buttons those are good those are good those are good option inputs are good progress bar fill color swap that oh get rid of all these reset reset reset reset reset reset range slider reset reset reset accessibility reset save okay good good good good good okay all right let’s see where we’re at um we’ve got our home page we’ve got our about page we’ve got our services page which i made all services down here super easy landscaping page there’s going to be a gallery there let’s go ahead and get images in i want to start getting images in that’s going to start to bring this to life a little bit we need some icons over here we have a get an estimate page that’s super simple we still need the logic for this section down here to be able to hide it on certain pages let’s go into header now now we can start to really cook here um let’s go bring this out all files create oh we already created a branding folder good uh what did i do with that logo that is just man i can’t think i can’t think of a worse logo i just can’t think of a worse logo um the fuck is that okay let’s let’s um we’re gonna have to have a call with bev we’re gonna have to gonna have to have a call with bev i’m gonna i’m gonna get rid of this for now i’m just gonna put in text i’m i’m i boycott i’m boycotting it artisan artisanscapes okay we’re we’re just gonna we’re just what we have to do i mean you gotta you just gotta boycott it it’s all it’s the only option it’s the only option at this point um let’s go bold okay there we go artisanscapes okay um that’s a rough logo right there guys that’s a rough logo right there all right let’s go to css primary primary what do we want our primary color to be um what do we want our let’s let claude choose you know claude’s it gotta do a better job than bev um provide me three color schemes for a landscaping company um let’s aim for uh let’s aim for softer colors okay uh and each color scheme should be a max of two colors okay come on claude work your magic sage green and cream sky blue and soft gray lavender and pale yellow oh this doesn’t sound very enticing um i think sage green and cream might be a good way to go okay let’s just see off the bat let’s go i would say sage green is going to be your primary color let’s get to the front end where we can see what the hell’s going on here okay because right now bricks you’re out of control all right let’s bricks i go to the front end all right home all right here we go so let’s go automatic css color palette primary pop this in oh okay okay all right good choice claude good choice um we’re gonna have to fix up our buttons here but that’s okay what if i now go to our backgrounds backgrounds and text backgrounds and all these ultra lights that i’ve been doing you know what i don’t want to do we’re gonna do this though color palette i i think that’s actually gonna be a good base color also um so i’m gonna duplicate up on this we’re gonna duplicate up on this and we’re gonna pop that in as the base color as well and then what’s that that’s gonna allow us actually you know i might not even need a if we can just get away with contextual utilities we may not even let’s just turn off base for right now let’s see if we can get away with just the primary color um other than the cream i’m gonna need that yeah this cream i’m probably gonna need the base for that okay so we’ll go primary and we’ll go base but i’ll i’ll do that in a minute okay let’s go to backgrounds backgrounds backgrounds backgrounds backgrounds bg ultra light this is where you’re watching can a non-designer just come up with something halfway decent we’re we’re clearly already out of the gate gonna be way better than bev that’s not even a question right uh but there’s no budget for a designer on this project so uh you get what you get we want we want primary ultra light okay all right and that’s that sage green right there my friends we want maybe maybe i bump up the maybe i bump up the you know what you know what all right let me think about this because maybe this is a situation where we actually need the base to come in let’s let’s do this let’s grab this cream let’s just see what we’re working with with regards to this cream um the problem here is i like to put the dark in i like to put the dark version of this in i already know this is gonna be very light right okay so let’s go color palette let’s go base turn this on let’s pop in our base color oh god no no no claude no that’s way too yellow claude claude what are you a hundred percent saturation claude claude you’re out of control you’re out of control my friend 30 maybe we can maybe we can make this workable um let me put this back in hold on here uh hold on let me let’s just let’s i guess look at it i don’t know i just that’s not making me excited claude all right let’s go to backgrounds and text backgrounds just see oh claude you’re fired claude claude you’re fired my friend we’re not doing that that’s not what we’re doing here hmm my gosh um oh oh oh oh this is the this is a problem we’ve had with this uh particular color input um hmm what is hsl for this cream okay 57 190 we just need to be in the 57 hue um yeah okay yeah this is this is this is this the uh yeah we still have to fix this still have to okay why is that that’s almost like the sage all right you know what we’re not gonna do this for right now we’re gonna do we’re just gonna stick with primary because i can do it with primary we can get away with just primary uh so let’s go back to backgrounds and text backgrounds let’s do primary we were already on track with uh primary ultralight i gotta refresh okay backgrounds and text backgrounds here we go primary ultra light we’re already on track with that if we keep it to one color we’re not gonna have any issues we can go back between light and ultralight and then these darks we can probably just go in i wonder if that’s ultra dark or dark i bet it’s ultra dark and let’s go primary ultra dark and that is in the primary palette maybe we go let’s see what i i think i’m gonna go primary dark actually i think that’s gonna be a good dark color for this i told you we’re gonna we’re gonna be able to get away with one color okay let’s go to the footer um navigate to footer footer footer footer footer footer edit okay let’s just toss in uh an image here because not having an image here is driving me crazy um let’s select image what we need is our gallery okay we are gonna separate these out um i’m gonna i’m gonna have them be able to exist in multiple folders i think there’s a setting in happy files for that because we need one for landscaping i’m not going to do the work right now of organizing all these things hardscaping and what else did we see ceiling or something it was a patio ceiling and then pressure washing pressure washing okay so this gallery oh god i don’t even i don’t even know how we’re going to tackle this okay get photo bulk up i think we should just take all of his photos um because we don’t have we don’t have time to go through these right now let’s go to artisanscapes let’s go to uh icloud photos let’s go in here let’s just choose a couple to bring in right now so we’ll bring in this one we’ll bring in this one we’ll bring in what else here’s some these are landscaping right okay so yeah all right they do sidewalks those are videos we don’t want to use those yet here’s landscaping don’t even know how good these are um let’s look at dude how do we can we sort this by like file type uh kind okay so all the photos come first i just want a few to pull in there was one really one a really good one i was looking at earlier it’s like a drone it was like a drone shot i was like that can be like a hero or something it’s gonna be tough to find though and this is the boring part of web design this is by the way the part you should factor into your pricing going through all of their photos and picking out which ones are good and not good looks like they do fences too i need to do fucking everything um oh i’m is it showing videos first okay it actually hasn’t fucking sorted anything okay how are their videos at the bottom all right there’s the photos we’re right into videos what all right are there only eight photos no these are photos too okay you’re no that’s a video dude max that’s a photo next to a video it’s clearly not sorting by there’s another photo it’s clearly not sorting by kind all right let’s get out of here that’s already pissing me off uh 1920 by 1080 yeah start sure we want to say uh landscaping just pretend all those are landscaping for now save we just want to get in here and have something to upload and we’re just going to upload them to the gallery okay go back resize format bring these in oh fuck they’re heic’s didn’t it convert it or is it not able to is photo bulk not able to convert it it’s uh format don’t change look at that what a fucking waste okay um well let’s just do that again and we’ll say change it thank you thank you is webp an option no of course not save okay back in here do it a second time all right uh rename two now we’re gonna have duplicates so let’s all right dismiss the errors i love how wordpress didn’t upload these but it’s still showing them to me as if it uploaded them it’s like hey i can preview them for you but no you can’t actually use them okay let’s go in here or did it or did it i’m so confused what i got errors but it worked okay let’s get this out of here get this out of here get this out of here now they’re one megabytes i don’t i don’t think i don’t think that’s the the play okay these are the jpegs um 6.7 we’ll be able to hei yeah yeah i don’t know um i’m not going to reduce quality to 80 percent because i’m going to reduce them later with short pixel so right now i just want to see um actually short pixel should be installed uh is it not installed plugins yeah usually short pixel does my work for me so i don’t have to optimize them in i just resize them in there uh yeah short pixel fuck are you doing lately what are you up to oh well we’re gonna have to delete that api key aren’t we so this is one of the challenges of uh doing this now you guys i’ve got extra homework where i gotta go fucking burn an api key all right um let’s let’s just let’s just move let’s let’s just move on where were we we were trying to get a fucking photo in the footer let’s just choose one of these things save okay it’s not not the best of photos is it let’s go this one okay all right there we go that’ll work for right now all right let’s think of a really good call to action let’s crowdsource this we’re at the bottom of a page um we are look at how this footer’s already turned out just because you know bg dark is in place and i and i changed it okay i really like that color that color is just it’s it gives me like a the warm and fuzzies like i you know it’s good good feelings good feelings okay i think this should just be the get get an estimate right let’s just go with get an estimate at least for now get an estimate we’d love to hear we’d we’d love to hear more we’d love to hear more about your project um we’d love to hear more about your project uh hold on hold on actually let’s let’s think about this for a second um we could we could give them two options ask a question get an estimate all right maybe we do something like this maybe because if they don’t what if they don’t want an estimate let’s just let them let’s just let them get in touch okay um now we do have a cta down here but now now i’m thinking that’s going to be a little much we can put something else down there okay get an estimate ask a question nope you know what we’ll do we’ll do view our work this will bring the gallery page into effect um and then get an estimate okay view our work get an estimate um ready to this is going to be stupid but it’s going to get us on the right track ready to transform your your property okay and then we just need some bullshit right here um we’d love to hear more about your okay we’re in transforming property all right uh i’m not going to write this yet uh let’s let’s go with ipsum short we’ll come back i’m just i’m just trying to get the flow of how we’re going to route people right here and i think like you got to the end of the page you either want to see more examples or you’re fucking ready to go that’s it okay like you’re ready to get an estimate or maybe you want to see more work right um so i think those two make sense hmm okay this probably needs to be button primary but the outline version right is that that is probably not gonna pass color contrast check so here’s where we’re gonna go button primary light okay so we’re gonna go button primary light which is probably not even turned on yet or maybe it is maybe it is um let’s go delete that replace get an estimate maybe this one can stay solid okay i’m liking that get an estimate it’s gonna be the primary cta obviously we have to fix our button colors but we’re on the right track now we’re not using white anymore we’re actually using the primary color we can verify that those are actually turned on they are okay great fantastic i think what we might want to do as well let’s go to the front end these headings right let’s let’s experiment with putting some color in those okay let’s go to heading color text dark all right let’s heading over to text and text dark is our default let’s go with primary okay no these are i just want to change my headings let’s go heading color let’s go primary dark i want to pop a little of that green a little of that green into the headings and then if we go to text now and sorry go to text assignments so dark dark and dark muted we don’t want to use black we want to go here again i think default text color is going to be text dark muted that’s going to give us the muted version and then this can be primary uh dark trans 70 80 that’s a little light 80 let’s go 80 let’s save so now we’ve got good uh we have heading hierarchy and size but now we have color hierarchy where these are darker these are a bit lighter slightly lighter okay the normal text so that’s good things are starting to come to life a little bit here we might pop in some patterns and things like that be ready to rock and roll with this thing okay let’s edit with bricks um we want to get rid of all these cards no reason for those this first card we’re just going to go query loop query type post post type services order by i don’t care right now okay let’s get the heading situated this is going to be the post title we’re going to go in the image we’re going to use the featured image of which there currently are none which is why we have to go back to our magic area let’s go out of the work we just gotta stop the work we’re doing let’s just stop what we’re doing friends and let’s go over here so patio ceiling you know what i’m gonna do for now because i don’t want to go through all of those fucking photos patio let’s just we’re gonna use placeholders right now how about stone patio whatever let’s go i’m choosing the first thing that even has a semblance of making sense power washing okay power washing power washing well not a car is that one word by the way i don’t even know it’s clearly not one word okay power washing come on guys okay this is just bad no options dude everybody’s washing who washes their car with a power washer first off like absolute savages pressure washing it’s probably a better pressure washing is probably gonna win in in seo anyway i would imagine dude for real like is there’s there no normal people pressure washing something gosh this is ridiculous ridiculous ridiculous look at this look at this unsplash okay um envato envato to the rescue photos photos pressure washing let’s just give it more here we go fuck it let’s do this one um download without license okay great what else do we need um landscaping okay i think that’s something that unsplash can handle landscaper let’s do landscaper these are not landscapers landscaping company landscaping company man it’s like i’m fighting for my life trying to find some trying to find some just decent stock photos that we can use quickly okay hardscaping does anybody even know what that is in this uh photo world oh we already have a hardscaping photo i think we’re we’re good there okay let’s go back to our magic area let’s go uh services all services one two three four open patio ceiling okay set featured image patio ceiling and we’re just actually these all go in placeholders so where are my downloads there they are right there where are you where are you photo bulk okay done bring this in all right placeholder place holder start save okay bring in bang okay all right we’re just gonna it doesn’t really actually matter at this point uh power washing i love how the sidebars collapsed every single time i need it save let’s go to the next one open landscaping which we already don’t we already have yeah this not the best photo but it’s okay we’re just going for speed right now that’s all we’re doing it’s trying to get to a finish line of some sort save okay let’s head back to we can go close close close close back to the home page hey look at this okay edit with bricks let’s change just style this up a little bit content wrapper heading um okay the content wrapper is the thing we need to fix backdrop filter backdrop filter background primary um primary probably just um primary and then not light go down with a little bit of transparency something like that typography and go with maybe uh oh that’s not inheriting okay let’s go to the heading typography uh let’s go in here with semi-dark first of all is that even changing anything let’s just change okay oh what the fuck is that what is it doing let’s go to the front end and see why it’s not inheriting oh it is i think maybe not all right we’ll come back to it um pretty subtle pretty subtle it’s not crazy we’d have to check the color contrast i’m pretty sure it passes we can’t go light with it okay i don’t know uh we’ll we’ll maybe let’s go maybe less transparency i don’t know i don’t want to spend too much time on on these kinds of uh decisions at least right now so let’s go the one thing i have to do is go from grid three to grid two see how that lines us up dude if bricks takes me out of the builder one more time when i’m just trying to preview i’m literally holding command when i click that link too okay all right um does this take me to where i need to go no all right let’s go make this a link uh is clickable parent being used on here i don’t where is where is the okay yes clickable parent is being used so that’s fine um let’s go url post url save okay watch this i’m holding command click fucking takes me out of the builder okay this takes us to the patio ceiling page that’s all good all right we’ll come back to that i’m not i’m not sold on the colors here so we’re going to come back to that all right the next thing we’re going to need to do is we’re going to go acf post types add new and we’re going to go reviews review i you know what test i i like reviews it’s shorter it’s shorter okay advanced configuration urls front url prefix do we need an archive page for reviews no no we don’t need one uh in fact we don’t need we don’t need urls at all let’s just not make them publicly queryable okay let’s go to reviews add new review okay let’s go back to artisanscapes ga let’s put this on top of this okay fantastic let’s go to reviews um am i in review here i don’t even know what i’m in anymore yeah i am i am in review dude look at this look at this experience right here that we’re getting with with the old wordpress okay all reviews just look i mean have you ever seen a more modern uh responsive ui in your life i mean this is this is cutting edge right here that we’re getting from wordpress um add new review okay all right ginger you’re in ginger hudson you’re nominated okay let’s put her in bang there’s her thing uh we’re gonna get we we’re not even gonna use we’re not even gonna use headshots we’re gonna get rid of headshots um everything’s gonna be a five-star review that’s all we’re gonna pluck out of here let’s just go with publish publish and go back okay add new review ralph you made the cut you made the cut ralph congratulations ralph wade made the cut publish publish uh what i may want to do here is let’s go acf taxonomies okay see this is where the centralized taxonomy architecture kind of concept comes into play i didn’t want to do it on this site but you’re gonna see why you kind of need to do it um because we got to come in here and say review categories or i you know what you know what i’m gonna do i’m just gonna use fuck it i’m just gonna use the default categories i’m just gonna use the default post categories uh let’s say landscaping okay add new category i mean if you’re right blog posts they’re gonna go in these categories anyway landscaping uh let’s do hardscaping let’s do patio ceiling whatever all right and then let’s do uh what was the other one pressure washing i’m i’m going with i don’t know this is where you gotta go you gotta go which one is it pressure washing power washing which one you don’t want to go with don’t know uh i think what we have to do is acf we’re gonna have to go to aren’t they available on let’s go feel post types we have to enable that on reviews i never use the default okay let’s just go to it and see reviews am i allowed to to categorize it no there’s got to be a way to turn them on right there’s got to be a way to turn them on we’re not gonna we’re not gonna deal with it right now we’ll categorize them later uh tanya congratulations tanya you’ve made the cut tanya bunch uh mark look at you look at you mark coming through for the team okay add new review how many i you know what i’m good with three fuck it i’m good with three we don’t even need more than three let’s go to the home page okay we can get rid of this all right let’s go edit with bricks i’m gonna do my buttons next and my links because those are starting to uh get on my nerves okay we can delete uh this card and this card and then we can just loop this card query loop posts reviews okay post per page three fantastic opener up um icons icons icons icons those are all good but what we’re gonna do is we are going to where is the css for that icon color primary okay not primar he primary um dark semi-dark there we go primary semi-dark to the rescue okay this is already good uh we need a we need a we need a call out okay we’re gonna do that in just a second we’re gonna bring this in as the post content um 12 16 26 gotta find the magic number 30 dot dot dot okay save whatever um how much seems like it can even support 40 okay we’ll just keep it there uh let’s go down to footer wrapper avatar can just go bye-bye and our title it can go bye-bye actually no bring that back okay all right uh i’ll show you what i’m gonna do with this okay this is actually gonna be the this is gonna be the source okay source and we’re gonna bring that in in just a minute but it’s gonna say uh verified google review right something like that and then we’re gonna drop this down to s and then this is gonna actually be the person’s name which is effectively just the post title that’s that we need a quotable okay let’s go back to our magic area back again not that magic area we got a different magic area all right let’s go with um acf field groups add new reviews call out and select review source okay google yelp should be good uh sign this to reviews save reviews all reviews okay open open open okay this review call out this is a google perfect after having a lot of sheets moving around i need a solid we’re extremely we’re extremely happy with their work uh okay there you go there’s your call out bang save all right next one all right communication through the job there you go fantastic workmanship and communication bang that’s our call out bang bang save okay uh next one you know did an awesome job professional pays close attention to details always leaves the area clean be hiring all right we’ll be hiring i’m not even gonna copy that we’ll be hiring again for my next project exclamation mark save we’re so excited yay all right let’s go back um let’s go to here refresh delete delete delete delete delete delete down to here okay call out bang and good um down here verified source review save look at that fantastic okay let’s get these buttons done automatic css buttons primary all right we want to probably go ultra dark or just dark just dark that’s all we want just dark um on hover probably dark also for hover nice okay secondary actions fine all right our buttons look fine now should all be good uh we need to do these okay that is light okay primary ultralight is good primary primary dark for that hover looks good that already looks good let’s just save okay good little customization there done all right all our buttons are fixed reviews look good let’s get in and say what um what our customers are saying let’s remove the max width from those okay latest reviews latest reviews okay what our customers are saying do we need an intro to this no okay gone services choose a service below to learn more about what we do okay super boring uh we don’t need an accent for this gone all right um we’ll have to come up with copy we’ll have to come up with a call to action here i would say this is get an estimate okay so we’re going into winter they could change they could actually change this out it’s kind of they can put like a seasonal kind of cta there okay let’s just fill this real quick i want to get uh photos actually you know what we’re not going to be dumb about this we’re not going to be dumb about this we’re going to go okay how yeah how can we approach this how can we approach this i was going to loop through them um but it’s going to require two loops and then i would need to offset by four but i don’t know if you can offset while also choosing random photos so i’m just going to put it back i’m just going to put it back for now we’ll just do we’ll just do the manually for right now okay bring this over here we’re going to pretend like we have lots of good variety okay so it’s not going to look amazing um but you know it is what it is some of this is just trash stock photos but these should be super easy to plug in and we’ll just decide which good ones go later look at bricks just not even giving a fuck that i just put those in my bricks is like no i don’t think you did buddy okay here we go i don’t know why i don’t i mean you guys saw me clearly uh clearly i chose some photos okay let’s put this we got duplicates so we’ll try to keep them away from each other there you go uh let’s go back to placeholders use this one again can never have too much sod all right save all right fantastic there it’s coming to life it’s coming to life look at it it’s coming to life okay still not sold on this area every time i go past what is this by the way what is happening in that area what in the actual is going on oh yeah we don’t need that you don’t need that want to hide 100 vh what are you doing you don’t need all that all right that’s good that’s good that’s good right transform your property all right how about before we forget um actually what what what do we want to do next let’s go back to the front end uh yeah i think i think uh what what is there what is there uh artists and artisan artisan artisanscapesga.com building dream landscapes one stone at a time not super sold on it okay not super sold on it but it’ll it’ll do for right now it’ll do for right now i don’t even think we need a comma there um okay there’s just random capitalizations in here that we don’t need uh okay artisan scapes i’m gonna say uh georgia landscaping company this would actually be probably where you want to go h1 here and you want to go p here right custom p but you want to bring in uh all of the h1 h1 styling see that now you have this for the seo this is like the seo headline it’s an h1 this is just a paragraph that looks like a heading uh and all is well in the world so this will be a nice little intro this will be what do we want our primary action to be right get get an estimate and then uh this would be like our services you just get them straight to the services from bricks what are you doing okay save let’s go ahead and link this up to internal uh see this is the problem with this internal post page bullshit you can’t uh can’t do cpts right services get an estimate this one is a real page estimate okay save all right and this this actually should be um you could seo this a little bit more you could be like landscaping services okay we’re gonna need some stats in here figure out what those are gonna be we’re gonna do a little mission area here’s more links to services social proof little cta before we close out here um i’m thinking we i want to do some sort of divider between these areas right here but maybe not quite yet uh i do need to go to the footer how are we doing on time are we at the uh let’s edit this 11 12 1 we’re almost at two hours okay uh lima bottom style background bg dark we’re gonna go in and do some uh seo in just a second because i know it’s something we like never do uh that people kind of want to see often right hmm where are we at for section spacing spacing section spacing three two 16 gutter 60 pixels okay all right that’s not bad but i think we need less here i think we just need like um one m yeah okay good um all right what do we want to say down here like do it writing copy is the thing that needs like it’s writing copy on the fly very difficult to do very difficult to do okay um services footer link delete delete delete delete delete content query loop post type services nav link post title custom url post url okay bang discover uh this is going to be like our company this is going to be uh like about us this is going to be get an estimate uh and then this is going to be contact us why is bricks refusing to update the fucking canvas what i just filled this out get an estimate okay uh internal post page this goes to estimate this goes to internal post page about this goes to internal post page contact this goes to the trash okay save great great great great great fantastic all right let’s go back to the front these are good these are good okay we got this nice little strip down here we’re looking good we’re looking good uh that’s not a link and it needs to be a link um templates header just link that up real quick okay div call this a link wrapper and html tag a link link to custom url home save okay uh let’s do this nav alpha style css primary dark yes okay um 0.5m border color link color link color um i i i just i every time i get hives every time i have to use the the bricks menu element just i just i get anxiety i get anxiety sub menu it’s a fucking thousand panels 8 million controls background okay colors um bg ultra light we need a box shadow you’re gonna have to have a box shadow on that um oh god i don’t think it’s gonna support it here do we have a box shadow m in here additional styling box shadows ah reset reset reset reset okay it’s got old defaults in there i don’t even know if i don’t know what the hell just happened let’s go to the let’s go let’s go let’s go the front end what just happened something happened in yo bricks bricks just ignored half the shit i just did okay uh let’s go back here bricks templates wow phenomenal um okay all right now i know what i what we wanted to do though primary dark okay and then go to the sub menu and go to the background and go to here and go to colors and go bg ultra light and then go uh out of here into box shadow and color raw box shadow m okay save we just need to see if if it would quit taking me out of the builder that would be even more helpful okay it’s not putting i wonder if bricks fixed that that was kind of like a back door to getting a box shadow in bricks um what are we looking at dude header okay um so essentially you just have to write custom css now to do this i guess uh because you can’t there’s no way to put there’s no other way to put a like your box shadow variable there’s no way to use a variable for box shadow okay okay okay bricks bricks inspect a uh button svg no no no no no no no no no it’s this ul sub menu okay okay okay let’s go back into here let’s go uh css root oh there’s already a root sub menu look at that box shadow box shadow m the fuck where’s the box shadow root sub menu yeah should be should be there should be there just check this let’s just see you gotta do a border check now border five pixels solid red are we doing anything oh yeah it’s allowed to have a border okay um think about this think about this uh border radius radius save go to the front end just wonder why we’re not is is it even showing up in the code you know what i’m gonna do i’m gonna go check let’s go check on something else let’s just go can we have are we even allowed to have a box shadow at all um let’s grab this box any box will do that one’s allowed to have it i wonder if it’s over it’s hiding overflow maybe fucking box shadow right there dude right there what okay maybe it has it maybe it’s but i’m not seeing it in the white area up here okay let’s do this here’s how we’re gonna do this now box shadow zero zero five pixel 50 pixel red huh guess it does have a box shadow you just can’t fucking see it all right box shadow l save maybe we’ll do a custom one if maybe it’s because of this box shadow i see it down there now i see it at the very bottom but the problem is um and i i don’t think i want to change that here we’re just gonna make our own zero zero uh 50 pixel no 30 30 pixels zero pixels primary dark trans 20 uh 40 40 that’s a bit much that’s a bit much it’s a little bevy that’s a little bevy um let’s go 30 just dial this in 20 okay that’s better that’s that’s that’s getting there we don’t need to be in that builder that will fuck some things up okay uh that’s a little bit that’s a little bit better little bit better okay um okay i want to do a service page let’s go we just need to go static content so let’s go services um actually this needs to be done on the templates so services single edit with bricks vote for dropping shadows for seo i don’t know what that means um okay so this is going to be landscaping okay this will be the landscaping intro get in get a land do we want to go capitalize or no caps or no caps maybe no caps get a landscaping estimate so we’ll inject the name of the of the service in here selling point one selling point two selling point three this will be a featured image okay i have no what where are my landscaping photos let’s just keep using the same one everywhere that’s fun okay okay nice and simple yeah it is correct but whatever all right this one we go oh gallery alpha do we want to can’t you loop these from a happy files category or you have to use a different element i know i hardly ever use this element um dynamic data large i mean it’s wanting dynamic data image caption i thought i thought i thought one of these could doesn’t it have a happy oh is it this one you got to use a different element folders here we go gallery there we go okay columns six um which we don’t even have six in in there right now uh max items 12 okay we’re gonna we’re gonna want like a two row situation i don’t even know if it’ll i hardly ever use these um spacing content gap how about divided by two uh height 300 pixels order by date no crop include subfolder cap oh let’s just include subfolder for right now does that even work i don’t know if that even works save what we want to do is go gallery section alpha zero all sides and let that go to the edge of the screen okay the fact that i can’t get okay there we go okay it clearly does not pull from subfolders uh but if we had enough images we’re just gonna do this real quick uh landscaping company okay we’re gonna go i mean it doesn’t really matter these are so bad these are just so bad okay let’s go into is that all it’s all you get it’s all you get okay mowing lawn let’s try let’s try things that are more specific here um okay dude these are so awful all right okay all right i just mmm planting flowers planting bushes okay geez look at this this is so this is so bad okay i’m about to give up on these um let’s go to photo bulk okay downloads uh-huh uh-huh i’d love it if it like sorted them the date added does not clearly it does not uh does not care about like you know hours be nice if it did because now these are all fucking mixed up placeholder placeholder placeholder save okay all right um let’s go content here we are uh gallery yeah i gotta go sorry sorry gotta go back to the uh the magic area you can’t manage your media right there gotta go back here to do that add new media files select files it’s gonna be here boom put them all in gallery can you can you do this now or do you have to do that ahead of time i don’t even know because this is uh media management from fucking 1997 add new library okay yeah they’re not in the gallery okay where are the ones that i just uploaded here we go all the way down to here i guess gallery there you go everything is like pulling teeth around here damn it i’m too short two images short but you get the idea you get the idea right we’re gonna have a nice little it’s like just a it’s just using an image gallery as a divider for your content it’s all we’re doing it’s all we’re doing okay you know what we’re gonna do uh go to media go to all uncategorized what’s uncategorized throw this in throw this in okay that’ll at least get us uh our gallery filled out there we go okay good now these i would pull also from happy files uh i would actually query loop these also um like i would delete delete i would uh wrap with a div this is gonna be the loop and i would just say query and post type media and then uh i think you come down here include um category terms uh this is landscaping right so we pull from the landscaping and then we just tell it that we’re just gonna loop through three or four or something like that um and then we come into the image and we delete that and we use the uh post id i believe save that should get us that should get us something going on there we don’t need this header builder anymore we need our media library there’s nothing in the landscaping folder so what we’re gonna do can i see a grid like can we get a better situation here so landscaping landscaping landscaping landscaping look at that okay now we go to the services page voila just builds the fucking page for you that’s all you need to know all right um where are we services i am a heading all right so landscaping okay a great headline about landscaping services goes here okay uh we’ll do that this will be actually switch this out for a rich text element okay and this will be maybe supporting like look how much room we have i don’t want i want maybe a max of two paragraphs right there let’s not go three’s a three’s a bit much and then you go talking points and then you go get an estimate again html tag uh link type uh internal post page estimate okay all right and then talking point about landscaping i would say a max of like three of these so we just go don’t need you don’t need you okay oh dear okay pop this in thank you uh icons what do we need what do we need check let’s get a simpler check mark simpler simpler simpler check mark or maybe like one of these badge check marks something i don’t know i don’t know svg might try this fancy one uh uh uh uh uh uh uh uh uh uh uh uh and then aren’t they called ticks also yeah okay me just something super easy like this okay uh just upload them figure out which ones we want and delete the others icons okay let’s go you you and you okay nice okay icon icon icon icon what do you look like let’s go let’s just take a vote i’m gonna let you guys vote there’s our fancy one okay let’s get this one a little bit tamer mm mm mm mm mm a b c which one a b or c a b or c while you guys vote on that i’m gonna go to list alpha and i’m gonna set our icon color which one of these is it is it the stroke color it is the stroke color we’re gonna set that to primary dark um or we can set it to text dark muted i’m gonna go text dark muted let’s go text dark muted a a a b b b god you guys can’t come to a consensus well nobody likes c that’s the consensus nobody likes c so let’s get c out of there all right c you’re gone down to a and b a b b a a a you guys are like doing a nintendo cheat code all right um a but bold listen listen how much you paying how much you paying for these requests huh huh not much uh i don’t even know if we can yeah we’d have to re-download it sorry you don’t yeah you have to you have to re-download it to get a bolder one okay they can’t b if light a if dark b if light a if dark okay let’s let’s go with b for a second here okay um figure out if you guys like that still let’s go with a where’s our gap situation let’s go maybe 0.75 on the gap yeah yeah how about we go content gap divided by two okay that’s not bad it’s not bad right it’s not bad pretty good no b bold a all right all right i’ll entertain you i’ll entertain you let’s go to here and we can go to two or even three how bold do you want it how bold do you guys want it two two or three two or three two vote quickly it’s the last one we’re gonna this is the last customization we’re gonna make it’s not in the budget to be having all these opinions two or three two two two two okay save all right let’s see what we get here so that’s that’s b let’s just duplicate this okay now we’re going to replace these with this one what’s going on there that didn’t look very bold is that the right one those look exactly the same those look exactly the same let’s go to three is it even caring is it even mattering it apparently doesn’t matter oh gosh three yeah they don’t the one that downloads I guess you know let’s try this let’s try two let’s try copying it let’s try figma let’s try new design file vector no no no no no no we don’t want that where okay yeah I was like where’s export it like just popped into place okay svg okay check thick let’s see let’s just do it this way can we trick bricks I don’t know what was going on there there it is bruh bruh you’re killing me absolutely killing me sorry we can’t have a thick check mark all right do you like it the way that it is which one let’s go let’s go back to let’s go to the front end which one A is the first set B is the second set A or B B but use primary semi-light stroke color A or B A or B I need more than one opinion B B B B B B B B B A A got A got trounced in the first set there sorry A you’re out okay all right B’s are B’s are good B’s are in all right you know what we need to do now though we need to go to contact we need to fix that too up there but we need to edit with bricks this is where components would come in very handy and see because we don’t have components we have to do this like a chump okay and then is this not yeah list alpha hold on fr list alpha okay this is correct um okay delete delete duplicate duplicate all right um okay company talking point company talking point company talking point okay um did this already get done with dynamic data where’s the badge where is the attribute rating icon icon where is the attribute you know what i bet this was an old version of this no no no bricks don’t take me out of here okay let’s go where else did we have that we had it we had it somewhere uh oh it was the estimate page right here okay edit with bricks steal this and put it here yeah that went in the wrong place thank you uh it’s still in the wrong place there we go brick still can’t brick still can’t pre brick still can’t pre oh now it can preview it okay my gosh contact that’s how i’ll do it now i’ll just open it there okay good oh boy okay mm-hmm mm-hmm mm-hmm all right i need to fix this header getting on my nerves okay nav alpha style css link color hover link color active primary ultra dark primary ultra dark yeah yeah yeah yeah yeah okay okay should be fixed oh my god how many builder instances do we have open whoo okay visit site there we go there we go about it’s still not um i think what we’re gonna do okay okay okay okay header link color text dark muted now you should be able to see some semblance of difference there you go between the selected page and the non-selected page okay think that think that will work all right um all services okay we gotta fix this let’s go ahead and grab we can just steal it from in fact what i’m gonna do is this grid right here feature grid india is just gonna be our oh i don’t want to do that services grid and then feature card india is just gonna be service card uh bim service card why still not uh still not sold on that color scheme that i’ve got going on right there but doesn’t matter right now right click save as template feature grid india service grid save as template okay save uh let’s go to services archive edit okay delete this grid pop in the one i just saved insert fantastic grab this grab this i think yeah i think it’s all i think it’s all fine it’s all fine and dandy except it needs to go in that section thank you okay let’s see if we can do the logic real quick for this um for this footer uh to do that i need to go out okay let’s go to acf field groups uh add new field group visibility visibility visibility visibility um yeah i think i think i think we’ll do that i think we’ll do that okay uh assignees to pages and oh wait no no no no no add group or um post page post or service or custom font template template and not template policy page post i think that’s all we need page post service visibility what is it called option toggle switch the fuck is it called select true true false okay great uh hide uh no we’ll just say footer footer cta footer cta footer cta um this is they make this so confusing so confusing validation required no presentation okay we gotta think about this because all the pages and posts that are already saved it needs to default to true right like or when we do the logic i guess it needs to default it’s like is not false like it’s yeah if it’s is not false that’s probably what the logic is gonna have to be otherwise you have to go to every page in every post and resave it in order for this field to even put any data in the database uh very annoying just because we’re dealing with a 2005 you know level cms so it is what it is all right so if i go to like for example pages estimate we’ll just use this one as our example uh i should be able to come down here oh i want the stylized ui i if we’re gonna do it it needs to be pretty so where is our stylized ui presentation stylized ui uh yes no okay save i don’t know if it actually outputs yes or no i actually don’t know if it outputs zero one yes no or true false so this is gonna be fun uh let’s go i’ve all most of the times i did this in the past was with metabox so uh all right estimate we should have a stylized ui now for this so we’re gonna say oh this is confusing as hell um okay yeah what is it is that the default is defaulting to no how do i want to do this acf field groups what happens when i check that box so let’s go default value i don’t even know what that means like that’s so non-friendly of a label okay pages estimate ah yes the problem is in order for it to equal yes you have to save every page so we have to make the we have to make the logic of the label hide footer cta and then the default will be no so let’s put this and this one can be yes but we need to change the logic of the label uh so let’s go back acf field groups visibility i don’t like to do it this way but it is what it is hide footer cta default is off save so now if you go to pages and you go to estimate it is set to hide footer cta yes but if i go to another page like about it should say hide footer cta no and that’s what we want because we don’t want it hidden most of the time we just want it hidden on pages like estimate so now what we’re going to do is go to the template itself where the cta exists and apply a little logic to it and we’re going to say grab this whole cta bravo open conditions add condition uh hide footer oh oh dynamic data footer cta acf footer cta contains does not contain does not contain true i think this is the hardest thing in the world for a fucking dyslexic person okay to work through this logic in your head um it’s way more taxing than it should be let’s get to the front end let’s go to get an estimate of course of course okay so uh true false one zero yes no does not contain no show it if it does not contain no still there uh zero or one i just wanted to go away at all oh you know what yeah there we go there we go does not equal one done done done done okay now the real moment of truth now see this is the problem this is this is the problem watch if i edit this page and resave it is that what you have to do no that’s the wrong logic because about should be hidden why don’t you use bricks conditions to hide the footer ct on certain pages because then when you’re adding a new page you can’t control it from that page you have to always go back to a different area and then nobody even knows you set the conditions there so um yeah okay um let’s think about this logic for a second where i could have i could have swore we had the right logic so remember we’re doing the logic for showing it like it’s going to show it and then we have to remember what we did with the label which is like hide footer cta so true is one right can we all agree on that true is one what happens to the about page if we put zero the about page doesn’t want to show it at all this is yeah this is clearly backwards okay so it seems like one hides it there but why are we not getting it on the about page is the question these two pages have opposite values but they’re behaving exactly the same use acf field value does not equal one um you’re just missing the value after the field blue red panda you’re gonna have to explain that uh in a different way we’ll come back to it in a minute but we’ve got it halfway uh we’ve got it halfway done don’t put it in the hashtag queue though I’m in the regular chat I’m not in the questions area we’ll get to questions in just a minute because I’ve got about 20 minutes and then we’re gonna we’re just seeing how far we could get in our little time block for today um yeah you’re gonna have to uh explain yourself a little further there buddy I want to go edit this page save let’s see if flipping the switch actually does anything right instead of does not contain I think he’s saying does not equal um I okay I mean we could try that it’s to me that should be the same logic but uh let’s let’s try it it’s not working now so might as well give it a shot right uh we don’t want to be in the header we want to be in the footer cta bravo conditions does not equal uh does not equal save okay okay let’s go to the front end artisan scapes okay maybe it does maybe it does matter about equal okay moment of truth gone all right good good good what was the other one uh contact right okay so we’re gonna edit page flip the switch bang bang contact page should be good now no footer cta on the contact page fantastic all right we’re in business so here’s landscaping uh which is this is just static content for now okay we needed uh we never finished this okay good this is what jumping around gets you okay edit go to bricks templates it’s the service single all right we’ll try to do this with dynamic data really quick just to finish this out um so this will be a central cta headline something like this headline um paragraph call to action this probably needs to be a button button and we’re gonna do button primary light button outline okay cta text will go there here if we we have like a background image or something like this there you go that puts some life into that area uh we have our uh reviews landscaping landscaping landscaping reviews okay um here’s what customers are saying about our landscaping services all right uh let’s go here layouts width boom do I do I have balance on yeah and maybe we want to balance those let’s balance our headings okay um okay that’s good there I think we can get rid of this uh and faqs ah that’s one that’s one thing we need to do real quick okay then we get into there all right so faqs faqs faqs faqs uh post types add new faqs faq faqs advanced permissions urls undo that no archive needed save um where did we do we ever figure out how to assign the normal categories to ah right here category there it is save and then we can actually do that for reviews too post type reviews category all right now when we do our reviews add new faq how much does landscaping call we’re gonna delete these okay um I don’t think ipsum short I don’t think our recipes applied it in there okay bang that’s gonna be that all right oh we need to do seo too before we get out of here because people want to see that they want to see it okay how much does landscaping cost uh we should be able to categorize that now yeah landscaping okay save now we’re gonna go to um you know how much does pressure washing cost just so we can see if we are properly doing our loops uh pressure washing okay publish publish save okay great fantastic all right um we’re we’re still probably gonna run out of time on this but we’ll get as far as we can all right uh services single edit okay i think we’re gonna split screen this let’s get rid of this this this this uh we need another we need an admin that’s what we need put that right inside of there fantastic acf field groups services single okay all right so let’s think about this here um i actually just need okay just to see the oh geez come on ah okay give me the dude for real now it wants to open in a tab doesn’t it never wanted to open in a tab before but now now now now it wants to open in a tab okay we’ll just hide that that’ll give us enough breathing room all right um let’s go group used to not be able to group these right uh but i think you can now duplicate this is gonna be gallery um interesting how we’re gonna have to think about how we want to do that but i don’t think we need to worry about that now okay so content we’ll say uh main content we’ll do main content section okay duplicate central cta okay wait a minute wait a minute wait a minute where’s the one i duplicated bro what happened to main content okay central cta group uh reviews we don’t need one for faqs we don’t need one for uh maybe we do if we want to we want to customize no we might be able to limit let’s limit this as much as possible right just stick with those for now i’m sorry am i in a different fucking place like i feel like deja vu was i down here no i don’t know what’s going on i thought i already named the field group i thought i did a lot of things okay service all right hero group this is going to be we need a uh heading hero heading we need a hero lead right uh we’ll make that a whizzy wig okay um the buttons we’re gonna we’re gonna leave alone okay again we’re gonna this this is gonna be the featured image okay and then uh we’re gonna do hero oh i hate these i hate these okay um because really what you need is a group inside a group and um i don’t think you can do a group inside a group in bricks i don’t it won’t render okay uh so let’s have just figure out how to name these so selling point number one heading this is it’s so messy the way you have to do this um selling point number one text okay uh duplicate duplicate great um two okay and three nested groups now works in metabox might work with acf well i mean fuck it let’s try it might as well i mean we’re here let’s figure out something let’s learn something new okay add fields group uh talking hero talking points i’m just gonna do one of them because then we need to test it um you really need you really need you really need a repeater here um the way we can i think the way we should do this no no no we shouldn’t do a repeater it’s got to be three you got it you got to make them have three hero talking point number one that’s what we’ll do we’ll just do it like this okay and then we’ll just do heading and text so uh text nope nope nope text okay hero talking point number one heading you got to name them like this because there’s no organization in the bricks drop down uh this is going to be a let’s make this a text area hero talking point number one text great and then i can just duplicate this group okay duplicate duplicate and then this is going to be two two um you know what i’m just going to say heading fuck this is too much work uh can you can you can you conflict the field names even because you’re in a group right you should be able to we’re in the land of the unknown right now talking point text we’re going to find out we’re just going to find out how far can what are the limits here what are the limits let’s delete this okay and duplicate this for three three three and then those should not have to be touched theoretically theoretically okay there’s our hero let’s just go let’s just go find out how much of a disaster did we just uh encounter okay let’s go back here let’s go to services all services uh landscaping 15 minutes 15 minutes okay um what i want to do here is acf post types services get rid of the editor save services i hate to navigate like going to all these fucking places so awful edit okay drag this up here hero heading this is my hero heading okay this is a lead paragraph for the landscaping hero section hopefully you can see it okay here’s heading number one text number one my talking point my talking point text okay another talking point more talking point text we’re just experimenting does this nested group stuff work okay update bricks templates service single okay um hero heading oh boy okay um there you go lead get a post title estimate featured image great selling point one excuse me excuse me excuse me what what oh it’s talking point okay uh talking point heading one oh so far so good so far so good wow looks awful when you don’t put enough content in doesn’t it uh let’s go to what is going on here though oh i know what’s going on there it’s generating extra paragraphs because that cannot be a paragraph tag save go back refresh that looks better okay okay um all right we got it let’s let’s let’s jump out of here we we got half the dynamic data done i would say a third a third of the dynamic data done let’s do some seo work here okay we’re gonna go seo using seo framework here um okay so this is the home page settings we’re gonna go uh we haven’t done any seo research whatsoever yet uh okay i love using uh claude for for these fucking stupid meta descriptions for an atlanta landscaping company description for an atlanta landscaping company okay uh design installation installation maintenance services do better okay all right whatever let’s just steal this for right now it just makes look at the shit it just makes up on the spot it’s like yeah since 1995 sure what is its obsession with installation okay we’re gonna take that out elevate your properties beauty values free consultation available okay premier landscapers yeah gosh terrible outdoor havens claude you’re you’re terrible at this okay save settings we’ll just do this for right now what we need to do is go to where i’m used to rank math most always in right here we go service okay services artists and landscapes archives oh is this the archive setting this is just the archive page for services okay so landscaping services in atlanta artisanscapes okay do you need uh land uh yeah landscaping hardscape i’m just gonna throw them in here land hardscaping what was the other one uh patio patio ceiling um ah i don’t know i don’t know let’s let claude do it too much thinking too much thinking write one for the services page stop saying design and installation okay okay let’s just use this bit right here okay pop that in uh land and landscaping lawn care hardscaping tree service and irrigation residential commercial outdoors residential outdoor spaces okay um save okay um reviews should not why is reviews in that list is that what i saw reviews in that list no policies okay that’s fine um let’s get rid of i don’t think i want a policies page post types policies i don’t want an archive page urls uh urls archive turn that off okay um let’s go to services and then this is where you would do the uh let’s go to landscaping you would do it down here professional landscaping damn it damn it okay we offer we offer and then it’s just gonna be like naming landscaping shit um landscaping service one landscaping service two um all right we’re just gonna put some placeholder shit for right now people just wanted to see like where this kind of stuff gets done versus like what gets done in this back end area over here um i’m not gonna go through all of the individual settings did the home page um post type archive pages are right there social meta settings okay come back and double check all these later got our site map that we can submit to google search console we’ll check that real quick okay let’s see if there’s any nonsense in here ah see the faqs are in here i do not want them in here it’s why you need to check your site maps because that kind of stuff happens all the time post types faqs uh didn’t i say ah i thought i marked it as not publicly queryable okay so now that’s not publicly queryable we should be able to go back to our site map and all the faqs are gone look at these templates right here we don’t want these templates in our site map bricks is notorious for this right um so we go to seo and i think you can where would we find again i’m used to rank math where would we find those templates does anybody know where the indexing here we go here we go here we go no index to services my templates apply no index to template tag template bundle tag we’re not using tags um okay let’s go see save that removes them from the site map okay good and all we’ve got is sample blog posts which are fine except for i would like the blog slug to be in front of the blog post so we go to settings permalinks custom structure blog save our services let’s let’s reset the let’s save a couple times services should still have correct urls uh landscaping view they do because i told it to not put on the front slug but now if we go back to our site map see our blogs have blog in the url now so those are all kind of compartmentalized which i really like services are compartmentalized then you have some random pages like estimate about contact um we would throw in a service area network eventually but you always got to check your site map because see how we had templates in there that we didn’t want we had faqs in there that we didn’t want no good um so yeah all right um all right let’s do some questions and let’s get out of here let’s go to search hashtag q okay what are you using for location pages with a small local business like that uh just acf we would do uh just exactly the what i’ve shown in terms of um i’ve done a maybe two or three different they’re in the inner circle i think but uh two or three different trainings things on building on building a service area network it’s just acf just custom post types um taxonomies things like that which seo tool are you using now so on most projects now because i’ve found that i just really like to keep it lightweight and streamlined seo framework just does almost everything that i need super lightweight really good performance okay um i already answered that one on bricks conditions uh tudor says rip to the questions now we’re doing them right now can you create a tutorial figma to acss um it’s yeah we could for sure it’s not i mean it’s not much different than other tutorials that i’ve done where i’m building a site you’re just looking at a figma and doing it based on that i noticed that we don’t have primary ultralight trans x in colors how come uh because ultralight is already usually and especially the default for it is already so light that if you do transparencies for it you can’t even like it doesn’t even really register um wait oh you’re saying ultra dark primary ultra dark you do have ultra dark you do have ultra dark transparencies um like if i go to let’s just edit with bricks what i still want to do to the site we’ll do a little recap real quick of what i still want to do uh that shouldn’t take all that much more time but here’s here’s a background background primary uh ultra dark and there’s your transparencies right there for primary ultra dark so they are there they’re just not there for ultra light because ultra light is already so light that when you make it transparent it’s just not even worth really having transparencies for but you do have transparencies for light by itself and then of course just the primary color by itself has them as well so what i want to do just to seal the deal on this is i want to add a background pattern of some sort right here to this light area um let me hide that so this is gonna have like a light pattern up so a lot of these like white sections will probably just be patterned like those have a very faint light pattern in them um we have to finish the copy obviously everywhere uh we have to put in the photos real photos all placeholder photos have to get replaced with real photos um we’ll put in more content right here for about the company we’ll make sure that the testimonials get looped on all these pages get the owner info in um go to make sure all the services pages have their real content in them but they’re all going to have the exact same kind of layout the super basic uh we’ll make sure the contact form gets routed we’ll make sure this content gets done here we’ll make sure the estimate form gets routed as well we’ll fix the labels on these this is pulling in the services but it’s only pulling in the id we’ll pull in the actual uh post title and um then we will put in analytics and then we will do uh we’ll submit the site map and we’ll put in uh some perf matters optimizations some uh just general performance optimizations and yeah then it’s good then it’s good to go so what what i might do is do i’ll do another live stream it won’t be next week because this thing needs to get done so maybe if i have time tomorrow or the next day we’ll hop on again so look out for another stream we’ll hop on again we’ll do one more stream see if we can get this thing buttoned up i think we got three hours i think we got a good amount of progress done right um some of the stuff is like going through 500 photos in a folder that they’ve given us like which ones are the good ones really getting all those optimized right getting them in the right places that sounds you know time consuming where it’s like we got the bones of the site all built it’s just now we have to sit down and think about what we want these areas to say what photos we want to put in these areas that’s going to take that can’t be done quickly it’s got it takes a little bit of thought right if you want to do it right so but the general structure of the website is there um we’re really really really close so hopefully you guys enjoyed this let me see if there’s any quick questions i can ask before we jump out of here because i am hungry and thirsty and all the things um followed your blueprint site setup but the h1 text is absolutely massive is that video outdated you have control over the h1 text it’s right here typography um first of all you want to set base heading sizes and scales for all your typography but if you need to override a heading level you can just come down to font size overrides on h1 and you can set whatever values you want so ignore anything i’m doing and it’s like a tutorial is the settings i’m using at the time you get to use any settings that you want to use is there a way to flush unused acf custom fields tables from the database really good really good question i don’t think it’s very easy um it’s something people complain about all the time what money range would you charge for this back in your agency days well keep in mind it’s not just what you watched what you what we would have to do that you didn’t get to see is and we actually have this in the inner circle um so if you go to inner circle i think it’s in discovery trainings where is uh agency foundation discovery okay um offer messaging master class so it’s an hour and 23 minutes long watch the training on it and then you download the workbook and you lead your client through the workbook and you do that for every single service that they offer as well as their company so you’re going to do this in this case they let’s say they have four services you’re going to do this five different times with them okay and and you know it gets quicker each time uh but you do that workbook for each service and for the company in general and then you’ll have a really really good idea of what all the content needs to say right um in a really you know high conversion focused way and so that they’re paying for that like we can’t do a site we’re gonna do the copy then they’re gonna pay for the copywriting on top of paying for this discovery portion um then there’s the time of going in and you know sorting the photos and choosing the photos and putting them all in the right places content insertion that goes into it um there’d be typically more things that we would do besides what you watched in this three hour video right um but this kind of site basic brochure site uh without the service area network you know might be after discovery and copywriting and all that stuff uh you know six to seven thousand dollars somewhere in there uh then of course if they want like the service area network that’s going to add on even more um and then depends on the level of seo discovery that we did if we did any ppc discovery if we’re going to do any landing pages for ppc if we’re like those things can all start to climb the price up right um but i think at that price point six to seven thousand dollars a company like this it’s not a big landscaping company um could very easily get tremendous roi out of it still but it’s not a dirt cheap website at the same time and some of the things that i rushed wouldn’t have been rushed i’m just trying to it look i’m not is a free project right um i’m just trying to get it done uh but if they were actually paying like we would cross many more t’s dot many more i’s we would um we would do some things a little bit differently uh and that’s it you know pretty pretty simple and straightforward this class right here and this workbook will make you thousands and thousands and thousands of dollars like this this this one thing sitting here in the inner circle you go watch it and you implement it and you use it not only will it make you thousands it will make your clients way more money than they have made off their websites um and it will they will be thoroughly impressed like most clients will be like man nobody’s ever like led me through this exercise before nobody’s ever mentioned that this stuff is important nobody’s ever helped me you know put this kind of stuff into words for the website uh they will love it they absolutely love it so just out just for that reason alone aside what it’s going to do for your bottom line for their bottom line they’re going to love this as part of the experience you should implement it on pretty much every single website you touch um so that hasn’t been done on this project that’s why when i get to the part like what should this say i don’t know because i haven’t done the workbook yet so i would just be making shit up out of thin air which is not obviously what we do so that’s a very very very important training um then you got all your seo trainings you got your service area network trainings like you know service area network is a bit of work it’s a bit of work um that’s going to add thousands minimum thousands of extra dollars uh to most projects so keep that in mind as well not to mention it’s going to help your client rank in all these local areas within their overall service area remember i was saying atlanta atlanta atlanta really what we need is a page for every one of those specific little service areas uh that they want to target and that they want to rank really really well in because i can guarantee you ranking for landscaping company atlanta is going to be next to impossible unless you’re already like massively branded and known and all of that right so our hope for ranking better lies in these one-off cities like uh landscaping company in buford and in lawrenceville and in duluth and in uh you know you get it you get the point right much easier to rank in those cities with service area pages than it is to rank in some overarching ginormous metro area uh that’s why we implement that the roi on it is fantastic the organic traffic that we get to service area network pages is fantastic the way we structure them like service pages actually makes them convert really well they’re one of the highest converting highest traffic pages on a website and most people don’t even see them they’re kind of in the background just doing their thing with seo uh they’re not really meant for direct traffic from people that are already on the website they’re a hundred percent meant to bring in organic traffic and convert that organic traffic and they do a really really good job of that so if you don’t know what a service area network is i would highly recommend you do the trainings on that and start to implement that for your clients um big roi and it’s it’s going to increase again your bottom line and your client’s bottom line at the same time which is a win-win everybody’s really happy about that if you’re working with local service businesses and you’re not doing a service area network you’re leaving money on the table and you’re leaving roi on the table for them and you’re leaving growth on the table for them and local dominance on the table for them you don’t want to do that you don’t want to do that it’s your duty to sell them this kind of thing because it’s going to help them tremendously in the in the long run so all right i don’t know i got to get out of here it’s been three hours um i hope you guys found this valuable let me know in the comments below again i don’t i can’t come back and read the chat i never do so if you want me to see it it needs to be in the actual comments on the video not in the chat on the video okay um but with that said let me go down to the chat see whatever you’re saying awesome okay people like it people like it fantastic all right good glad you guys are happy uh like i said look out for another one part two we’ll come in and try to clean the rest of this stuff up and get out of here all right see you guys love you peace you Thank you.

My Cart
0
Add Coupon Code
Subtotal