You have just finished a one-click installation of WordPress for your Site. What next?
This post presents a step-by-step guide for making a website or blog from scratch using WordPress. It is suitable for beginners who have limited or no technical background.
WordPress is one of the simplest & most powerful free tools for website creation. You can make professional website, blogs & e-commerce stores with little or no technical background using WordPress. The sites made from WordPress look equally clean on Desktops, Mobile & Tablets.
This article will teach you to make a professional website or blog using the visual block editor (called Gutenberg editor) on WordPress which makes the process very convenient. From 2020 onwards, all new & updated versions of WordPress come with Gutenberg block editor as the default option and it is absolutely free of cost.
- 101: Logging into your WordPress Dashboard area
- 102: Understanding the WordPress Dashboard
- 103: Selecting a WordPress theme
- 104: Customizing your theme: APPEARANCES
- 105: Adding Pages, Posts & Media
- 106: Creating content – Pages & Posts creation
- 107: Defining Post Categories & Tags
- 108: Creating a Website Menu
- 109: Recommended Free WP Plugins
101: Logging into your WordPress Dashboard area
Set up id, password from your hosting account & log in to your WordPress dashboard. The link to access your WordPress dashboard would be: (wherein www.example.com is your site name)
Enter your id & password in the wordpress panel
102: Understanding the WordPress Dashboard
The top section is the Toolbar, left section is the Menu while the light color section which covers the most area is the Dashboard Screen
The Dashboard Screen displays some default widgets which give you information on your site like displaying number of pages & posts on your site, recent comments and activity on your site, ability to ‘quick draft’ a blog article from dashboard, etc. It is pretty much self-explanatory once you start working on WordPress regularly.
The top section that is Toolbar consists of your website homepage link, shortcut to create New page / post or product in single click, & other such easy to access buttons.
The left Menu section is the most important to begin making your site. It allows adding & editing pages, posting blog articles, changing themes, installing & setting up plugins, setting up Menu, Header, Footers, uploading photos & videos, etc.
103: Selecting a WordPress theme
WordPress provides you with several Free Themes that are highly customizable and adaptable according to your website. You can customize the themes with colors, styles, plugins, widgets – however you like.
To select a theme, on your left section i.e. Menu, hover mouse over “Appearances” & click on “Themes”. Here you will be able to see a few free pre-installed themes which you may select for your Website or Blog. You may also browse more Themes & add them to your collection by clicking the “Add New” button. Now select the theme for your website, activate it & start working.
For Starters, the we recommend the following FREE wordpress themes, which you may search and download from your dashboard theme section as stated above:
- WP Twenty Twenty
- Ocean WP
104: Customizing your theme: APPEARANCES
Once you are done selecting your theme, you are redirected to “Customize theme” page. If you are not, you can go to the Customization page by hovering your mouse over “Appearances” in the left Menu and selecting “Customize”.
Here you can go onto various sections that modify and personalize your core theme. For example in “Site Identity” you can add your website logo. Remember to have right-sized logo – usually it is mentioned under the upload button. In the example image shown here, the size is 512*512px. For PC users, I recommend using ‘Irfanview’ which is free software. (The latest Windows/ Mac may have the image resize & set quality option inbuilt.) Once installed on your PC, You can open an image from Irfanview, go to Image à Resize/Resample, put in the desired size & save it.
“Widget” area lets you add customized info (widgets) such as your Latest Posts, site logo, search tool, gallery, your instagram feeds, etc. One or more of these widgets can be added & their placement can be customised on:
Note: some modern themes (like WP twenty twenty) do not have a sidebar and hence that option is not shown. It is in fact better as it’s more mobile-optimized and readable.
“Menu” option only lets you customize the placement of Menu items on your site. We have discussed how to create custom menu later in this article.
Feel free to go to other options & change the colors, header footer color, background image, placement of site menu, widgets on your header/ footer/ sidebar, etc. It is pretty much self-explanatory & changes are displayed as you make. With basic trial & error, you can get the perfect look for your site.
105: Adding Pages, Posts & Media
You can hover onto the “Pages”, “Posts”, “Media” from the left menu of your WordPress dashboard and start creating Pages, creating Posts and uploading Media respectively.
We will cover creating content and adding “Pages” and “Posts” in our next section – Creating Content.
In “Media” you can upload images, videos and documents to your hosting space for use in your content later. We recommend uploading optimized media of the right quality, height & width (resolution) for efficient website. For example, if you decide to upload an image or video, you can downsize the same to required resolution and compress it to reduce load times significantly. There are various tools and plugins to re-size, compress photos and videos which are for a later discussion or you can discover on your own.
Note that, you do not need to upload media before-hand from the menu, the same can be done at time of creating content using other ways.
106: Creating content – Pages & Posts creation
You can add Pages, Posts through your dashboard menu. Once you select “Add Page” or “Add/ Create Post”, you are shown a blank canvas for you to start making your creation. Note that this ‘blank canvas’ lies in between your header and footer of your website. So the content which you will make, will reside between the header and footer as defined by your Theme Appearances (discussed earlier).
Before you start, you must make sure that you are using the latest version of WordPress. All the latest WordPress versions (starting from 2020) use the “Gutenberg” block editor as default for creating content. To put it simply, it is a “visual editor” where you do not need any coding language and even a beginner can create powerful pages or posts using this tool.
Imagine your website made up of BLOCKS. In the block editor, you have the power to assign how you want to layout these blocks and what you want inside your blocks. Whether you want an image or slideshow or just a bunch of text in your blocks, you can have it your way and create a powerful site using this simple concept of blocks.
A block can be made using the “+” icon shown by the red arrows in the image above. Once the block is made, it can be moved or re-arranged by dragging too.
The “+” icon presents you a range of options to use in your block. As shown above, you can put a whole lot of content like heading, paragraph, image, slideshow, Instagram feed, button, tables, contact/ newsletter forms, social buttons, Gifs, videos, etc in your block. Moreover, plugins discussed later in this post further enhance the options available for your block.
As shown in image above, we have created two main blocks as an example. Block 1 is a ‘column block’ of size 2 (in this case equal width, you can have more columns). Each column in Block 1 further has options to put blocks 1-A and 1-B. Block 2 consists of a single image.
Once a block has been added, there is a menu on the right side which you can use to customize various attributes of your block – like block alignment (left/ right/ center), size, fonts, colors, borders, styles, etc. depending on block you have selected.
You can make a professional website yourself without an expert help using the powerful & free Gutenberg Block editor which is free and default option on all latest WordPress versions in 2020 and beyond. So go ahead, start making some Posts & Pages today!
107: Defining Post Categories & Tags
You can define one or more categories for your posts. Categories help to organize, assign hierarchy to your posts and display those with same category has one wherever required. You can create categories you want in “Categories” section of your “Posts” menu. You can assign Parent category and create a hierarchy like flow for your content. You can even select multiple categories for the same post.
You will begin to see benefits of categorization yourself once your content grows. All popular blogs categorize their posts for better accessibility and structure.
108: Creating a Website Menu
A website menu typically consists buttons for your website pages on header, footer and other defined areas. Common menu items are Home, About Us, Latest Posts, Contact Us, Products, etc.
In WordPress you can assign same or different Menus for your different site sections. A Menu is created in the “Appearances” tab on the left WordPress dashboard menu (“Menus”). There you can select the pages you want to appear on the particular Menu and drag them, organize & reorder them. You can also create sub-pages to a menu page by dragging those pages inside the parent page. Once you are done, you can name your Menu and save the changes.
The Menu can be assigned in “Customize” section of “Appearances”. We have discussed this above. In “Customize” go to Menu where you can assign Menu which you have created to available sections of your website.
109: Recommended Free WP Plugins
Plugins to extend use of Gutenberg Block editor: Kadence, CoBlocks, Advanced Gutenberg, etc
Plugin for contact form: WPForms
Plugins for Analytics: Google Sitekit, Monster Insights
Plugins for optimization of media:
SEO Plugin: Yoast SEO