This is Day 3 of the 10 day Build Your Website Challenge. If you missed Day 2, on Functionality & Choosing a Platform, you can find it here.
Of course, the goal is that, by the end of 10 days, you’ll have your DIY website up and running!
Okay, buckle up, this is definitely the most annoying day of the challenge. Today, we’re setting everything up and connecting all the behind the scenes stuff to make sure our site can function properly. I promise, none of the steps are actually HARD. Sometimes, they sound techy or complicated or scary, but it’s all do-able, even if you’re allergic to technology. Just take deep breaths and do one step at a time. Or, take a break in between each one if you need to! I’ve broken it down into parts, so you know when you can stop and step away.
(Scroll down for detailed information.)
- Hosting & Domain
- Install WordPress & the SSL certificate
- Purchase & download Divi, get your API key.
- Get a child theme.
- Go into WordPress admin, install Divi & child theme.
- Add in API key, color defaults, name & tagline.
1.Hosting & Domain
First of all, I highly, highly recommend getting these from the same company at the same time. It will make your life a lot easier, just trust me. I personally use and recommend SiteGround. I’ve been working with them for years and most of my clients use them, and I’ve literally never had a problem. (Whereas I’ve had tons of problems with other hosting companies over the years!).
A. First, go to SiteGround.
B. Choose the cheapest, most basic hosting package (StartUp).
C. Finally, get a free domain when you register.
Got stuck? Get free customer support here.
(optional) If you’re not sure about shared hosting vs. cloud hosting, you can read about it here. But the TL;DR is that I recommend shared hosting for getting started.
2. Install WordPress & the SSL certificate
While you’re still in your hosting account, you have two more tasks to complete. One is to install WordPress on your site, and the other is to install a security certificate. These might sound like complicated tasks, but most hosting companies make them both very easy.
To install WordPress:
A. First, go into your SiteGround dashboard.
B. Click ‘Install & Manage WordPress’
C. Under ‘install new WordPress,’ choose if you want just regular WP or WP and WooCommerce combined (for online stores). If you don’t know, just pick regular WP and you can always add Woo later.
D. Finally, follow the instructions to finish installing WP. If you don’t know the answers to things, it’s okay. Just do your best and you can change or add things later. Honestly, the only really important thing here is your email & password, so make sure to set those up correctly and save them.
To add a security (SSL) certificate:
A. First, log into your SiteGround dashboard.
B. Go to Security > SSL Manager.
C. Under ‘select SSL,’ chose ‘let’s encrypt’ and click ‘get.’
It’s free on SiteGround, but make sure to check first if you’re using a different hosting company.
D. Go to Security > HTTPS Enforce.
E. Finally, click the toggle to make sure the HTTPS enforce is on. This makes sure that your site is secure and is using the certificate.
Got stuck? Get free customer support here.
3. Purchase & download Divi, & get your API key.
Of course, you can use whatever theme you want it. And, f you want to choose a free theme and try that out first, you can go ahead and skip this step. But, I highly recommend at least giving Divi a try, because I think it will save you a lot of time and frustration down the road (I speak from experience, lol).
In this step, we’ll go to the Elegant Themes website to purchase and download the Divi files. While you’re there, we’ll also get your API key. This is like a password that lets Divi know that you actually purchased it and didn’t just get the files from somewhere. Of course, you can still install Divi without the key, but you won’t be able to run any updates and your theme will likely not work for long.
A. First, go to the Elegant Themes website to purchase a license for Divi.
B. Go to Account > Product Downloads.
C. Click the big purple button to download Divi and save it for step 5.
D. Go to Account > Username & API Key.
E. Make sure you copy your username that’s listed here and save it for step 6.
F. Finally, click ‘Generate a new API key.’ Copy the code that’s generated there and save it for step 6.
Get stuck on this step? Get free customer support here.
4. Get a child theme.
Basically, we’re adding a second theme right now. We need it to keep the main theme protected from our changes and so that updates to the main theme don’t affect our changes either. But don’t worry, because the developers at Divi Cake (I know, best name ever) will make it easy for you.
A. First, go to the Divi Cake Child Theme Generator.
B. Fill in all of the details. For the description and name, I usually just use ‘Divi Child Theme for….’ Just make sure the parent theme is listed as ‘Divi,’ and you’re good to go.
C. Click ‘Build your child theme!’
D. Finally, check your email (and spam folder) for the files and download them. Save the file for step 5.
Get stuck here? Get help from Divi Cake!
<h3>Go into WordPress admin, install Divi & child theme.</h3>
Okay, now we’re done gathing all the pieces and we’re ready to put them together. It’s time to head over to your actual website and start building!
To log in to your WordPress website, you have a few options. First, you can get there from your hosting by clicking the little door icon next to your website under ‘install & manage wordpress.’ Or, you can also go to your domain name.com /wp-admin to get to the log in page. There you can use your email & password that you set up in your hosting to log in. Once you’re logged in to your WP admin page, the rest of this task is fairly simple. If you get stuck here, ask your hosting company for help.
If you get confused about what goes where or how to log in to all the different parts, this article on logging in to WordPress might help!
A. From your WP dashboard, go to Appearance > themes.
B. Click ‘add new’ at the top.
C. Choose the Divi file and upload it. When it’s done uploading, click ‘install’ and ‘activate.’
D. Finally, repeat the same steps and now upload the child theme files.
Add in API key, color defaults, name & tagline.
Okay, so, we’re mostly done, yay!! There’s just this hodgepodge potpourri of little tasks left here to clean up! All of these are done from your WordPress dashboard. You definitley need to add in the API key, but it’s up to you if you want to set the color defaults, name & tagline or not (but I highly recommend doing them!).
Add in your API key:
A. First, go to Divi > theme options.
B. Click ‘updates’ in the purple menu at the top.
C. Enter the username and API key that you copied in step 3.
D. Finally, click ‘save changes’ and you should get a green check mark letting you know that it’s all connected correctly.
Add in color defaults (optional):
A. First, go to Divi > theme options > General
B. On the Color Pickers Default Palette, add in the colors that you chose earlier on this challenge. You can always come back and edit these later.
C. Finally, click ‘save changes’ at the bottom of the page.
Add in your name & tagline (optional):
A. First, go to Appearance > Customize.
B. Click on ‘Site Identity.’
C. Add in your site title & tagline that you chose earlier in the challenge.
D. Finally, click ‘publish’ at the top to save your changes.
Stuck? Get help!!
SiteGround Customer Support (steps 1&2)
Divi/ Elegant Themes Customer Support (step 3, 5, & 6)
Divi Cake (step 4)
Okay, that’s it for Day 3 of the DIY Website Challenge. If you didn’t get through everything, it’s okay. Obviously, you can still go on to Days 4 & 5 (on collecting & organizing your content) while you continue working on getting everything connected. However, you will need everything to be functional before starting on the lesson for Day 6, so don’t procrastinate toooooo much!
