We’re nearly there! In my free report, Get Your Website Done: 12 Actionable Steps for Designers, it’s time for Step #11: Code. If you’ve designed your website, the next step is to bring it alive on the web. Whether you want to leap full-force into standard development practice or don’t want to deal with code at all—there’s an option for you.
But before I dive in, I need to rave about WordPress for a hot minute. Yes, there are countless website builders out there. If trying one of them is your cup of tea, then by all means…go for it. But I only use WordPress because it’s awesome for so many reasons.
WordPress currently powers 27% of the web and is completely open source, so you are free to do whatever you want with it. Anything is possible. And the community is freaking supportively amazing (can you say WordCamp?!). I started building websites in 2008 and I learned (the hard way) that WordPress is hands down the best-ever website platform, period! Now, here we go…
Step #11: Code
Based on how much (or little) you dig code, here are three different routes you can take to bring your site to life on the web:
Do-it-yourself (without code)
In this approach, you don’t have to deal with code. You just need to be able to install WordPress, which you might be able to do using a one-click WordPress installer from your web host. Then you’ll have to choose a theme (read this first: WordPress Themes: Custom or Existing?). Some themes even have built-in page builders. From what I hear, Beaver Builder is quite nice although I’ve never used it. For more about page builders, check out this presentation from WordCamp Atlanta 2016: Page Builders Showdown.
Create a child theme
If you want to get your hands a little dirty and have some experience with HTML and CSS, you can create a child theme off the latest WordPress theme (or any other theme you like) and modify those theme files. Child themes are great when you want to only change a few things, yet still maintain the overall structure and functionality of the parent theme. To get started, check out Child Themes in the WordPress Theme Developer Handbook.
Become a development Ninja
This is how I do it. I use local development practices, which means I develop on my own machine (super-quickly and without an internet connection) with a program called MAMP. I also use a CSS extension called SASS which lets me use variables in CSS and makes writing the actual CSS much faster. I use a program called CodeKit to process my SASS into CSS. Codekit also reloads the browser every time I have an update so I don’t have to click refresh. (This might not sound like a big deal, but it saves you a lot of time over the course of project!) I use Bitbucket for version control with GIT on my custom theme and plugin. And I use SourceTree which gives me a visual interface with GIT to do my work.
After I have my local version of WordPress installed, I use a custom theme. It’s based off the standard WordPress theme best practices and has the front-end framework, Bootstrap, baked in. I also use a custom plugin for functionality items that should live separately from the theme. I work within different environments: local, staging and production until the site is ready.
Why do I do it this way? Because it’s the fastest way for me to work. I’m all about being productive and doing things in least amount of time with the same amount of quality. I love the custom theme approach because it creates sites that are lean and efficient; I get to use functionality that’s specific for each particular site and won’t bog down page speed.
P.S. If you don’t like any of these options, I can do the development for you. Let’s talk about where you’re at.
4 thoughts on “3 ways to code your own website”
If you develop locally on your machine how do you bring it online once it is done?
I use BackupBuddy by iThemes for migration from my local development site to a staging site online.
So using any kind of back up plugin would work?
Not any backup plugin will work to migrate a site. BackupBuddy is nice because it will change out all the URLs to work on the staging site if you don’t want to do that in something like phpMyAdmin.