0:00:00 One of the most important things that you can do for your local business clients to help them completely dominate organic search is to build them a network of what are called service area pages.
I did a training a while back that goes into detail on the underlying philosophy and infrastructure that is involved in this tactic and in this technique. And if you implement this for your clients, not only will you get fantastic results for them, you will also end up generating a ton of additional revenue.
Because in that training I mentioned that we need a service area page for every key area that they want to rank in. Some businesses that could be 10 service area pages, for other businesses it could be a hundred service area pages, maybe even more.
And if you’re thinking in terms of deliverables, having 20, 30 extra pages in terms of deliverables, how much would that increase revenue across the scope of that entire project, right? Not to mention building out the actual infrastructure for these pages, the site architecture that is necessary, and some of the other features that go along with the service area page network.
It’s absolutely tremendous. Again, from a result standpoint, as well as from a growth and revenue standpoint for your business as an agency or a freelancer.
If you are not doing this for your local business clients, you are leaving a ton of revenue on the table and you’re leaving a ton of results on the table. It is that simple.
So go back and watch part one in this series, which I, again, I recorded a ways back but it goes through the entire strategy all right so that you fully understand it and in this video once you’ve watched that come back to this one we are going to talk about how to actually implement that from a technical standpoint in Bricks Builder and I’m going to take you through that right now okay I’m going to share my screen now I want to be clear I’m not going to be building out every detail of these pages and templates. What I am going to show you in this training is the technical aspects of getting it set up.
How you want the page to look, whether or not you use custom fields for that data, the layout, the content, all of that is up to you. And ultimately, I talked about a lot of that in part one, and I can provide many examples going forwards.
In fact, we will be adding a bunch of these examples to the frames library. So if you want to just plug and play layouts for things like a service area overview page with a map facet and things like that, there’s actually already a frame for that as you’re going to see.
If you want to just put together really quickly a single service area page for a single service area, you’re going to be able to do that with frames, and ultimately you can build your own in bricks. Like the actual building of the pages is not the hard part.
The hard part is the infrastructure, the architecture organizing the custom post types, query looping things properly, templating things properly, how do you hook up the map facets and all that technical stuff, that’s exactly what we’re gonna dive into in this training right here. So we’re going to go ahead and get started using advanced custom fields.
I’m going to go into post types and we are going to create a service area post type. So I’m going to say service areas.
The singular label will be service and we want to make sure we spell these correctly. Single label, singular label will be service area.
And then what are we going to do with the slug? This is a big, big, big question that a lot of people have.
I don’t like a long slug for this at all. And I’ve thought about like SA for service area or areas.
Uh, you know, I’ve thought of many, many, many different things. I’m trying to keep this as short as possible while also trying to make it make sense.
Okay. And the shortest possible slug that I feel makes perfect sense for this is in, the word I in, right?
Because if you think about this, it’s like, first of all, most of the search phrases that you are going to be targeting with a service area page network are service in city, right? So it’s like roofing in Atlanta or roof repair in Atlanta.
That word in is that key thing, and I’m not saying this helps you with SEO or anything like that. I’m saying from a semantic perspective of the slug, in makes perfect sense because it’s literally in all of the key words.
And so if you’re saying we have a service-based business, we do service in Atlanta, we do service in Marietta, in Macon, in all of these cities, well, why don’t we just make the slug in? Because it’s super short, and it seems to make really, really, really good sense.
That’s where the word in came from. There is no magic here related to this word.
If you wanna choose a different word, that is completely and totally fine, and it’s up to you, okay? I just personally use in, so that’s what we’re gonna do in this example.
Now, very important, has to be hierarchical. Absolutely has to, well, let me back up.
It doesn’t have to be hierarchical. You can make this as deep or as shallow as you want to make it.
If you have a business and you kind of need to talk to your client here and say, hey, Mr. Client, right now you do business in the state of Georgia.
And I know you’ve given me your list of key cities that you serve in Georgia. My question for you is, are you ever, is it in the realm of possibility?
Because we need to make this decision one time. We don’t want to have to come back and redo the architecture.
Is it in the realm of possibility that you would ever do business outside of the state of Georgia? And some clients will say, absolutely not.
We have no intention of ever expanding outside of the state. You know, my grandmother’s here, they go into this whole personal story about why they’re never gonna do business outside the state of Georgia.
Okay, well then we don’t need hierarchical posts because all we’re gonna do, we’re gonna go the simple route and just create city pages. That’s all we’re gonna do.
However, if there is in the realm of possibility, the idea that they may do business outside of the state that you are in, or maybe you’re doing this international, and so it’s like, hey, you know, I know you’re in Germany, are you going to be in any of these other surrounding countries because, you know, Europe’s not quite as big as the United States, and so having a state next to another state, very common for us to do business in multiple states. I don’t know if that’s the same thing in Europe, where it’s very common to do things in multiple countries, but again, that’s a conversation you have to have with your clients.
If it is in the realm of possibility, we need to go hierarchical because of the way that we’re going to do this architecture. And this is a big distinction here.
We are not creating a CPT for states and then another CPT for cities or counties or whatever other the relevant like breakdown is. We’re using one custom post type called service areas.
And then everything else is gonna happen within this, okay? So hierarchical is what we’re gonna use in this particular example.
Advanced configuration here, we can always come back and we can adjust a lot of this stuff later. I don’t think there’s anything, archive, I like to turn off, okay?
Thankfully, I think in Metabox, this is on by default and you’re gonna wanna turn it off. In ACF, it’s off by default, which is good because that’s kind of how I prefer things to be.
And that’s good enough for right now. So we are going to do that for service areas.
Now, of course, guys, it should be obvious. I don’t think I’m going to cover this necessarily that much, but you should have your services as a CPT as well.
So service and services, right? And then you decide whether this needs to be hierarchical or not.
I’m going to go ahead and hit Save Changes. So you have services and you have service areas.
And now what this allows us to do is bidirectionally relate certain services to certain service areas. Is this important?
For some businesses it’s not. And again, this is a conversation you need to have with your clients.
You go to your clients, Mr. Client, do you offer the same services in every single area?
And many will say, why yes, of course we do. But some will say, no, actually we don’t, based on our resources or the type of business it is, whatever, we offer these services in these key areas.
And then maybe these further surrounding areas, we have a limited set of services. If that’s the answer, then you’re gonna absolutely wanna use bi-directional relationships when it comes time to put the services on each individual service area page.
Because then you can pick and choose which service area page displays which services. If they have all services in all areas, very easy for you, when you create the service area page template, you just create a loop that loops through all of your services and shows them all on every single page and you’re done, right?
So this still gives you the option to go in either direction. So I’ve got a services CPT, I’ve got a service areas CPT.
Immediately we’re gonna go in and we’re just gonna get some dummy content in here. So the first one I’m gonna do is the state of Georgia.
We are going to have a service area page at the state level and then its children are going to be the cities in Georgia. And that makes natural sense, right?
Cities are a child of a state in real life. And so in our CPT, cities are gonna be a child of a state.
So I’m gonna go ahead and say publish here. Oh, I know one thing I need to turn on.
We’re going to go to ACF post types. We’re going to go to service areas and we’re going to go here to page attributes.
If you don’t turn on page attributes you can’t choose a parent and a child on the post. It’s dumb.
I wish it was on by default. I don’t know what to tell you.
But now when I go back to services and I hit add new and I say Atlanta, I’ve got this thing over here where I can now choose Georgia as the parent, and for some odd reason, that would not be there by default. I’m going to go ahead and hit publish on Atlanta.
I don’t want to create too many of these because I do need to add some custom fields and some other data. I’m just going to have Georgia and Atlanta right now, that’s it.
Then we’ll add a couple more cities and maybe another state just to see how things are working in our example. Okay, the next thing that I need to do is create a page that’s going to display my service areas.
And I’m not gonna use an archive page and a template for this. That’s why I turn the archive off.
Because for me, if I go back to a website, you know, three months later, talk about the three month rule all the time, in my brain I’m like, I need to go edit the service area page. There’s nothing alerting me to the fact that, oh yeah, that was a custom post type and it’s got an archive template and so I have to go to the templates area and open that.
No, no, my brain and most people’s brains go right to, oh, this is a page I need to edit. And so you would expect to find it in the pages area.
That’s where you would expect to find it. There’s really not much additional benefit in having an archive page that has a template attached to it.
Because of how easy it is to do query loops and all that good stuff these days, you really, there’s not, I don’t know. If you know of a benefit that I don’t know of, please alert me to it.
I don’t think there’s any additional benefit. So it’s easier and more logical to just have it as a page on the website.
So I’m going to go up here and I’m going to say service areas. And that’s really gonna create this structure, okay?
And because I turned off the archive on the service area CPT, I am actually free to come in and use the in slug, okay? So that slug is not taken up by an archive page, therefore I’m still free to use it on a normal page.
Now, it’ll look like all of my custom post types are associated with this page right here. I’m going to go ahead and hit Edit with Bricks.
I’m going to go up to Templates. Because this is not a, hey, how do you build certain pages in bricks kind of thing, I’ve done plenty of tutorials on how to build pages in bricks.
This is just focused on how do we do the service areas thing from a technical perspective, I’m going to use contact section hotel. I’m going to insert that frame, which is going to give us a very common layout that I use for service area overview pages, okay?
All right, so we’re gonna hit save. Notice that this frame, I’m gonna open this up, has a map facet inside of it.
We use the default bricks map facet, which it’s not even a facet, it’s an element. And it’s not that great, it’s not fantastic, I really don’t recommend it for this purpose.
I recommend using WPGridBuilder’s MapFacet and you’re gonna see exactly why. However, most people don’t have WPGridBuilder, so we can’t load that in by default.
So what I’m gonna do is I’m going to take fr-contact-grid-hotel-map, just keep that class in mind. I’m gonna delete this map, and I am going to add a facet from WP Grid Builder.
Unfortunately, I haven’t created that facet yet. So we’re gonna go back into the admin real quick, and we’re gonna hop over to WP Grid Builder, all facets.
Okay, and I’m kind of jumping around here because you’re gonna see how all this stuff needs to tie together. I think it’s good for you to see where the holes are and what things are tied to which and how it gets that way.
Because if I do it too linear and too organized, you might miss something. You might miss a connection here or there, all right?
So there are no facets right now, absolutely no facets. I’m not even gonna import any data.
I’m literally just gonna go to create a facet. And I’m gonna call this service area map, service area map just like that okay I’m gonna change this to in map because I’m just trying for consistency purposes To keep all of my IDs and slugs and all of that Focused on that word in right so they’re kind of all named exactly the same Now I’m going to go over to behavior, and I’m going to go click on map now very important This is an add-on okay the map facet is an add-on for WP Grid Builder, an important add-on, and well worth it, okay?
But it is an add-on. So I’m gonna select Map under Filter, and then I am going to filter this by Custom Field.
And we’re going to need a Google Maps address field, basically, to really make this work seamlessly. And we don’t have one yet, and that’s why I wanted to do it in this order so you can see what’s missing.
Where do we need to create a connection for what’s missing? Well, here’s one area right here.
So I’m just gonna go ahead and save our progress, save this facet, even though it’s not set up yet and doesn’t work yet, save it, because we ran into a disconnection. So what we really need to do is we need to go fix that disconnection.
So I’m gonna hop over to advanced custom fields. Have we created any custom fields yet?
No, we need a Google Maps custom field. Where do we need that custom field?
We need it on our service area pages so that when we create a service area page like Macon I can go put in the Google Maps address for Macon, Georgia. Okay, so what I’m gonna do is add a field group We’re gonna call this service areas because that’s where I’m assigning it to I’m assigning it to the service area CPT I’m gonna come down here and assign it to the service areas CPT.
And then I’m gonna select the Google Maps custom field. Okay, and then we’re gonna call this map address right here.
And we’re going to say in map address, all right? So you can see the organization still taking place here.
None of this other stuff really matters all that much, presentation, conditional logic, really nothing. Now, here’s the thing, and they don’t really alert you to this, okay?
ACF and this Google field do not work out of the box because Google Maps requires an API key. And so if you open a service area page and you try to add, I’ll just go show it to you, okay?
So we go to service areas, we go to Atlanta, and look at this, we have an address field and you’re gonna see this error right here that it cannot load and if I type in Atlanta, Georgia, it’s like hey, location not found, request denied. What we have to do is we have to tell ACF what our Google Maps API key is, all right?
And there’s really no way to do that except for a filter that you have to add to functions. php.
So what I’m going to do is I’m going to pause the video. I’m going to go get my Google Maps API key and I’m going to put this filter in functions.
php in the functions file in this install and then I’ll be back with you because I don’t want you to see my Google Maps API key and it does not hide it when I’m doing this process. So I will be right back.
And by the magic of editing, we are back. Okay.
All I did was go into functions, theme functions and bricks, and I popped in that little filter from ACF and I put in my Google Maps API key and I refresh this page and here we are with a working map where I can literally say Atlanta, Georgia, and even though it says it still can’t load it correctly it obviously clearly is loading it correctly and I’m going to go ahead and hit update and then I’m going to go back and here’s the thing I don’t need it really for states I really only need to do this for cities okay so we have one city called Atlanta and it has now a map in here and I’ve created this custom field which means if I go back to the facet, so let’s go to WP Grid Builder, All Facets, hey look, there’s my service area map. Go to Behavior, go down, Custom Field, Post Field, what’s the field called?
How about we just type in map? It’s right here, ACF Service Areas Map Address.
That’s what we’re gonna be pulling from. We are going to use the Google Maps API, and then once again, it’s going to make me put in my API key.
Now I’m gonna go over here in a new tab I actually think that in this one I’ll edit it out if it doesn’t but I think in this one it does obscure the API key. So I’m gonna go to theme file editor on my other screen I’m gonna grab the API key and I am going to paste it in and I will edit this that’s not it by the way, I will edit it out if it does not obscure it.
Okay it obscured it so we don’t have to edit we can just keep moving. And you see this is the exact process that you would go through.
Display all markers, use map filtering, okay you can come down and select a style for your map, we’re just going to stick with road map for right now. You can turn on and off different layers, you can have a default zoom setting, you can choose whether it’s draggable, pannable, scrollable, zoomable, all that good stuff.
I will probably say rotate map type street view. Okay, yeah, we’ll just, we’ll leave all of that.
You can put in a custom marker if you want to. All right, I’m gonna hit save.
It’s gonna go ahead and re-index that. And now we’re gonna go back to our service areas page.
We are going to refresh. Now what we wanna do is we wanna get the map on the page.
So what do we do? We add a facet right here.
All right. I didn’t want to add two of them.
I just wanted to add one of them. Now I select the facets called the service area map and it says, hey, select a greater element to filter and oh, there is nothing in the list.
Why? It’s looking for a query loop.
OK, so what we need on this page is a query loop. So I’m going to I’m showing you where the disconnections are so that when you run into them, you’re like, oh, that makes sense.
I’ll just follow the next step and I’ll fix the disconnection. Okay, so we’re gonna go in right here and we’re gonna open this list and see a bunch of list items, all right?
Well, the list item is the thing that I need to loop through. So I’m gonna delete all of them except the first one, click on the first one, hit the query loop, go in here and say, hey, query my service areas, please.
And then I’m gonna go ahead and hit save. Under the link wrapper right here I’m going to query the URL okay dynamic data post URL and for the label I’m going to get rid of the dummy label and I’m going to put in the post title which is the name of the city okay and so I am going to refresh this page and we see we have Atlanta and we have Georgia.
Now there is a way to only show cities on here if you need to. Well if you don’t have any states then it’s only going to show cities by default.
If you have states and cities typically on this overview page what you want to do is you want to only show states. Because when you only show states they can click on the state and it’s going to take them to the state page and on the state page they’re going to see all the cities.
Okay so that’s typically the way that I handle it. So what we’re gonna do to make this only show states is we’re gonna come in here to the query and say child of zero, okay?
And if it’s a child of zero, go ahead and refresh. That means it’s a parent, okay?
So it’s only gonna show parents now. Now I click on this and it takes me to a blank page called Georgia.
But imagine if the Georgia page looked exactly the same as this page except it looped through all the cities That would be absolutely fantastic, right? Okay.
That’s exactly what we’re going to try to accomplish. All right, so I’m going to grab this I don’t like the fact that it is text L.
So I’m just gonna get rid of that save Okay, let’s handle this map facet right here now that I have a query loop. Look what shows up in the drop-down I simply select my query loop and we are off to the races.
Now I do want to make sure that we change how this map wrapper is behaving here. So I’m going to go to layout.
We’re going to go to 50 VW minimum width, 50 VW. Okay.
And then I probably need, Oh, you know what? I believe I have a hotel map.
Let’s see if that does anything for me. It does, look at that, look at that.
It just gets me exactly where I need to go here. Okay, very, very, very nice.
All right, remember I don’t have on this page, Georgia does not have an address, right? Now what if I did want an address for this?
Because I want Georgia to show up on the map, right? So I’m gonna go to service areas, I’m gonna go to Georgia, and I’m gonna do Georgia, US, okay?
And see if it can find Georgia, US. And what did it actually find?
It did find the state of Georgia. I don’t know.
We can put the capital. You can probably put the capital here, okay?
And let’s go ahead and hit update. Now, you absolutely could, wow, that’s super zoomed in.
Okay, let’s see what’s going on with our map facet here. I wanna run into these things because I wanna be able to show you how to fix them.
So all facets, go to service area map. I think when I was showing you this, I accidentally hit this slider and it kind of, it decided to zoom in a little bit for us here.
Okay, nope, that’s still staying nice and zoomed in. Let’s go ahead and go to facet map, map, wrap or let’s take the map off of here.
See how this behaves without that. 0:23:45
OK, it’s still zoomed in a lot. 0:23:48
Not sure why it should be more like like this, right? Let’s look at 16 by 9.
Let’s do one by one, save. Default zoom, maximum zoom, 12, one, one, save, re-index.
Okay, local slash in. All right, so we’ve got a fixed map basically.
What I want to do now is show you, okay, if we add, because it’s right now, it’s just focusing intently on Atlanta, because we only have one state, right? But what if I said Florida, right?
We’re going to say capital of Florida is Tallahassee. Look, I live part-time in the state of Florida, don’t even care what the capital is.
Gigantic state, okay? So we’re going to say Tallahassee, Florida, just like that.
We’re gonna go ahead and hit publish, publish. This is a state level page.
So now, let’s see how our page starts to build itself out. Now, look at this.
We’ve got a pin in Atlanta, we’ve got a pin in Tallahassee, and it’s kind of showing us the states that we serve. Now, you would only wanna do this if there’s a bunch of states, right?
If there’s only one state or two states, you probably don’t wanna do this. You probably just wanna query everything right here and let people go from there but if you’ve got a lot of states again these are decisions that you need to make based on the business that you are building this out for but I’m just showing you a good way to organize it if you’re doing like a large service area network okay so now what we need what is missing now it is a state level page now unfortunately the the way that we can assign, excuse me, I’m having a hard time talking.
The way that we can assign templates in Brics is a little bit limited. So what we’re gonna do is we’re gonna create one template for our service areas, okay?
So we’re gonna go to Brics, we’re gonna go to templates, add new, service, areas, single. So single service area, whether it’s a state, whether it’s a city, okay?
That’s it, that’s all we need to know. I’m gonna go ahead and hit publish.
I’m gonna go to edit with Bricks and I’m gonna go up to settings, template settings, conditions, add condition. We’re gonna say post type is service areas.
Just assign it to the service areas post type, hit save. Now, what is coming next?
Very, very, very important. I wanna create two sections.
Actually, not even sections. We don’t even need, no, we don’t need sections.
We need a block, okay? The block is going to be called state page, and I’m gonna duplicate that, city page, okay?
Both of these can get, actually, the city page is probably more important to get the article tag, all right? And then the state page can just be a div.
That’s, I think that that’s fine. If anybody disagrees, go ahead and disagree.
That’s okay. And all we’re gonna use this for is conditional logic.
And we’re gonna basically build two different templates within the same template. Thankfully, this is super easy because the state level page, which I’m actually gonna put at the bottom, is an exact copy of the service area page that we just created.
I’m going to go into templates here, remote templates, and I’m going to get contact section hotel to come back in here. Actually, I can do this a little bit better.
Let’s go into, I’ll show you one way that you can handle this. A little bit more efficient, so we don’t have to do all the work over again.
I’m gonna go into my pages. Now I could just copy paste but I’m not on a secure local install so I can’t copy paste.
I’m gonna edit this with Bricks and I’m gonna call this instead of contact section hotel this is gonna be called service areas and then I’m gonna right-click save as template called service areas. Now it’s a local template.
Now I can get out of here and on this page I can refresh and I can just bring in my local template. So I’m going to go to service areas insert and there it goes it brings it in.
Now I’m going to I’m going to work on the formatting and all that stuff in just a minute but we’re just covering the basics here. Okay service areas needs to go inside of state page right there.
Awesome and so this is now going to be called here Let’s go Georgia. Oh, this needs to be the post, okay?
So the title of the page that we’re currently on. Now, you gotta start thinking dynamically now, right?
So this is gonna be the post title, which for a state page would say Georgia, all right? And then you’ve got your content related to Georgia, and then these are gonna be your Georgia cities.
All we need to do here is adjust the query loop a little bit. Can’t be a child of anymore, right?
We’re gonna come down. I think all we need service areas, post per page, taxonomy, meta query, okay, terms exclude, oh child of, I’m sorry.
It escaped my brain. Instead of child of zero, we need child of the current page.
So you grab the post ID of the current page and then it’ll just say, hey all the children of the page that we’re currently on. So now I’m gonna go ahead and hit save and we’re gonna go to Florida and just say view service area and this is what we get.
Do we have any cities in Florida? No, we have no cities in Florida.
Let’s go to Georgia. Okay, Georgia has a city, Atlanta, look, there it is.
Okay, so we’re off to the races. Then Atlanta, unfortunately, still uses the same template.
Hmm, still got to fix that. And look, our map is broken.
Why is our map broken? Because we copied it over and it has no idea what the new query loop is.
All we do is connect that to the new query loop ID and it’s going to immediately render that page properly or it should. So let’s do Atlanta.
Now we need to go back to Georgia. Hey, look at that.
And if there’s more cities, let’s go ahead and add our next city and see if this is working. If there’s more cities, they’re just immediately gonna show up both in the grid and on the map.
It’s absolutely fantastic. So I go to service areas, add new, let’s add Macon, okay?
And we’re gonna say Macon, Georgia. Ignore this, okay?
Publish, publish. And let’s go refresh Georgia and oh, I didn’t make it a child of Georgia.
Okay, child of Georgia. Update, refresh, there’s Macon, there’s Atlanta, there’s a dot, there’s a dot.
We’re getting dots everywhere. We’re getting cities everywhere.
This is exactly what we want to see. Okay, so I’ve got, if we go back to our main service area slug, right, here’s our service areas.
Do you live in Florida? Do you live in Georgia?
Where do you live? Oh, I live in Georgia.
Okay, let’s click that. Hey, there’s some cities that we serve in Georgia, and hopefully there’s going to be a whole bunch of them, right?
Now, when I click to Atlanta, I don’t want to see this. This is not what I want to see, right?
What do I want to see when I go to Atlanta? I want to see a service area page for the state of Atlanta.
I’m sorry, the city of Atlanta. It’s hard to talk.
It’s hard to talk and do these things at the same time. All right, so we’re gonna go to service area single, edit with bricks.
Remember, state page down here, city page up here. Let’s get ourselves a hero section for our city page.
So I’m gonna go into heroes and I am going to choose, let’s do a split hero like this, hero this hero Charlie good one for a city page. All right.
What does this need to be? Well, Charlie, it needs to be the post title once again.
And if we’re on Atlanta, that’s going to say Atlanta. And of course you can say, you know, like a roof repair in Atlanta, right?
You know, whatever keywords you need to toss in here, whatever you need to do or roofing company in Atlanta or your Atlanta roofing partner, like whatever you want to do is completely up to you. That’s not really what we’re covering here.
We’re just covering the technical aspects of this. Again, you’re going to want a featured image for these kinds of things.
You may want to do custom fields for this content, or you may just want to edit it on a page by page basis. Since this is a full template, custom fields, probably the way to go.
It’s a little bit time consuming, so we’re not going to get into all of that. I’ve done plenty, plenty, plenty of trainings on how to use custom fields and dynamic data in a BricsPage template.
Okay, it’s not something we have to cover yet again. I’m just covering the new stuff that’s required to get you this infrastructure set up.
Okay, so I’m going to hit save here. So effectively what I have is the start of a service area page and I have a state level page right below it.
And all I’m going to do is I’m going to come up here to conditions. I’m going to add a condition and I’m going to say if the post parent equals.
Now if I want, remember the city page, zero my friends, zero is a parent. A child is a not zero.
All right, so this is the child page, a city page right here. So I’m gonna say not equal to zero.
We’re going to show the city stuff. If it is equal to zero.
So right here, I’m going to say post parent equals zero. Then I am going to show the state level page.
And so if we look back here at Georgia, look, nothing broke. We still have this layout right here.
If however, I click on Atlanta, we now have a city level page. And this is bulletproof, bulletproof.
There’s no taxonomies that I have to worry about. I don’t have to mark something as a state level page or a city level page, which by the way, if you’re doing that with a taxonomy, that’s not great because as you know, with taxonomies, they’re check boxes.
And so it could potentially be both. And then what’s going to happen, right?
Somebody accidentally checks the wrong box. No, all we need to do, the only thing, right?
But you need this anyway. The only thing that makes all of this work is proper parent-child hierarchy, which is already needing to have happen.
You already need that. So if you screw up the hierarchy, I mean, you’ve already screwed up.
If you get the hierarchy right, all of your templates are gonna be right. Nothing is gonna break.
This is an unbreakable situation as long as you’re not a doofus, a chump, right? When you put in, you know, your city level pages here, okay?
So we have Georgia, has Atlanta and Macon. Florida, let’s add a new service area, but just to show you how easy and unbreakable this is, okay?
Florida is going to get Sarasota and I’m gonna say Sarasota Florida is my address and I’m just gonna choose proper hierarchy Florida as my parent page Publish publish and now I go back here we are Back to service areas. Let’s instead of choosing, Georgia.
Let’s choose, Florida. Whoa, look at that!
We already have a Florida page with a Florida map and we have a city called Sarasota. Well, why don’t we click on the city called Sarasota.
Look at that! Now we have a service area page for Sarasota and I can just make these all day long in my sleep and everything is going to continue to function super smooth and these grids will build themselves out, the maps will build themselves out.
Let’s put in another city for Florida. So we’re gonna add new, we’re gonna say Miami.
All right, getting spicy, getting spicy. All right, Florida right here.
Save, proper hierarchy, Florida, publish, publish, okay. Let’s go back to Florida.
Hey, look at that, Miami and Sarasota are now marked on there. This is absolutely fantastic, right?
It’s showing both of them. I click on Miami.
Hey, we’re ready to have a Miami service area page. Now, all you have to do here.
Okay, let’s go to the template again. I’m not gonna build that again.
I’m not gonna build out the entire template for you, but I will show you on the city page right here. Let’s add another section here.
And we would want this to be like services cards, okay? So we’ll choose features, and we’ll see what we might wanna put in here for our services.
We’ll do something nice and simple. No need to really, really go crazy or anything like that.
I think this works really well right here. All right, so our services in, and then we can just put in dynamic data, right?
So here, post title is the name of the city. So it’s gonna say, our services in Atlanta, maybe we can do what we offer in Atlanta, right?
Save, and then all I have to do, delete, delete, delete, we’re gonna query our services. Use query loop, query our services, type, post, post type, services, and this will just query all of our services.
So now when I go in, while I’m there actually, I can grab this and I can just say this is gonna be our post title. We don’t need to do everything, but I wanna do the base level stuff so you can see.
Services, add new, and maybe we say roof repair. And of course we would have a featured image and all of that, but I’m gonna go into Miami, what we offer in Miami, roof repair.
Guys, it’s this easy and let me remind you you are going to be charging a phenomenal amount of money to build out these service area page networks. I’m talking you know thousands of dollars minimum for a client in many cases tens of thousands of dollars.
This is a great thing to put on retainer especially if you have large clients that want to dominate a region, not just a you know a little area in a state. You know I’ve had roofing clients that needed to dominate like a region and so you end up billing out for 60, 70, 80 service area pages.
You put that on retainer across the course of a year and you’re just doing ongoing work releasing four to six service areas every single month until you get to the final number that you wanted to get to. Tremendous ongoing revenue for your business and I’m showing you right now exactly how to set this up.
I showed you in part one how it works, why it works, how to do the keyword research, all that good stuff. Okay, so what else do we need to do?
Let’s attempt to put in a search facet and then we should be able to call this a day. Again, layouts for these pages, that is completely up to you.
I’m going to build out a bunch of frames that you’re going to be able to pop in for exactly this use case. Already you see one of them exists, all right, but I wanted you to know all the technical stuff.
All right, so I’m going to say service area search. Okay, save changes, behavior, filter, search field.
You can do auto-complete in certain situations. Let’s just stick with a standard search field.
Find an area. We can use the WordPress search engine, that’s fine.
We can do instant search. Let’s go ahead and hit save there.
Let’s go to our pages, go to our service areas page. And you know, I don’t think necessarily we need a search facet on here because it’s just states, right?
Unless you’ve got a ton of them. I think we just leave this page the way that it is.
So let me go back and let me end up going over to our templates and let’s open our single service areas. We’re gonna put it on the state level page so that people can search cities.
So we scroll all the way to the bottom down here. Here’s a search box.
I’m just gonna put a facet in. And then once that facet’s in, I’m gonna delete the search box.
I’m gonna say that this facet needs to be 100% wide. Ignore the fact that I’m doing this at the ID level.
I’m just rushing so this doesn’t take any extra time. Service area search, select a grid to filter.
Ooh, we got two to choose from. Which one are we gonna choose?
Well, I needed to filter this right here. And this happens to be 060578 is the ID, okay?
So 060578 is the ID. Hey, I think we’re good, okay?
Or enter an element ID to filter. I think we’re good, I think we’re good.
Okay so what we need to do now is go to the front end and we need to go to in. All right Florida and Georgia.
I’m gonna go to Georgia and I can search Atlanta and hey look at this it finds the city I searched for. It zooms me in on the map.
I mean what more could you ask for? This is tremendous.
Let me go back and get rid of the search box. You can see that happen again.
So this time I’m gonna search for Macon. Now, again, there’s only two cities here.
Do you wanna put a search in when there’s only two cities? No, absolutely not, right?
This is for when there’s lots of things and maybe you even have paginated results, okay? And by the way, I would also say this, this particular layout is great, like the side by side, when you have a limited amount of service areas.
If you’ve got a whole freaking network of service area pages, I would tend to do the map wide as like a divider, and then underneath the map, all of those service area pages in multiple columns, right? That’s kind of the best way to go about this.
So again, the layout is completely up to you based on the client that you’re working with. I’m showing you how to do the technical implementation.
And again, this is why I recommend WP Grid Builder so much. I mean, how easy was it to create that search facet?
You could do geolocation facets, you can do auto-complete facets. There’s so many things that you can install that are really flashy and cool, and it’s like takes very little setup whatsoever.
So watch this, I’m gonna say, hey, I live in Macon, I wanna see if they serve Macon. I’m gonna type in Macon, I’m gonna hit enter.
I don’t even actually didn’t even have to hit enter. It just did it automatically.
It finds it in the list. It zooms in on the map, okay?
Really, really, really crucial. If it’s not physical locations, by the way, if it’s truly areas, then what I tend to do is remove this pin and I put a radius circle in there, okay?
You can do that with a custom icon. There’s a number of different ways to go about doing that, but it is worth pursuing in some cases because the PIN can be a little bit confusing to certain people, they think it’s an actual physical address when necessarily it’s not.
But we’ve put in a search facet, we’ve put in a map facet, we’ve got the templating set up, we got the CPTs, we got the parent-child relationship, we got custom feel for the ACF Google Map field. I think we accomplished a lot.
We accomplished a lot. What I need to know is, after you follow this process and implement it, is anything missing that you still need help with, or are you good to go?
All right, I showed you how to query the services on an individual service area page, okay, for a specific city. I think we’ve, and you could do more things, right?
You could do more things. You could say there’s blog posts related to specific cities, maybe there’s FAQs related to specific cities, so our FAQs are going to be a custom post type.
Again, the sky is the limit. You got to use your imagination and the skills I’ve already taught you in all these different areas to make this as robust as you want to or as simple as you want to.
And maybe the robustness or the simplicity is based on the budget that the client has and how flashy you ultimately want to be, but this should get you going in the perfect direction. If anything is missing, please let me know and I will address it.
Most likely I can just respond in comments below or add some content to the body of the post. I don’t think we’ll necessarily need an entirely, you know, extra video or anything like that, but I will jump in and help you where needed.
I hope you got a lot of value out of this. I hope you use this, more importantly, more importantly, I hope you use this to make a lot, a lot, a lot of additional revenue for yourself and help you get way better results for your clients.
That’s ultimately the most important part. If you’re getting crazy results, you’re gonna get a lot of word of mouth you’re gonna get a lot more revenue from extra business it’s just gonna be great all around that’s exactly what the strategy can do for you what the strategy can do for you I’m out peace
