How to create a WordPress website in $65
So once we really talk about how to create a WordPress website, you will probably find alot of blog posts that suggest that this is the best hosting for you, they have awesome customer support so on and so forth. So then, what is this blog post about?
It’s how you can build a complete WordPress website from SCRATCH. No I’m not kidding, this post took me a complete 3 weeks to compile. The reason being that it’s a step by step guide on how you can create a WordPress website for your business, for your blog, for your ecommerce store etc.
So if you scroll down at the bottom, I’ve given a demo website link which we’re going to create. After you’re done with this blogpost you’ll be able to create a $2500 website in under $65 (Using a Free Theme). Click on the link below to visit the demo website.
In any case if you feel like getting in touch with me, follow me on Pinterest and leave a message.
Demo website that we’re going to create: http://demo.athemes.com/themes/?theme=Sydney
Register your domain/website name
If you want a domain name and create a blog, then you can CLICK HERE, then continue the steps listed below.
The very first thing when starting a blog on Siteground is to come up with a name of your domain name/website name. While this is a very tough decision, you have to REALLY think about what it’s going to be because this is going to last for YEARS.
You can get your domain directly through Siteground and make the process easy and very fast. Purchasing a domain name from Siteground will cost $15.95
If you purchase through my LINK, they will even offer you a 30 day money back gurantee
So why did I tell you to sign up for Siteground and not Blue host?
That’s simple, because I know what I’m talking about. Many advertise about bluehost with little or no knowledge. Let me show you what I’m talking about
Here you can see a website that promotes how bluehost is cheap and how to set it up. (Name hidden). You can check out page speed with gtmetrix.com
Well over here, here’s my website which I host on Siteground.
Now, I know you’re new to this particular field, but look at the difference in the Page load time. The first blog talks about bluehost and look at their website page speed scores and YSlow Scores. It takes 3.4 seconds to load that page, whereas, my blog loads in 2.5 seconds.
Why? That’s because of SiteGround. They have the best contact support; with their help I’ve achieved an incredible fast website.
If you don’t know already, among other factors, site speed will determine the success of your website/blog.
Purchase SiteGround Hosting Here
Furthermore, by clicking on the link above you’ll get a hefty discount. The normal charges per month charges for Siteground is $9.95 for the basic one but, clicking on the link above you can get it for $3.95 per month. There are also different packages that will suit your needs, on each package they provide, by clicking on the link above you can get discounts on EACH and EVERY one of them.
Some of SiteGrounds offer which you can purchase from theme
Awesome features that come with SiteGrounds Hosting
Opportunity to host multiple websites – the StartUp hosting plan allows the user to host only one website, whereas if the users is interested in hosting multiple websites under the same hosting account, then GrowBig or GoGeek would be better fit.
Supercacher – this is an in-house developed by SiteGround tool that manages to speed up the website several times, but also improves the Google ranking and the SEO optimization. It consists in three levels while all of them at once are available only on the GrowBig and the GoGeek accounts.
Priority support – although they have remarkable response time on each channel – Ticketing system, Live Chat and Phone, still our GrowBig and GoGeek clients are handled with priority which might be something important for your visitors, especially if they’re newcomers.
Free backup restore services – Paid option with the StartUp plan
Buy a hosting for your blog – How to create a WordPress website
Installing a WordPress blog on SiteGround is very easy. Every now and then I get asked a lot on how much does a WordPress blog/ professional cost? Well here it is:
- To start a blog cheaply all you need is the “Basic” plan by Siteground. From my link it’s only $3.95 a month if you sign up for 12 months, pretty cheap right?
Remember, buying something in bulk is always cheaper.
- If you are new to blogging start from a 12-month plan and the total price will be $63.35 for a year, domain name included.
- One other thing that you should purchase is domain privacy, this is for $1 per month. You want to buy this so your contact information stays safe.
- YOU DON’T NEED ANYTHING ELSE THAT SITEGROUND SELLS. Remember, you’re on a budget as was I.
- If you purchase SiteGround from my LINK, you will get a hefty discount and LET’S ENCRYPT SERVICE (Makes the website more secure)
- Furthermore, they will even offer a 30 day money back gurantee if you purchase through my LINK
Sorry if I keep on dragging the 12 month hosting plan but here it is again. I DON’T WANT YOU TO MAKE THE MISTAKES THAT I MADE when starting. A monthly plan is less effective.
When I started, I started with a month plan and long behold that month ended pretty quickly. Therefore, I highly recommend signing up for a minimum of 12 months. Signing up for 12 months has to a lot of advantages such as, a lower monthly pricing, furthermore, you don’t have to deal with an expired website after each month.
For instance, let’s say you went on a vacation and during that vacation your monthly plan expires. You’ll lose visitors, business and most importantly MONEY.
I guess the question is why would you pay MORE when you can pay LESS.
Blog hosting with SiteGround will likely cost you around $47.40 a year for a 12-month plan ($63.35 if you purchase your domain from SiteGround), or $142.20 for a 3-year plan. Sounds pretty good right considering you can generate thousands of dollars for such a small price. A further recommendation would be to buy a 36-month plan if you wish to make a career out of blogging. That way the monthly rate is MUCH lower.
When you have decided to create your own blog, the following steps should be carried out
- Check out the amazing discount that you can get from my LINK in the screenshots below
- Go to SiteGround and click the “Get Started Now” button.
- Click on the package which you like
- Enter the domain name that you’ve thought about and check its availability.
- Enter your personal and payment information
- You’ll be asked to enter a password. Make sure that you think of a secure password
- You’ll see that you can get a discount for everything if you purchase through my LINK
- VOILA, you have a new domain
If you’re having difficulty in signing up for SiteGround you can always reach out to me and I’ll personally guide you through the procedure. I also know a great guy from SiteGround that can help you solve the problems that you’re facing.
Install WordPress on Siteground – How to create a WordPress website
Since you’ve done all the steps, THIS IS It. If you want to use WordPress on your blog, then continue the steps mentioned below.
This part is by far the easiest. Furthermore, it’s absolutely FREE
- After your account creation with SiteGround, SiteGround guides you through exactly what you need to start your very own personal blog/business website.
- First, WordPress will ask you to pick a theme. You can pick any random theme you like and that could also be a free theme. Don’t worry, you can always change it later so you don’t really have to think about that.
- Click on “Start Building”
- On the next screen, you can choose whether your website is going to be a “Business” or “Personal” website.
BOOMMM, you have a WordPress Blog. Many marketing advertisers charge you a couple of thousand dollars for this step and I’ve shown it you for FREE. Good luck and Godspeed with your new blog.
Remember, if you do have any difficulties in signing up for SiteGround you can always contact me. I’m here to help.
Some things that I’ve learnt from my past mistakes
- Your hosting services matter a lot regarding site speed. Pick up SiteGround, they have awesome server speeds.
- Start learning SEO.
- You can also start an SEO project with me. I’ve ranked alot of websites for numerous clients. Check out my Blogpost on how to increase traffic to your website.
I’ve even outranked FACEBOOK. Yes FACEBOOK.
So now when you have completed the above steps its time to create a beautiful website. Here’s the complete blueprint.
Step 1: Log into your WordPress Website
There are two ways to log onto your website:
- You can click on the link provided on the SiteGround page after the quick install
- Or you can go to your email and open the new email you have from SiteGround
You can login to your website via www.yoursite.com/wp-admin
Just enter in the username and password and you’re good to go
Step 2: Download and Install the free theme
For my website I used a free theme called Sydney. Of course there are plenty of themes out there, but this seemed to fit my business.
Note: This website if made by a professional can cost you around 3000$ but I’m going to show it to you completely free and with no steps skipped
- On the left hand side, click on appearance – Move the cursor over “Themes”
- Hover over add new theme
- Hover over the search bar
- Type in Sydney
- Click on Sydney and Press Install
- You’ll be taken to another page – Click Activate theme
Step 3: Install Plugins
- Go to your WordPress dashboard and click on plugins
- Select the option of Add New
- Install the following plugins:
Custom Sydney toolbox plugin
- Once you find these plugins click on install
- Hover back to the plugin menu and click on installed plugins
- Activate the plugins that you installed recently (There’ll be an activate button on the bottom of each plugin)
Step 4: You have to download some more plugins
- Contact Form 7
- Black Studio TinyMCE Widget
- SiteOrigin Widgets Bundle
- Simple Lightbox
- Recent Posts Widget Extended
Don’t forget to activate these plugins as mentioned in STEP 3
Step 5: Find images for yourself
You need some beautiful images if you want a beautiful website. Get those high resolution images that fit your business or your blog. By the way, you can use this theme for your blog as well.
Remember always look for high resolution images.
Step 6: Upload the images onto your WordPress Site
- Go to your WordPress website > Media > Add New
- Upload your images to it
This is where you actually start designing your website
Step 7: Create a beautiful landing page
- Go to your WordPress dashboard and hover on pages
- On the upper left side, you’ll see “Add New”. Click on it.
- In the title bar, add home/homepage
- Scroll down below and go to the Page Attributes on the right side
- Select Front Page in the Template drop down
- Click on publish
Congratulations, now you have a homepage. Easy Right.
To check your homepage, hover over on the extreme upper left side where you have a home icon, Click on visit site
Step 7b) Designing the homepage
- Go to your WordPress dashboard
- Appearance > Customize
- You’ll be taken to your website with a menu option on the left
- Scroll down to homepage settings and below “Your Homepage Displays” select “A Static Page”
- Click on the drop down below “Homepage”, select “home
- Scroll down below you’ll also see a Posts Page option> Blog
- Click publish
Step 8: Editing your slider images of the homepage
The homepage images that you want to represent your business with are going to go over here
WordPress Dashboard > Appearance > Customize
You want a full width header type
- Click on Header Type and below the Front page header type select Full Screen Slider (This is what makes the website look beautiful)
- Scroll to site header type and select “No Header”
The homepage images go here
I’ve kept the default slider speed which is 4000
- In the first slide, add an image that you want to show the people as soon as they come into your website
- Add the necessary title to it and Subtitle for the first slide
- If you want more images you can add them on the second slide
- Scroll down further below and you will see a call to action button. This is the read button from which your visitors will be directed to your contact page or whatever you want them to go to. Could be your blog page
- Add a URL to it (http://www.yoursite.com/contact-us) / http://www.yoursite.com/blog (For a blog)
- Add some text to the button
- Slider mobile behavior > Full Screen
- Sticky Menu > Select Sticky
- Menu Style > Inline
- Blog Layout > Classic (Alternative)
- Check the option of Full width single posts
- Scroll down and add 20 to the Excerpt length
- Click on Fonts
- Body Fonts > Change it to 15
I use Google Fonts for my website, I wouldn’t recommend it because that slows down the website.
- Click on Colors > Background color #ffffff (Paste this short code in)
- General > Primary color #d63737
- General > Body text #000000
- General > #000000
Colors > Header
- Menu Background color > #d63737
- Site Title > #ffffff
- Site Description > #ffffff
- Top level menu items > #ffffff
- Menu Items hover > #d65050
- Sub-menu items > #1c1c1c
- Sub-menu background > #1c1c1c
- Mobile menu button > #ffffff
- Header slider text > #ffffff
Colors > Sidebar
- Sidebar background > #ffffff
- Sidebar color > #000000
Colors > Footer
- Footer widget area background > #252525
- Footer widget area color > #767676
- Footer background > #1c1c1c
- Footer color > #666666
Step 9: Adding CSS
Step 10: Create a Logo and Favicon
A business website is not a business website until it has a logo – Time to create your very own FIRST logo
- You can create your own logo from Logomakr or Nounproject (Both of them are absolutely free. I created my services icon and logo by Noun project)
- Go on Logomakr
- On the search bar type in the logo you’re searching for.
- You can even add text to your logo by clicking on T
- Design it well and make sure it fits
- I kept my logo color white as it went with the red background. The color code that I used is> #ffffff
- Once you’re done with the design, save it on your computer
- Download it in a PNG format
Now you have your own logo, time to upload it to your website
- Go to your WordPress dashboard > Appearance > Customize
- Site title/tagline/logo > Site icon> Select Image
- Upload files > Upload the logo that you created
- Save and publish
Step 11: Modifying your website URL/ Permalinks
You need to modify so that your links can show a “www” before the actual URL begins
- WordPress Dashboard> Settings> General> WordPress Address (URL) and Site Address. Type in your website address (It’s going to look something like this http://www.yoursite.com”
Time to modify Permalinks
- WordPress Dashboard> Settings> Permalinks
- Common Settings > Select the Post name option
I prefer this option as compared to others. Keeps the URL cleaner. But that depends on you, do you want your URL to look like https://www.yorusite/2018/02/11/sample-post/ or something like this https://www.yoursite/sample-post/
Step 12: Customizing your Homepage
Time to add some content your WordPress Homepage
- WordPress Dashboard > Pages > Homepage (Whatever you named it)
- This is where the page builder comes in handy
Step 13: Creating a Service section (If you’re creating a blog skip this step)
If you’re a small business owner you should have some services to offer, if you’re building a blog website you don’t need to follow this step.
- WordPress Dashboard > On the left side you’ll see a services section, click on it> All services
- Add New Service > Title (Your service) > Add some description to it
- Add Media > Select a logo for your service (this can be created by either LogoMakr or Nounproject)
- The logo should be above the description and in center. You can do this by clicking on your logo and selecting the center option for the image
- Add a category (Lower right corner) > Add new category > Type in “Type-A” (This will help later on
- Add a few more services and put them in the type-a category by the same method
Note: Don’t make a new category, insert your services in the same category by scrolling down to category> You’ll see “type –a” category> Save and Publish
Step13b: Adding the service section to your homepage
- WordPress Dashboard>All Pages>Homepage
- Add row
- Select the created row> Add widget> Sydney FP: services Type a
- Hover over this widget> Edit> Type “-1” to show all your services (You can show as many services as you like, just type in the number to it)
Enter the slug for your category: Leave it empty if you want to show all your services or type your category
Pro tip: Use logo images of the same aspect ratio otherwise your services won’t be inline.
Step 14: Creating a Call to Action (Bloggers can use this to add content that fits their needs)
A call to action button is crucial for your website, it’s going to give your website higher search results as well by “Interlinking” Pages
- WordPress Dashboad> Pages> Homepage
- At the top of the corner you’ll see an option of “Add a row”, click on it
- A new window will pop up > Set row layout> 1> Done
- Hover over the new row> Click on the wrench> Edit> On the right corner you will see an option called layout> Click on it> Top/bottom padding 50
- Scroll down> Row Layout> Full Width
- Design> Background image> Upload the image that you want (I’ve used the one linked below)> Click Save
- Select the row that you’ve just made> Click on “Add Widget”> Layout Builder> Done
- Hover the mouse over the widget> Edit
- Design Tab> Top and Bottom padding 9px
- Within the layout builder> Add Row> Select the row> Add Widget> Add Text Widget
- Hover over Add Text Widget> Edit> Border Color: #d65050> Widget Title color: #d65050> Headings color #d65050> Done
- Hover over the text widget> Click Edit> Put in a title “Find out what we’re all about” > Done
- Within the same layout Builder> Add Row> Columns 2> Done
- Hover over the new row> Click on it> Add Widget> Select Sydney FP: Call to action> Done
- Hover over the Sydney FP: Call to action> Duplicate. Now you will have two columns within one row. Align theme.
- Hover over the Call to action tab> Edit> Add text to “Enter your call to action” (Take some time and meet our employees”
- Design> Content alignment> Left
- Widget title color: #c1c1c1
- Headings title color: #c1c1c1
- Font color: #c1c1c1
- Link for the button http://www.yoursite.com/meet-the-team
- Title for the button> Meet The team> Done
- Hover over the next call to action widget and add the necessary text to it
- Link for the button http://www.yoursite.com/contact-us
- Do the same steps as mentioned before
- Hit Save and Publish
- Visit your website
Step 15: Creating a blog post section
For your blog post section follow these steps. If you’re a blogger looking to build a website, follow the instructions. Even if you own a small business, a blog will help you grow.
- WordPress Dashboard> Pages> Homepage
- Scroll to the top left corner> Add row
- A new window will pop up> Number of rows 1
- Hover over the new row> Select It> Click on Add Widget
- Scroll till you find “Sydney Latest news”
- Upload it in your new row> Done
- Visit your website
Step 16: Creating another call to action button (Note: If you want a website exactly like mine, skip this step) (Bloggers can change this call to action and redirect it to a category in their blog)
- WordPress Dashboard> Pages> Homepage
- Add row (You can change the arrangement of the rows to whatever suits you)
- Change the number of columns to 1
- Hover over your new row> Click on the wrench> Edit Row> Layout> Full Width
- Add the value 30 to the top/bottom padding
- Scroll over to Design and change the background color to #252525
- Click Save
- Hover this row and select it. Add widget> Sydney FP: Call to Action widget
- Click on the widget, leave the title blank and in the description write something about what your clients say “Look at what our clients are saying”
- For the link button, you can put in whatever URL you feel like. I did something like this: http://www.yoursite.com/client-testimonials/
- For bloggers, you can link the button to (https://www.yoursite.com/category/your blog category/)
- For the button text add “Client testimonials”
- Check the box for inline text
- Scroll to the design tab with in the widget> Heading color: #8c8c8c
- To add testimonials> Click on the testimonials tab on your WordPress Dashboard> Add New> Write down the testimonial you want to write (Add the same category to each testimonial. For e.g. Testimonial-a)
- Once you’re done with adding your testimonials> Go to Pages> Homepage> Testimonial section that you added in the above step> Type the category that you made in Step 15 (Testimonial-a)
- Visit website
Step 16b: Creating a About Us Section on your Homepage
- WordPress Dashboard> All Pages> Home Page
- Add Row> 1 Column
Design: Full Width
Background Image: A background Image can be used or you can have a white background
Row Layout> Full Width
- Select the new row> Add Widget> Visual Builder
- Title> About Us
Add a description
Step 17: Social Media Widget Section
- WordPress Dashboard> Plugins> All plugins> Activate Siteorigin Widgets Bundle
For creating Social Media icons on every page, you will have to do this with every page. I recommend this because it’s going to make your website look more beautiful and professional.
- Pages> Homepage> Add Row (To the bottom)
- Hover over the new row> Edit> Row Layout> Full width
- Row Layout> top and bottom padding: 10px
- Scroll to the design tab> Change the background color to #1c1c1c
- Done> Save
- Hover over the Row that you just edited> Select it> Add a widget> Add SiteOrigin Social Media buttons widget
- Hover over the widget> Add as many social media buttons you want
- Add links to it
- Icon color: #ffffff
- Background color: #252525
- You should use the same color scheme for every button so it looks even.
- Here are my settings for design and layout:
Open in new window: Check
Icon Size: Normal
Rounding: Slightly Rounded
Mobile Align: Left
Step 18: Creating an about me section
Before we create a 2nd page, you want to get rid of the header image from all the pages. To do this, follow the steps below:
- WordPress Dashboard> Appearance
- Customize> Header Area> Header Type> Site header type> No header (only menu).
- WordPress Dashboard> Pages> All pages
- Click on Add new
- Create a row> Column: 1
- Layout Tab: Full width
- Top/bottom padding: 30px
- Hover over this row> Select it> Add a widget> Add Visual editor
- Hover over the visual editor> Edit> Title your page About Us
- Write a good description
- Save and Publish
- Time to add another Row
- Add new Row> Column: 1
- Edit row> Layout: 30 top/bottom Padding
Row Layout: Full Width
- Select the edited row> Add widget> Look for Sydney FP: Facts
- Hover over Sydney FP: Facts and add your logos to it. (You can do that by clicking “You can find a list of the available icons Usage example: fa-android [Click on “Click here to get shortcodes of your icons)
- Click save
- Time to create a new call to action button
- Add Row> Edit Row> Layout> Top/bottom Padding: 20px
Yow Layout: Full Width
- Select this row> Add Widget> Visual editor
Add a necessary title to it with a description
Widget Title color, Headings color, Font Color: #fffff
Background color #252525
- You can even add your contact
To add contact info, click on the row and then Add Widget, look for Sydney: Contact Info
Step 19: Adding Employees (Skip this step if you’re creating a blog site)
To add a new employee, do the following steps
- WordPress Dashboard> Employees (Should be on the left hand side)
- Click on Add New Employee
- Add a profile picture and relevant content
- Once done, click on Add a new category on the bottom right
- Create a new category and name it
- If you want your employees to show in the same category, select the same category to which you want to assign them.
- Add their credentials by scrolling down at the bottom of the page
Step 20: Time to create a new Employees Page (Skip this step if you’re creating a blog site)
It’s time to create a new employees page
- WordPress Dashboard> Pages> All pages> Add new
- Title your page with “Meet The team” or “Our Team”
- Add a Row to your new page
- Set row layout to 1
Top/bottom padding: 40px
Row layout: Standard
- Select this row and add a widget to it> Visual Editor> Title it “Meet The Team”
Next add a widget to this row> Sydney Employees
- To show all the employees select the value of -1
Pro Tip: Try to use images that have the same aspect ratio and size, that way it’s going to look more even.
Step 21: Create a Project page (Skip this step if you’re creating a blog site)
- WordPress Dashboard> Plugins> Add new plugin> Foo Gallery
- Install and Activate the plugin
- On the left hand menu, you will have a new tab called “Foo Gallery”, Click on it
- Add Gallery> Enter the title of the gallery such as “Completed Projects or Portfolio”
- Add the relevant media to it
- Leave the default settings
- There will be a gallery short code, Copy that short code, you’re going to need it for the next step
- Return to your WordPress Dashboard> Pages> All pages> Add New> Title it “Our Projects”
- Add a Row> Layout: Full width
- Select the row> Add Widget> Foo Gallery
- You can title it and select the gallery you created back in Step#3 and Step#4
Step 21: Create a Contact Us Page (Blog websites need this page as well)
- WordPress Dashboard> Pages> All pages> Add new
- Title it “Contact Us
- Add a row> Row Layout: 1
- Click on the new row> Add widget> Sydney: Contact info> Put in your name address and phone number
- Add a new row> Row Layout: 2> Keep the percentage 70% on the left and 30% on the right
- Add a visual editor plugin to both the rows
- You can add your Google maps location to the left and contact form 7 on the right
Step 22: Configuring your contact Form
- WordPress Dashboard> Contact (Should be on the left)
- Add New> Edit the form by scrolling below Add the required fields
- Click on mail>Type in the email address to which you want to receive emails from your visitors
- Go back to contact and you’ll see a short code, copy it
- Go back to your pages> Contact Us Page> In the right visual editor>Click Text on the top right corner and add the short code
- VOILA you now have a contact form
Step 23: Adding Testimonials to your WordPress Website (Skip this step if you’re creating a blog site)
- WordPress Dashboard> Testimonials (On the left)> Add new Testimonial
- Title> Name of the client
Description> Add your clients Testimonial
- Scroll to categories on the right> Add new category> Save the testimonial to that category
- Create more testimonials like these (Note: Add the testimonials to the same category that you named in the step above> Check the box of the category you named in the above step)
- Save and publish
Step 23: Time to create a testimonials page (Skip this step if you’re creating a blog site)
- WordPress Dashboard> Pages>Add New
- Label it Testimonials
- Add a new row> Set row layout to 1
- Hover over the new row and click on the wrench> Layout>Top/bottom padding: 40px
Set Row Layout> Full Width
- Hover over the edited row and select it> Add Widget> Add Visual Editor> Title: “Our Testimonials”> Save> Publish
- Add a new row> Set row layout to 1>
Edit the row> Layout> Full width
- Hover over the row> Select it> Add widget> Sydney FP: Testimonials> Edit this widget> Add -1 to the number of testimonials shown. (Note: This will enable all of the testimonials to be shown)
- You can even add an image to the testimonials section. Edit ROW (On which you added the testimonials widget)> Design> Background image> Upload the background image.
Step 23b: Creating Testimonials
- Go to your WordPress Dashboard>Testimonials> Add new
- Title it, add a decritpion
- Add new caregory> Type Testimonial-a
- Set a featured image of your client
Step 24: Create Blog Posts
- WordPress Dashboard> Post> Add new
- Title> your blog post title
- If you want to categorize your blog post you can. Even if you leave it that doesn’t matter
- Add a featured High Res image to your blog post (This will be your thumbnail for the blogpost)
- Save and Publish
Step 25: Make a Header Menu
You have to create a menu/ header for your site.
- Go to your WordPress Dashboard> Appearance> Menus
- Click create new menu
- Name your menu (Main Menu) > Create Menu
- Add your pages to your menu> Save Menu
- I’ve added the following pages:
Home, Success Stories, Blog, Contact Us, About Us
- WordPress Dashboard> Customize> Menus> Click on the “Main menu” (name of the menu your created)> Set it to primary
- Menus> View Locations> Select the menu that you created
You have created your first professional website for free