Video Transcription:

Hello and welcome to another edition of Delta Media Group's Tech Tuesday. Today I'm going to go over a feature that I've been putting it off for a while. It is one that can get complicated quickly, but we're going to simplify it as best we can so it won't be too bad. It's one that we're always making updates to. That's kind of another reason I was putting it off. I like to wait until we have everything in there before we do a video on it, but hey, it's time. We need to go over it. We got enough questions about it. Anyway, without further ado, we are going to go over the modular site design system.

These are the customization options you can use one you switch to a modular website that allow you to do things like change colors and background graphics and all those things. Let's go into the Delta Net and see what we're looking at. Here we are on the welcome page. The options I'm talking about specifically are under websites and modular theme editor. From here, you can see we've got all these color pickers in here. We've got some numbers that seem borderline random at this point and a variety of different options. These all have to do with different ways that you can customize your agent site. Let me switch over to the agent site so you can see what it looks like now.

Here we are. We have a full screen background image, which is on this particular theme by default. You can see as we scroll down we have our customer review section. Three reviews showing up there now. We have our paragraph about you section and then featured homes down here at the bottom. A variety of the things here are customizable. Kind of the way we built this platform is that you can go in and choose from our existing modular themes if you're on the upgrade package. You can stick with what they have or just realize that those are just kind of a baseline.

Like those are where you're starting at. Then if you want to make color changes and things like that on top of what's already there, you can. Now where you would originally choose those modular themes is under website and site design. You can see here you'll have a variety of options to choose from. When you see the one that you want to go with, you just click on preview theme and then click on set live and that will set your theme live. Now once your theme is set live, basically when you're choosing here, you're going to want to make sure to choose something that is as close as possible to the final design you want to go with.

Just knowing that you can change out that background image, you can add or change a header graphic, and you can change out these colors. Keep all those things in mind. It's not imperative that those match up exactly with what you want, but you want the overall look of it to be pretty close or as close as you can get so that you have to make as few changes as possible. Once you select the one you want and let's see if I ... I don't see which one I'm already using on here. Oh well. It doesn't matter. You've seen the one that I'm using. Now let's say that I want to make some changes to the colors on here. We have this navigation bar. We'll go into website and down to modular theme editor.

We can see agent name color is that green. If I look here, here's the agent name color and we can see that it's green. If I want to change that, all I have to do is go in here, click on the option and we'll make it ... I want to remember what color it is now. We'll make it blue instead. I like blue, right? Wearing blue. That's good enough. I change it to blue. I will scroll down to the bottom. Click save changes. Go back over to our agent website and hope that our subtle change worked and there we are. Now my name's blue. Every option on that page is as simple as that. Go in, make the change, save it, refresh your page and see what you've got.

I'll change this back to green. You can see that just by pasting in the code here, it automatically change the color in the color previewer. Agent description color is already set up as black. If I want to make more noticeable change, we'll say the top bar background. Let's go ahead and change that from this kind of gray color to some crazy orange. I'm going to end up with a really weird looking site at the end to this. I can already tell. Saved it, refresh, and there we are. Now my top bar is orange. That gives you the idea. I mean it's just as simple as going in, making your color change, and then you can see what change you made on the website.

It's pretty descriptive as to what it does. This is top bar. This is navigation bar. This is header. This is like quick search background. We'll just go ahead and run through these options and see what we've got. First of all, we have all your agent information. Agent name color we already looked at. Designation color is going to be all the information right here. There'll be agent designation information if you have it filled in. That shows up right below your name. We have the header photo, whether or not you want that to appear, and the agent header info, whether or not you want that to appear. What that controls is this photo and the info associate with it.

If you don't want that to show up, let's say for example you have a custom header that has ... You had either us make it or you had like a graphic artist make that for you that has all that information, you're not going to want this overlay to be on top of it. To remove them, you'll just switch these to false and then save it, and then those will be gone. Now if we go over to home finder, this has to do with that very top bar which has all the home finder sign up links in it, and you can control each of the text colors there and the background color respectively. Nonlink color, link text, link hover text, what that means is this is the top bar color, these are the nonlink texts.

You can see they're white right now, so that's this stuff here. Then these are the links. You can see when I hover my mouse over, I get a different color. You can control both of those colors independently. We'll see that the link color is that green and the hover color is white. If I switch over here, here's our nonlink text, which was already white. Here's our home finder link text, which was green as we saw, and link hover text is white just like we expect it. It's nice when it all lines up, right? All right. The next thing we have is the navigation section. All of these we try to be really descriptive with what each of these things do.

We have navigation our background color which is the actual bar itself. The font color, so you can change those to work with each other so that you can actually see the text on the background. The hover color, which is the same as over here. You hover over the link, it changes colors. The addition that you have in the navigation bar is you can control the dropdown colors also. If I switch back over here, see when I roll over buyers, I get this dropdown menu. I can control the background color of this dropdown menu, the link color of the dropdown menu and the hover color. When I hover, it turns green. I can change that to whatever I want.

If I go over here, and I won't go through each one and bore you with each setting, but you can see which one each of those things does. Our navigation font color, hover color, you just change those the way that we should with the rest of the fields here and then save it and then it'll change all those colors. The next thing you can do is you can control the number of reviews that appears on your homepage or if you don't want any of your reviews to appear on the homepage, you can just change that number to zero and they'll all disappear. If you have 20 reviews in the system, you can change that to 20 if you want them all to show up in your homepage.

You can see by the way they show up, you probably wouldn't want 20 of these. Usually three or six is a pretty good spot for that. Then future listings. Right now that's set to three. You see that you can update that in multiples of three. The reason for that is it'll look funny if there's not three even in that box down there. You can switch those to any of these multiples of three and that'll determine how many ... Let me close that out. Here we go. That'll determine how many featured listings you get here at the bottom. Moving down the line, the next thing you can do is you can change the background graphic. Now this background graphic, it has a default graphic on it now.

That's why we don't see anything there, but that's referring to this. We're calling it a whole site background graphic. This graphic actually goes up ... Actually this is the quick search background graphic, but the site background graphic could appear above and below this navigation bar, so it takes up this whole background area. That is one thing that you can see. In fact, let me go down here and save this. As an example of what that looks like, this would be a theme with a site background graphic. There we go. You can see that background graphic takes up the whole thing. If you were to choose this template, you're already set up with this background graphic.

If you go in and change that site background graphic, you can change this to whatever you want then. Back into our theme editor. It's thinking. There it goes. Here we are, custom site background graphic. That's the first thing you can do. You can do a full site background graphic like that. You could also do a full screen, like a full background graphic as a slideshow. If I click this radio button, now I switched it to slideshow, I can go down here and I can upload multiple images and it will slide those images together so it makes a slideshow out of them. Then lastly, I can click custom site video. Here is where I would upload that video file.

Videos are tricky. The biggest thing about videos is you want to make sure that they are not too big. The file size has to be small, but the actual video size has to be as big as you can get it so that it still looks good in the background. We're working out simpler ways of doing that. The idea is that at some point you will be able to just take your phone, take a video and then upload that video to your website and use it as your background graphic, but we're not there quite yet. For now if you'd like to upload a video and you have any trouble with it or you can't find the right video or get the size set up right, just let us know in support and we'll help you with that.

Now the additional option you have when you set a video is you can set this poster graphic. Background video poster is how it's labeled. The way that works is anytime someone goes to the website and it loads up on a mobile device, we don't load the video. The idea is that you're saving mobile users data on your website. Instead of downloading the whole video and having the video play on their mobile device, they just get this poster graphic instead, which is just meant to be a still image. You can see here we describe in each of these sections exactly what you want to use size wise and file wise in each one of those. Let me go over here to background graphic.

Now the way these editors actually work or uploaders actually work is you just click on add file, pick the file you want to use, click open. That brings the file up here, and then you'll click start upload, and that uploads the file. It also gives you a reminder once you've uploaded the file, you have to scroll to the bottom of the page and click the save button in order for it to actually save that change. Even though you see it uploaded, it's not going to show up as your background graphic until you save it. All right. Now the next thing you can do is you can select the header graphic. The header graphic works exactly the same way as a full site background graphic.

The only difference is the header graphic will only appear up here above the navigation bar. The other thing is you also have some prebuilt header graphics you can choose from for the header stuff. Whereas the site background graphic you can only upload your own, you can choose from this gallery for a header graphic. If you want to choose from the gallery, you just select the one you want. You choose whether or not that header graphic includes your logo already. If it does, then you can click this button to say, "Remove the company logo." What that'll do is just display the header graphic and move the company logo overlay off of it so that you don't have the logo on there twice.

Now if your header graphic doesn't include your company logo, you want to make sure not to check that so that the system puts in that logo overlay for you, but this works in much the same way. If I want to use a custom one, I'll click on choose file. I'll select the file I want to use and click open, and that'll drop my header graphic in place here. Then I can just click on save the same as the other field, the other section, and it will put my new header graphic in place. Now our next set of option here is template quick search background graphic. This is referring to the background graphic in just the quick search section. That's just this section down here below the navigation.

Very much like the full site background graphic, if I want to put a custom graphic here, all I do is click on choose file and then select the graphic I want to use. You can see it specifies the graphic. It needs to be at least 960 pixels wide, so that's a good idea for that. I would just click like the other section choose file, pick my file, click open, and then that'll set my new background graphic. Well, once I go down to the bottom and click save changes, it'll set my new background graphic.

Now the other things you can do in the quick search section is if you want to show a featured home image in the background instead, you can choose that instead of going with an image back there. Then also you have some options for which quick search you use. By default, right now I have this single search box with find your next home. If we take a look, it says find your next home. It's a single search box. If I want, I can choose from any of these other options. If my company has the AVM system enabled, I can actually choose an option that has a tab for the AVM system there.

If I go down and I choose tab to find a home and what's your home worth, what I'll get is something similar here, only it'll have two tabs on it. One will say find your home. The other will say what's your home worth. If I click on what's your home worth, a customer will be able to come to my website and do an AVM request right here. Let me switch that out so you can see what it looks like. Here we are, what's my home worth, save changes. There we go. You can see now I have a different quick search layout. If I click on what's your home worth, it brings up another menu.

I could type in an address here and click get my report, and it'll take me to the automated valuation page so that I can see a valuation for that property. That is just one of the several quick search options you can choose from. Our suggestion is if you want to use the AVM system and your company has the AVM system turned on, you'll want to select from either this one, find a home with what's ... Tab boxes for find a home and what's your home worth with search forms for each. That is one of the AVM options. The other one is side-by-side boxes for find a home and what's your home worth with search forms for each.

Both of those give you the option to do a quick search for listings or put in an address to get back your AVM value. Lastly, you can choose single search form for what's your home worth. What that'll do is allow customers to only do an AVM to that form. They won't actually be able to search for properties. It depends on your business model as to whether that's something you're going for. If you're not really acting as a buyer's agent at all, you just want to get as many sellers as you can, that's a good way to attract sellers. If you're not really looking for buyers that much, it might make sense to just have that form instead of also having the regular quick search for buyers.

Then lastly, if I click disable here, I can turn off the autocompleter on my quick search. If I didn't want to use that, I can just use this option to remove it completely. Now the last thing I have here is basic customizations, and these are carried over from the old system, but they allow me to customize the page title, meta keywords and meta description on my homepage. The title is going to be what shows up here in the tab for the browser. You see when I roll over it, it gives me the whole title there. It's a good idea to set that up in such a way that it's readable and it's search engine friendly. By search engine friendly, I really just mean readable.

It actually makes sense when you read it. Same goes for the description. This is a 165 character. You want to get as close to that count as you can. Actual readable description of your website. Search engines will pick that up and they'll display it on the results pages as well. When you run a search on a website, if your page comes up or your homepage comes up, it's going to show your page title, which is what they would click on to go to your site from the search engine, and also your description below that. Search engines will also use it to help out with ranking. You want to make sure to make that a human readable description.

The biggest thing there is make it so that people can understand it if they read and it kind of takes care of itself from there. There are a lot of different resources online that will help you out with writing meta tags. It's a good idea if you really want to get into it to look that up. You get a lot of good information out there. Then lastly, and I kind of skipped this one, but keywords are just comma separated keywords that pertain to your website. It doesn't hurt to put those in, but they don't really help that much anymore either. Six of one, half a dozen of the other with that I guess. That takes care of all the options on this page.

Once you have it set up the way you want, you just click on save changes. If you're anything like me, you'll probably go in here, make one change and save it, look at it, go back in, make another change, save it, look at it. I find that it's a way that works for me. The main thing to remember is always click that save changes button at the bottom before you leave this page so that everything gets saved. There you have it. As always, thanks a lot for joining me this week on Tech Tuesday. If you have any questions, concerns, feel free to send us an email at support@deltagroup.com or give us a call and we can walk you through anything.

You can also comment on the video on Facebook or YouTube. Don't forget to subscribe to our YouTube channel so you get notifications when our new videos come on or like our Facebook page and you should get notifications for our new videos there too. Thanks a lot as always. See you again next week.