Wayyyy back in 2013, I did a post on setting up a professional author website, with an emphasis on self-hosted WordPress. Most of the things in that post still hold! EXCEPT: I no longer use Bluehost. See below for the skinny on that.
Over the last few years, I’ve picked up some new tips & tricks that I wanted to share. I hope this will help other authors with the DIY website root, as I know not everyone can afford to hire a professional (myself included!). But that doesn’t mean you can’t have a chic site.
One of my lifesavers over the last year+ has been Divi. It’s the flagship theme of Elegant Themes, which I mentioned in my original post. It’s a flexible, versatile theme that you can make do literally almost anything. This theme alone is worth the price of admission, which has gone up a bit to $69 a year for ALL the themes Elegant Themes makes (and you get all ongoing updates) but is 110% worth it.
To give you some context, here are two of my sites + one design iteration, created with Divi:
As you can see, you can take many different approaches–and these are only three examples (including two iterations for one site). Divi is GREAT for both text-based information as well as flashy image-based stuff. There are LOTS of resources available for Divi that you can use to do all sorts of cool things, which I’ll get into shortly.
For my current website layout (left), I did have to play around a bit to get it where I wanted, but ultimately it didn’t take me very long (a few hours) to accomplish a main page layout that was just what I wanted–a “splash page” with a logo, section links + social media callouts, which is the “standard” for many author sites right now. Everything I did involves very basic HTML coding (which I didn’t have to raw code–in Divi’s visual builder, it’s easy to do) + playing with Divi blocks. I didn’t want to tackle advanced stuff–on mouse over effects for links, image mapping etc. (I may do that later–I’m just very HTML rusty!), and I was limited to using free resources (by choice). For Author Mentor Match, Divi’s wide variety of options for blocks and layouts was a boon because we had a LOT of info we needed to convery without having a million pages. I was able to save the blocks that featured the mentor images/info so I could use them in multiple spots on the site without “redoing” them. A lifesaver.
Some Key Divi Resources
Elegant Themes has an A+ blog, with myriad Divi resources. You can scroll the currently-17 pages of archive, and if you go to the latter pages, you’ll find the 100 Days of Divi event posts, which are some of my favorites. They posted 100% FREE resources, including additional layouts, footers, gallery styles, and how-tos on things like adding more social media icons to your header/footer. Divi has a function where you can import layouts/sections/resources to your library (and the Divi resource posts have how-to videos on how to do that!), and the way the Divi builder works is you can load saved layouts, etc. easily so you don’t have to build things from scratch. It’s VERY COOL.
Here are some of my fave resources that I either used or have saved in case I want to use them in future:
- Contact Us layouts
- FAQ layouts
- Footer layouts
- Gallery layouts
- Modern Homepages/Single Page layouts
- How to add more Social Media icons*
*This is the only one that is a “how to” resource where you WILL need to have a modicum of CSS skills. But only a TINY BIT. The guide literally gives you the code you need, and you just have to replace the example (which is Myspace LOL) with the one you want to use–Instagram, Pinterest, etc. As a default, Divi only has four options that are “no coding required” and can be turned on/off through the Theme Options area–Facebook, Twitter, Google+, RSS. That last resource post shows you exactly how to add other icons to the header/footer. It just takes some careful reading and about 5 minutes of work.
Site Hosting Recommendation
So, after my last advice post, I left Bluehost. They have some major flaws (related to security) that slowly broke our relationship over time; I jumped ship over a year ago and am much happier. I STRONGLY recommend not using Bluehost–it’s very user friendly (and thus good for beginners) BUT when things go wrong, as they did for me multiple times, they throw you out on your butt (they will suspend your site/threaten to cancel your account, repeatedly). Unless you have advanced skills, you can’t fix “your problems” (which are really their problems) without shelling out hundreds for their BS “security tools.” They hose you for extra money instead of fixing their own d*mn security issues. (and they are their issues, though they will deny this. My site got hacked over and over despite my having friends who were IT professionals “clean” and protect it. This does bring up a good point: if you are self-hosting you MUST keep your sites up-to-date, especially themes/templates and all plug-ins.
I switched to eboundhost on the recommendation of a fellow author who also works in IT, and it has proved a VERY stable, cost-effective web host. Their customer service is unfailingly prompt and polite–when I’ve filed support tickets for things I couldn’t figure out, they were quick to answer and very kind when the answer turned out to be SUPER SIMPLE and I felt dumb opening a ticket haha. The only thing is they aren’t as “user friendly” as bluehost in the sense that logging into your customer account doesn’t also give you access to your c-panel, but that said when you go to your c-panel (which is simply a separate URL), that interface is very user-friendly. It just took me like an hour my first day to figure out where c-panel was haha.
Once you’re in your c-panel, you can install WordPress.org, that beautiful self-hosting tool that I will praise until my dying breath, and work on/edit/run your website through WordPress’s admin interface. It’s super intuitive (especially if you’ve used WordPress.com–they’re almost identical; .org just has more features) and easy to use.
Some Free WordPress Layout Love
While I am currently devoted to Elegant Themes & Divi, WordPress has SERIOUSLY stepped up their free layout game in the last few years. Here are a few that have caught my eye, for easy searching.
WordPress releases a “base” layout every year, named for that year, and their 2017 layout is seriously impressive. It’s bold and dynamic and has some things in common with Divi, re: use of images and scrolling. I’m using it on my personal (non-author) website currently.
This is a layout that would work very well for an author who has a book cover already, if you want to mirror the front page in the theme screenshot there. It reminds me of Elegant Themes’ Chameleon theme in that sense.
Has a similar feel to The Next–clean and streamlined with big, bright images.
Creating a dynamic text logo
In my original post, I gave some ideas for creating logos but offered no real solutions–at the time, my logo game was not great. It’s still not! I am not a professional designer by ANY stretch. But in the last few years, I’ve learned one trick that has enabled me to create text-based logos that can work really well for an author site.
This is my current logo + my last one:
As you can see, I’ve got some straightforward text with some colors/textures popping as opposed to one color. The current logo is over-laid with a photo of the night sky. It’s purposely subtle, and using a photograph makes the coloring, etc. look more dynamic. The older logo uses a pattern that had a color gradient style. For the logo on my main page (seen above in my main page screenshot) simply used a different, lighter photo of stars so it would pop against the dark background.
Here is how I did it! All you need are rights-free images/patterns (see below) + Photoshop.
That’s it! Make sure the background is transparent, not white, and save as a png.
Sourcing Awesome Fonts
Dafont.com is still one of my key go-tos for fonts, but given how key it is to find the *right* font to represent you and your brand, it’s worth doing a deeper dive. Here are some resources I’ve found (most free, but not all!):
Free Background Resources
You can’t get very far with today’s image-based/heavy websites without images! But you should NOT just pull images from the Internet/Google Search, especially if you’re establishing yourself as a reputable author. The last thing you want is a photographer or artist filing a copyright claim against you! (or, best case, filing a take down notice) There are some good rights-free image options, where you’ll find you’ll either have no obligation to give attribution or you do. ie: give credit for use.
My favorite, newest find is Unsplash, which is what Elegant Themes uses–so if you load some of their layouts, you’ll get some Unsplash images with it. They have thousands of high resolution, gorgeous images that are 100% free to use with no attribution needed. All the images used on the current iteration of my site are from Unsplash. Check out their collections, or just scroll the endless feed on the main page.
I’m also a fan of Pixabay, which has a variety of free-to-use stock images. I used this site as a resource for Author Mentor Match. Though one caveat is they only have so many images that work for writers/authors and I’ve seen at least three other outlets using the same stock images as AMM, haha.
An oldie but a goodie: I’ll reiterate my endorsement for Flickr Creative Commons. Just pay attention to the various license options!
You may also choose to set aside a small but reasonable budget for purchase a few key images/elements to use for your site. Most stock sites have a “pay for single image” or “buy small bundle of credits” options. I’m a fan of istockphoto.com (owned by Getty Images) and DepositPhotos.
Canva: Amazing, Free Graphic Design Resource
I am amending this post months after first posting it to sing the praises of Canva, which I only recently discovered. Even though I’m able to use Photoshop, I find myself now defaulting to Canva, because it’s EASY to create eye-catching, beautiful graphics. Here are some examples of things I made recently:
Free Photoshop Alternate
Photoshop is expensive, and being able to afford it/use it is a privilege. I am lucky to have access to Photoshop through my various projects, but not everyone has that, and I haven’t always had that, either.
Admittedly, I’ve not used an alternative program, but I did some searching and it seems the overwhelming recommendation is GIMP, which stands for GNU Image Manipulation Program. It’s 100% free. It looks like you can do the same logo clipping mask thing as demonstrated above, so it should be comparable!