Building a Basic Author Website with WordPress By Jeanette Grey

Building a Basic Author Website with WordPress

By Jeanette Grey

Overview Author websites Domains and Hosting What Is WordPress? Themes Graphics Plug-ins Widgets Content

Get this handout here:

http://www.jeanettegrey.com/

workshops/

Do I Need An Author Website? Yes. If you’re Pre-published

Show agents and editors you’re seriousBuild your brandOlder sites have a leg up in search engines,

so the earlier you start the better.

If you’re PublishedLanding spot for readers

What Should Be On My Website? At any stage in your career, your

website needs to include:a sense of who you are and what you write

○ “About” page○ Stylistic choices (Branding!)

“Coming Soon” – what are you working on?Links to social media / contact informationNews / Blog

What Should Be On My Published Author Website? A list of all your books in a logical order

Group series together. Help a reader out!Chronological order is nice

Buy links Mailing list Call to

action

Registering a Domain Registering a domain is reserving the URL

for the website Pick something professional

.com is bestIf your name is unavailable, try adding ‘author’

or ‘novels’ or ‘writes’ to the end Costs $10-18/year Consider adding privacy

Whois.net – look up any domain and find out who owns it

Registering a Domain - Beware Remember who you registered with. Do

NOT renew it with someone else. Domain “Parking” – when the URL you

want has a page offering to sell the domain. Beware it will be at a substantial markup.

Allow 24 hours between registering your domain and it working

Website Hosting

A website hosting company rents you computer space on a web server A web server is a computer that delivers

website content to anyone on the internet who requests it

Costs $1-10/month Some hosting plans allow you to host

multiple sites – consider sharing with a friend

Website Hosting (cont.)

You get what you pay for in terms of web page loading speed and customer service

Some hosting companies have “goodies”, including one-click installs of WordPress

Registering the domain and purchasing hosting from the same company simplifies the process and may earn you a discount

What About WordPress.com? Yes, WordPress.com will host your site

for free BUT

You can’t use your own URL – must be username.wordpress.com

They place ads on your siteLimited design options

UNLESS you pay additional fees.

What Is WordPress?

WordPress is a Content Management System - a program that runs on the server space you are renting from your hosting company

You use it to create a websiteCreate pages and blog posts as if you were

typing them into WordMakes it easy to publish, edit and organize

them

Advantages of WordPress WordPress vs. Blogger, Wix, Weebly, Etc.

Wordpress is more customizable and more powerfulWell suited to multiple usersMaintain ownership of your site

WordPress vs. A Static Site (built with DreamWeaver, GoDaddy’s Site Designer, etc.)WordPress makes it easy to change your site and

provides a framework for it to grow

Disadvantages of WordPress Commonly used and susceptible to

hackersPerform updates regularlyIt pays to have a clueful friend

Learning Curve

Installing WordPress Easy installation may be included with your

hosting package If your hosting company doesn’t do the

installation for youGo to WordPress.org to download a copy of

WordPressFollow the instructionsYou will need an FTP client – a program that

allows you to upload files to your web server. ○ Example: Filezilla

A Note on Versions of WordPress At the time of the creation of this

presentation, WordPress version 4.0 was the most current. Future versions may change things.

Welcome To WordPress! Go to

yourdomain.com/wp-admin

Pick a Site Title (usually your pen name)

Username and password Do NOT use admin

Check “Allow search engines to index this site”

Your Dashboard

“Pages” vs. “Posts” “Pages” are the meat of your site. Every

page will appear in your site’s menu “Posts” are blog entries. Only the newest

ones will appear in your News section.

Your Default Site

Make WordPress Act Like a Website, Not a Blog

You need to have a “Static Front Page” – one that doesn’t change when you add a new blog entry

Go to Pages and “Add New”

Add New Page Create a page

and call it “Home” Add any content

you want to appear on your homepage

Hit “Publish”

Go to “Pages -> Add New” again and make another page called “News”.Leave the content blank

Come back later to add “About” and “Coming Soon” pages

Optional: Turn Off Comments On Pages Go to Pages -> All Pages (While you’re here, delete “Sample Page”) Hover over “Home” and select “Quick Edit”

Optional: Turn Off Comments On Pages (cont.)

Uncheck to turn off comments

Change order in which pages appear in site menu

Make page appear as a sub-menu under one of the other pages

Change the URL for the pagehttp://www.yourdomain.com/home-2

Add a sidebar (if available as part of your theme)

Create A Static Home Page Go to Settings ->

Reading

Change ‘Front Page Displays’ to ‘Static Page’.

Set Front Page to ‘Home’

Set Posts Page to ‘News’

Permalinks Go to Settings -> Permalinks Sets up how WordPress will assign URLs

to your blog posts

Make Your Site Pretty: Themes A “Theme” is like a skin or a template. It

dictates the appearance of the site. Go to Appearance -> Themes If your host installed WordPress for you,

it may come with themes pre-installed If not, go to “Install Themes”

Branding, branding, branding

Mobile-friendly

Try some themes on for size Go back to ‘Manage Themes’

Click ‘Live Preview’ to see how your site would look with that Theme

Check out the options on the sideClick ‘Activate’ to make it so

Same site, different themes:

Customize Your Theme

Go to Appearance -> Theme OptionsChange colorsChange layout (example: add a sidebar)

Different Themes will have different kinds of options

Warning – Do NOT Edit Your Theme’s HTML / CSS files If you’re comfortable with HTML and

CSS, you can change things, but don’t do it in the files for the theme itself, because any updates to the theme will erase your changes

Create a “Child” theme instead.http://codex.wordpress.org/Child_Themes

Graphics: Making a Basic Banner

Most themes will have a suggested Height and Width for the header / banner image that appears at the top of each pageGo to Appearance -> HeaderLook for suggested height and width

Graphics: GIMP GIMP is a free graphics program http://www.gimp.org/

LayersTools

Color selector

Options for Active

Tool

To get started, click File -> New

Enter desired dimensions

Graphics: Making a Basic Banner Create a new image. Set size of image to

the dimensions suggested in your theme Use the ‘Bucket Tool’ to fill the background

with a colorSelect a colorClick on canvas

to fill with color

Graphics: Making a Basic Banner (cont) Use the ‘Text Tool’ to add your author

name and a tagline Use a cool font (branding!)

http://www.fonts2u.com/

Find a Stock Photo

Respect the intellectual property of photographers and protect yourself from lawsuits. Purchase stock photos legallyExamples: Veer.com, Dreamstime.com

Pick something that represents your brand

Try It Before You Buy ItSave the watermarked image before you

buy it and test it out to see if it works

Using A Stock Photo in Your Banner IF your stock photo has a solid color back

ground:Fill your banner’s background in with that colorIn GIMP, go to File -> Open As Layer and select

imageMove layer so it lies under your text but above

background

Using A Stock Photo in Your Banner (cont.)

If your photo doesn’t have a black background, you need to blend the edgeCreate a new layerUse the Gradient toolSet “FG to Transparent” (FG = forground)Click off the edge of the canvas and drag to

just past the edge of the image.

Get artistic with your banner! Add texture layers over top of the photo.

Play with transparency, and try erasing sections of the texture to highlight the photo.

Add a new layer and try painting over top of everything with black or a contrasting color. Use a large, soft-edged paintbrush and a low opacity

Save your banner! Save often. The ‘.xcf’ format will allow you to keep editing. When you’re done, go to File -> Export

Click the ‘Select File Type (By Extension)’ + Choose JPG

Upload your banner! In WordPress, go to Appearance -> Header

Upload the image you createdUncheck the “Show header text with your image” box Click ‘Save Changes’

Twenty-eleven theme

Customized colors (theme extension plug-in)

Custom banner

Plug-Ins Modules of programming that add functionality

to your website Examples:

Akismet - Moderates Comment SpamAll In One WP SecurityBackUpWordPressImage Widget – Allows you to add images to your

sidebar/footer areasJetpack – Website stats, Blog SubscriptionsMailChimp – Subscribe to mailing listSocial Media Widget – Allows you to add icons with

links to social media to your sidebar/footerWP to Twitter – auto-posts blog updates to your

Twitter account

Add New Plug-ins Go to Plug-Ins, then click ‘Add New’ Once you’ve installed a plug-in, don’t

forget to go back and activiate it

Widgets

Easily add components to your sidebar / footerNote: Whether you have a sidebar or a

footer depends on your theme. Check your theme’s options to turn them on or off.

Adding and Removing Widgets Go to Appearance -> Widgets

Installed widgets

Sections of

website

+

List of Active

Widgets

Drag and drop between the two to add or remove

Suggested WidgetsUseful Widgets Less Useful Widgets

Social Media Blog Subscriptions

(Jetpack) or Mail Chimp Image Widget –

showcase bookcovers Archives / Recent Posts /

Tag Cloud Twitter Timeline

(Jetpack)

Meta – displays login information for you site

Recent Comments

Content? My website needs content? To add new pages, go to Pages -> Add New To add new blog posts, go to Posts -> Add New Post Editor works like a word processor

Reveals more options

Add images / audio / video

Adding Images Click ‘Add Media’ and upload image

from computer

Caption will appear under image on page

Alignment:- None: image takes up whole line- Left / Right: Text will flow around image

Clicking on image can link to a webpage

Changing Image Properties Once the image has been added, click on it

to change its link / size / alignment / caption

Change image

Delete image

Drag corners to resize

(Note: do not resize animated gifs)

Post OptionsSchedule posts to publish at a specific date/time

Add tags or categories to make your posts easier to find

Maintenance Perform updates regularly WordPress will email you about big updates It will nag at you about minor ones

Protect Yourself From Comment Spam Under Settings -> Discussion, select

options that require commenters to fill out their name and email. Require comments be approved before they will appear on the site

Use askismet or another security plugin to automatically filter our spam comments

Have fun! No, really. Don’t be afraid to try things and

experiment. Explore! You can do it.