Online Website Building Course
with WordPress and Elementor
Let me guide you thru the process on building a website step-by-step. This is not the course where you import a template and will not understand a thing by the end…this is the WordPress course where you will learn the basics, the process and additional techniques to help you achieve your goals!
Let’s get started…
We need a plan…let’s see what will we need and why!
- Link to GURU (£1 for first month)
- Link to Siteground (60% OFF)
- Link to Tools (colour palette, etc) need!!!
- Link to Iubenda
- Link to my Toolbox with additional resources
We need to get started the right way and for that, we need a plan. Let’s see what will we need:
- Domain name (From your hosting provider or Namecheap)
- Hosting provider (Like GURU, Siteground or Cloudway)
- Budgeting
- Basic details
- Logo and other media content if possible
- Colour palette
- Copy – any text content
- Functions, what will we need, will be part of budgeting
- Privacy policy (I use iubenda)
As a first step, you will need to buy your domain name. This can be done thru a dedicated domain name provider like Namecheap, or thru your hosting provider as part of the package selection process. This could be easier to handle at first (My recommendation to get started are GURU, Siteground, GoDaddy or Cloudway).
Next, we will need to make sure that the main details are available and ready for action. Need a budget to see our options (this is important for bigger websites, but regular business or blog sites are fine on a lower budget).
For design, you will need to prepair your logo and any other media content that could be needed. This can be done over time, but better to have them ready in the beginning.
Webhosting options I can recommend
To get started with your journey I would choose:
…depending on your requirements, but in booth ways, you can upgrade to a higher tier at that stage of your website (grown big and need more resources for your visitors).
SSL, PHP settings and a business email address
My recommended settings for running your website:
- PHP 7.3 minimum
- ZIP option is needed
- Max execution time 300
- Memory limit 512MB
Installing WordPress the easy way (in cPanel)
Automated WordPress installer is available in almost all cases, but what you need to make sure is right:
- Protocol: HTTPS://
- The right domain name if you have multiple ones on the same package
- version, always the latest
- automated updates for minor updates only
- a good admin username and password. Make sure to keep it safe! 🙂
- Multisite option NO
- no plugins or other bits are needed
Our first steps we need before moving forward!
- WordPress 101 course
- Link to Hello theme
- Link to GeneratePress theme (10% OFF for Premium)
- Link to Astra theme
- Link to Elementor
We need to make sure that we have certain settings in place before we can get started:
- link to your admin area: yourdomainname.com/wp-admin
- update everything if needed
- Settings / Reading / Discourage search engines option
- Choose the home page instead of latest posts
- Settings / Permalinks / Post name option
- Settings / Discussion options can be turned off if needed
- Install a theme: I recommend GeneratePress (this site uses GeneratePress too) / Astra or Hello Elementor.
- Install these plugins:
- Do the settings as we go along the video
- Add the Maintenance page with Elementor
- With Elementor Pro, go with the package that suits you personally.
- Install Elementor Pro
Global setting and SMTP setup
Follow the lesson on how to set up your global settings with the help of the main style page. Alternatively you can download and use the other available style kits (Links above this text)
SMTP will be needed to make sure our emails arrive to the right place instead of SPAM 🙂
If you need help with these details make sure to use the support of your hosting provider if needed!
Backup options and a “ready to use” copy
To create a backup, most hosting providers provide some form of option for this. You should do a regular backup and if you need help for different control panels, reach out to your hosting provider or use their documentations if available.
Also, while talking about backups, we can use Duplicator to create an “offline” backup too, that is easy to use for recovery of our website, but for moving it as well.
Importing the main templates and pages
- Start with importing the templates of your choice (Link above to the free templates)
- If you need help make sure to check the lesson about importing Elementor templates in the Elementor course HERE
- Add the new pages where we will be able to add the templates it self to
Header, Footer and Navigation
From this point on we will need Elementor Pro to quickly and easily edit the different theme parts of our website. As a business owner who made a good amount of websites, I see these relatively small yearly expenses ($49/year for Elementor Pro for single website or $99/year for 3) as an investment to save time and hair before we stress out too much 🙂
- Create a menu with the pages we have added previously
- Use the Elementor theme builder to add a new header
- Choose a ready made block or start with a fresh edit:
- Add a 2 column section
- Set full width for the section
- Add a minimum height of 75px (this will change if needed, depending on your requirements)
- Vertical alignment or content position to middle
- Add a logo widget or an image and set the link to site URL
- Set the size of the logo
- Add a navigation widget to the second column
- Style it as you like
- Set the Elementor display conditions (Click for that lesson)
- Use the Elementor theme builder to add a new footer
- Choose a ready made block or start with a fresh edit
Building our home page and a subscription form
In this lesson we will create a Home page and learn about different editing options
- Go to pages and edit the Home page we created before, click on the Edit with Elementor button if this is the first time
- Click on the Folder icon to add our Home template
- In page settings (bottom left corner) set the page template to Elementor Full Width
- Learn the different techniques to achieve your own design in the end
HTML code for the Acceptance field:
I accept the <a href=”https://yourdomain.com/privacypage target=”_blank”> Privacy Policy</a>
Building the About and Contact Us pages
- Link to Elementor
- Link to templates
- Link to extra style kits
- Link to Fluent Forms
- Link to Katka Template Pack
The mentioned bonus lesson on “How to create a custom email confirmation with Elementor Pro” just click HERE.
Privacy and Cookies Policy with some help
Creating a privacy and cookie policy can be a pain, but there is a great tool to help you with that. I am personally using Iubenda to do all the hard work and would recommend you use it too if you do not have a policy ready to get started.
SEO plugins and settings
- Link to SEOPress
- Link to SEOPress Documentation page as an example
- Link to Katka Template kits
- Link to Facebook debug tool
For your SEO goals a WordPress SEO plugin can help a lot. Not in the results it self, but to make sure that the technical part is met and provided for your while editing. Regular options are SEOPress, Rank Math, Yoast SEO, but if you just need something lean go with The SEO Framework.
Website analytics, something more private…
Google Analytics is great, but I personally think that our visitors data should be kept for the website owner and not used for anything else.
Piwik or now Matomo is an old alternative that is available as a WordPress analytics plugin that will keep your data with you! And it is completely free 🙂
Security
Finishing touches we need to do before going live!
- Link to ManageWP
- Link to Katka Template Pack
- Link to my YouTube channel
- Link to the course feedback form
Final steps we need to do:
- Make sure to have everything in place you learned so far
- Go to settings / reading option
- uncheck the discouragement of bots
- Go to Elementor / Tools / Maintenance
- Choose Disabled and save changes to take your website publicly available to everyone
- Let me know in the Feedback form what you think about this course, anything I should add, etc: Click here