If you are planning to make your website it may seem overwhelming at first, especially if you are not familiar with coding.
But actually it is not that difficult these days.
In this free guide you will learn how to make a website from scratch step by step even if you don’t have any coding knowledge.
If you follow the steps outlined here I can promise you by the end of this guide you will have your first working website.
But if you do get stuck at any point just give me a nod here will be happy to help you out.
So are you ready for the ride? Let’s do this together…..
Chapter 1: Save your money and time by choosing the correct platform
Before getting started you need to choose the platform for your website.
You have two options
1. Custom development: Custom development is where you have to use Html, Css and Php or any other server-side scripting language to build a website.
- You have no limitation in terms of design and feature only limited by your or developers skill.
- You can use some frameworks like Bootstrap or Foundation to speed up the work flow.
- There are some free and paid templates to get started.
- You have to learn html, css, php or any other server-side scripting language which can take months.
- You need to learn entire web cycle including web security to keep your site safe from hackers which is not an easy thing to grasp at first place.
- If you are looking to build a simple site with an admin backend it will generally cost you more time and money than a CMS platform would.
2. Content management system (CMS): CMS or Content management system is a platform for managing your website and content without any coding like Html or Css.
- You don’t need to learn any coding to maintain your website.
- Most of the CMS are FREE to use.
- The content updating is very simple like copy paste work in MS Word.
- Most CMS have some free themes but if you want you can use premium themes which comes with some additional features.
- A simple website or blog would cost you far less money and time than a custom development.
- Most CMS like for example WordPress has a huge community where you can get help for free.
- In general a CMS platform is much more secure than a custom developed site.
- Most CMS will have some additional plugins free and paid which will speed up the development process.
- Depending on the CMS platform you choose it may have some limitation in terms of design and features.
So it is advisable that you choose a CMS platform specially if you don’t have any development knowledge.
Which CMS is right for you?
When it comes to CMS’s you have a wide range of choices but based on recent stats there are three major players in this field
- WordPress (48%)
- Drupal (5%)
- Joomla (3%)
As you can see wordpress almost acquires half of the entire market share of the CMS and it is for a reason-
It is free: WordPress is free, you can download and install it as many time as you wish it won’t cost you anything, in addition you will get free updates from time to time which is very important from websites security perspective.
User friendly: WordPress is very user-friendly even a first time user can understand the workflow very quickly. It has a very intuitive backend where you can easily update your content even without any coding knowledge.
Highly customizable: WordPress is highly customizable and extremely flexible, almost any type of website can be built with wordpress.
Active community: One of the biggest reason why wordpress is so popular because of its huge active community which you may not get in any other CMS platform. There are many websites and forums where you can get answer to almost any question related to wordpress.
Suitable to almost all: From a small website to a large one wordpress is suitable for all, if you are wondering how big it can be then check these famous sites using wordpress.
It’s an open source platform like wordpress and is free too but its far more complex than wordpress and not suitable for beginners. Drupal is generally more secure platform than wordpress and used by big companies for making complex websites to handling large traffic.
But since the framework is far too complex, it’s not advisable for non technical users.
It’s not as complex as Drupal but not as simple as WordPress either. Joomla holds a major share of CMS market among top 1 million sites. Joomla too is an open source CMS and free to use.
Suitable for complex site: Joomla is suitable for making complex websites with complex navigation structure. For making community or membership based site you can choose joomla.
Making unique design: With joomla templates you can make each and every page of your site different, it’s an out of the box feature of joomla.
Multilingual: If you want your site to be available in multiple languages then joomla can do that for you by default. Where as in drupal and wordpress you need some additional modules or plugins to make them multilingual.
Support: Joomla too has an active community where you can ask for any help.
But having said that joomla structure is still very complex for a new user, it will take some time to understand and properly use this platform.
For someone just starting out and looking to make a simple website joomla and drupal are not for them.
So I highly recommend you to choose wordpress as your CMS platform because of what it offers with so much simplicity compared to other platforms.
Chapter 2: Give your website a name and a place with domain and hosting so everyone can recognize you
Now you have chosen your CMS platform whether it is wordpress, joomla, drupal or any other, you need to have a domain name and hosting server.
Domain name: Is the name or address of your website, this is the name people will know your website with (like: www.YourWebsite.com)
Web Hosting: Your hosting space is like your websites home in the internet where all the files are stored.
There are three types of hosting
But in reality it’s not the best option if you are serious about your website, because the name you will get from these free hostings will in sub-domain like www.YourWebsite.wordpress.com which is not good for your branding.
Beside that most free hosting company will provide you few pre-designed templates at most with major limitations in design and features.
Most importantly you can’t have any backup of your site in case you want to shift to a another hosting provider.
So if you are planning to start with free hosting and then switch to paid later then it’s a bad investment in terms of time and effort for your website.
Shared Hosting: It is a type of hosting service where many websites are hosted in one server so a hosting company can distribute the overall cost of a server among many customers. Thus they can provide hosting service at an affordable price to an individual customer.
It is perfect for someone just starting a new website, it can cost you around $4-$12/month to get a good hosting service provider. It’s an investment you should make for your website.
Managed Hosting: In managed hosting you get a dedicated server on lease and the hosting provider looks after your website for speed, backups, security etc so you don’t have to worry about these.
Since the hosting company will managing your website on your behalf the costs are much higher than shared hosting. Generally managed hosting are available for CMS platforms like WordPress, Joomla, Drupal etc.
So I would suggest you to start with shared hosting and once your websites starts growing then you can look for managed hosting.
How do you get a domain name and hosting
When I was searching for a hosting provider for DesignTheWay and found that SiteGround.com is recommended by wordpress itself (since my site is in wordpress), I thought they better be good to be recommended there and to be honest I’m not disappointed.
Here is my personal experience with SiteGround
- 100% uptime for my site
- Great customer support and prompt action
- Good technical support
What they offer is a reliable and high-speed hosting at an affordable price starting at $3.95/month (with 60% discount).
They provide 1-click-installation for WordPress, Joomla and Drupal so you don’t have to get into any technical aspect of installation.
24/7 support to address any issue.
Most importantly they will activate your account instantly so you can start working on your site immediately.
What type of domain name is good for you
The domain name you choose will be the identity of your website so you need to choose it carefully.
A simple rule of thumb is-
If you are making a personal website then choose something like www.YourName.com and
If you are making a business web site then choose it like www.YourBusinessName.com
There is a whole list of domain names extensions you can choose from but you shouldn’t go too crazy about choosing one, you better of sticking with .com, .net, .org because they are more recognizable to people.
Few more additional things to remember while choosing the name-
Keep it simple– Keep the name easy and simple to remember so a visitor can remember your domain name, try to avoid using “hyphen –” in the name because a visitor can easily forget to put the “–” in the url.
Brandable– Try to use a name which you can use as a brand.
Now I’ll show you how to purchase a domain and hosting.
Disclosure: Some of the links here are referral/affiliate links that means if you decide to buy through those links I’ll earn a commission at no extra cost to you. This is how I keep Designtheway.com up and running.
Assuming that you have chosen SiteGround as your hosting service provider, let’s go to siteground.com and click on the SIGN UP button.
That will take you to pricing page where you have to choose a plan.
I personally advise to start with Start Up plan and as your site grows you can change the plan accordingly, however you can choose the plan which suites your requirement best and click on the ORDER NOW button.
Now you will be asked to choose your new domain name but if you already have a domain registered with other company you can transfer it for FREE.
Choose your domain name and click on PROCEED button.
It will take you to the order page where you have to fill in your personal information like name, email etc and payment details (credit or debit card).
Check your final order details and click on PAY NOW button. You will get a payment confirmation and hosting details on your registered email.
That’s it you have just booked your new domain and hosting.
Chapter 3: Build your website
Once you have your domain and hosting setup it’s time to build your website. As we have discussed earlier we will work on a CMS platform and show you how you can make your website.
I will show you three CMS platforms WordPress, Joomla and Drupal.
We have got lot to cover so let’s get started…..
Content management system (CMS)
Make a website in WordPress
As I have said earlier wordpress is the ideal platform for a beginner to make his/her first website. I’ll show you everything needed to publish your first wordpress website.
So let’s do it…..
I will be using SiteGround cPanel for these demo’s but you can use any other hosting company so interface may differ but look for the sections mentioned here and you will be good to go.
If you have signed up for the WordPress Hosting then on first login to your hosting account you will see a popup asking if you want wordpress pre-installed? select the option and click on PROCEED then follow the steps, you will have wordpress installed in your account.
But if you have signed up for normal hosting then follow the steps
- Log in to your hosting account
- Go to My Accounts tab and click on Go to cPanel
- Look for WordPress Installer icon and click on it
- It will take you to softaculous interface, click on Install there
- If you want to install wordpress in the main domain leave the directory field blank but if you want it in any subfolder like “blog” just add the folder name there.
- Don’t forget to copy the admin details as you will need that for your wordpress admin login (you can change the username and password if you want but keep the password strong)
- Click on Install and you are done.
If your hosting company doesn’t provide 1-click-installation then you have to manually install wordpress.
Here are the steps to follow-
Download the latest version of wordpress from https://wordpress.org/download/
Unzip the folder on your local drive.
In the wordpress folder find the file named wp-config-sample.php and rename it to wp-config.php
Now open the wp-config.php file in an html editing software (Notepad ++, Sublime text etc) and do the following
- define(‘DB_NAME’, ‘database_name_here’); – Your database name (ask your hosting provider for this)
- define(‘DB_USER’, ‘username_here’); – Your hosting username (ask your hosting provider for this)
- define(‘DB_PASSWORD’, ‘password_here’); – Your hosting password (ask your hosting provider for this)
Once the changes are done save the file.
Log in to your hosting ftp account using a ftp client, I use filezilla. Normally your ftp details will be like- ftp.YourWebsite.com, username and password are the same that you have registered with your host.
Delete any file named “index” and then drag and drop all the file inside from your WordPress folder to your ftp server.
Once all the files are uploaded then go to the url: YourWebsite.com/wp-admin/install.php and you should see a page like this
Fill in the details and then click Install WordPress.
That’s it you are done!
Choose a theme to make your dream website
Now you have wordpress installed in your server it’s time make it look beautiful, you probably have a default wordpress theme installed like this
but you want it to look unique, right?
Then let’s make it….
Go to your wordpress dashboard by typing www.YourWebsite.com/wp-admin or YourWebsite.com/wp-admin
Login with your username and password that you provided at the time of wordpress installation.
Once logged in, this is how your dashboard will look
Now in the dashboard go to Appearance > Themes and then click on Add New.
Here you can access thousands of themes for free. Go to the search bar and type a specific keywords to search themes.
Say you are looking to make a portfolio site
Type “portfolio” in the search bar and it will display themes suited for portfolio sites.
Hover on the theme you like and click on Details & Preview button to preview the theme, you will get a basic feel of that theme.
If you like what you see then click on the Install button on left top.
This will install the theme on your server once its installed then click on Activate.
Now the theme of your choice is activated.
Free themes are good and you should test them first but if you want more professional themes then you can buy from marketplaces like Theme Forest, Elegant Themes where you will get 100’s of high quality premium themes.
The price of premium themes are generally not too high but they are loaded with features and theme support. So if you have the initial budget you can go for premium themes as it would save a lot of development time.
Install a theme manually
If you have purchased a premium theme or downloaded a free theme from some other place than wordpress.org theme library then you have to manually install that theme.
To install a wordpress theme manually follow the steps
Go to Appearance > Themes and click on Add New.
It will take you to themes page then click on Upload Theme button at the top.
A new section will open then click on Browse button to choose your theme from local drive then click on Install Now button.
Once the theme is uploaded successfully you will see a success screen like this
Click on Activate and you’re done.
Pat yourself on the back. You have just manually installed a wordpress theme.
Adding content to your site
Now you have your theme installed its time to add some content to your site. You can add content to a wordpress site through pages and post.
To create a page look for Pages at the sidebar of your dashboard then
- Pages > Add New
- It will take you to a new page where you need to add a title and content (including image and text).
- Once you are happy with your content then click on the Publish button.
If you are looking to make a blog you need to create posts. Creating a post is similar to creating a page.
- Posts > Add New
- Just add a title and content then click Publish.
While you create posts you can organize your posts by keeping them in different categories. Like for example all post related to wordpress you can keep them in wordpress category.
Now let’s see how to create a new category
- Posts > Categories
- It will take you categories page where you can create and edit categories.
- Go to Add New Category section, add a name and click on Add New Category button.
Assign a category to a post
You can assign a category to a post while creating or editing a post. Look for Categories section it will display all available categories, just check the categories you want to assign.
You can create a new category from this section too.
Once done then click on Publish or Update to save the changes.
Adding a featured image
A featured image in wordpress is an image that represents a post in a way that a viewer can get a brief idea of what the post is about.
Every post can have a featured image, to set a featured image while creating or editing a post look for Featured Image block on the right column.
Click on Set featured image and choose your image.
Editing content of your site
If you want to make changes to your content, you can do that very easily in wordpress. To edit a page or post in wordpress the steps are very similar
- Go to Pages > All Pages or Posts > All Posts for pages and posts respectively.
- Hover on to the item you want to edit and click on Edit.
- It will take you to edit page, edit the content and click on Update button.
A much simpler option is if you are logged in to your dashboard just go the page or post you want to edit from the front end and look for Edit Page or Edit Post respectively at the top of admin bar and click on it.
Creating and adding menu
Once you have created the pages or post categories you want to add important items to main menu so your visitor can access those pages easily.
Creating a menu in wordpress is very simple.
- Appearance > Menus
- Add a menu name and click on Create Menu button.
- Look at the left panel, you can add any items from there, say you want to add pages click on Pages it will display all pages. Check the pages you want to add and click on Add to Menu.
- You can drag and drop to rearrange the menu, in similar way you can create a submenu is well.
- Once you are happy with your menu choose the menu display location from Menu Settings then click on Save Menu.
More tweak and customization…..
Change your site name and tagline
Your site name and tagline is very important for your site as it tells search engines what your site is about. So choose it wisely.
You get the option to select your site name and tagline while installing wordpress, in case you want to change it or didn’t add it while installing then go to Settings > General
Once done save the changes.
Enable disable comments
WordPress has a wonderful commenting system built-in so you don’t need any extra plugin for this, that helps visitors to comment on your site easily.
By default commenting is enabled for posts and disabled for pages, but for some reason if you want to disable comments on a post or visa versa for a page then go to the edit page of that post or page.
Click on Screen Options at the top right and check on Discussion if unchecked.
Now scroll down the page where you will see Allow comments check it on or off to enable or disable comments.
Set a custom front page
WordPress by default shows latest post in the home page but you may not want to show latest post in the home page always.
You might want to set a landing page as your home page to collect emails or you want to show your products or services there, whatever be the reason you can set any page as front page in wordpress.
Go to Settings > Reading
In Front page displays section check A static page and select a page from Front Page dropdown and click on Save Changes button.
You can choose any other page to display the latest post from the Posts page dropdown but this is optional.
Now you can check the home page it will display your selected page.
Editing the sidebar
All themes generally have sidebars, be it left or right and some may have both sidebars. Sidebar is the section where some wordpress widgets are displayed.
To add or remove widgets from the sidebar go to Appearance > Widgets
Here you can see all the sections where you can add widgets, you can drag and drop any element from left side to any of the widget area.
To delete open the widget by clicking on it and click Delete.
Add a logo to your wordpress site
Now with all the content ready on your site you need to add a logo for personal branding. Adding a logo in wordpress is very straightforward
Go to Appearance > Customize
Click on Site Identity
Click Select logo to upload your logo. Once done click on Save & Publish button.
Now you should see your logo in place of your site name.
Make your wordpress url more SEO friendly
For posts wordpress by default sets the url like this “YourWebsite.com/yy/mm/dd/post-slug” but this is not so seo friendly url means your posts may not rank well in search engines.
A good seo friendly url will be like this “YourWebsite.com/post-slug“, to change the url structure
Go to Settings > Permalinks and choose Post-name option and click on Save Changes.
Now you will see your post url is much more simple.
Create your wordpress profile
Since everything is ready now you can create your personal profile in wordpress with your picture.
Go to Users > Your Profile and scroll down to
About Yourself section
Here you can add a small bio and picture of yourself.
To add a picture you need have an account with wordpress.com then you can sign in to gravatar account. From there upload or change your image.
Get things done quickly by using plugins in wordpress
Now if you want to add some additional features beyond basic wordpress features then you can use wordpress plugins.
What is a wordpress plugin?
WordPress plugins are a bunch of pre-defined functions put together to do a certain task in wordpress, these can add or extend wordpress functionality.
Plugins are great as they can perform complex tasks without you having to make it from scratch.
There are thousands of free plugins available in the wordpress plugin library, you can find plugins for almost anything for free but for complex tasks you may have to look for premium plugins.
You can try codecanyon it’s a market place for high quality premium plugins.
How to install plugins?
Installing a plugin is very similar to installing a wordpress theme with just a few minor tweaks here and there.
Go to Plugins > Add New
Put your keyword in the search bar to search through plugins
Once you find the required plugin check the Last Updated status it is important for your sites security.
Once done click on Install Now
Once installed click on Activate button and your plugins is installed.
Install plugin manually
If you have downloaded a free or premium plugin from some other place then you have to manually install that plugin. The process is similar to manually installing a theme.
Go to Plugins > Add New
Click on Upload Plugin button at the top.
A new section will open then click on Browse button to choose your plugin from local drive.
Then click on Install Now button.
Once the installation is finished click on Activate Plugin.
Bravo! you have just manually installed a wordpress plugin.
There are thousands of plugins you can try but to make things easy for you I have curated a list of most essential wordpress plugins for a website.
Congratulations! you have just created your first wordpress website
If you have followed the steps properly, you should have a working wordpress website now.
It wasn’t too tough was it?
But we have just scratched the surface here, there are whole lot of things you can do with wordpress.
So keep learning.
With this we have come to the end of- making a website in wordpress guide, you can leave the guide here if you wish.
But if you are interested in learning other cms platforms then keep reading…..
Make a website in joomla
As I have said earlier joomla is used for making complex sites and suitable for membership or community sites.
Joomla as a cms is much more complex than wordpress and hard to get around for basic users. But we will look at few basic things here so you can get started with joomla.
Like wordpress guide I will use SiteGround cpanel 1-click-install feature to install joomla.
Let’s do it…..
You have the option to choose Joomla Hosting that will make joomla installation even easier.
On your first login to your hosting account a popup will ask if you want joomla pre-installed? select the option and click on PROCEED then follow the steps, you will have joomla installed in your account.
It’s that simple.
But if you have signed up for normal hosting then follow the steps
- Log in to your hosting account
- Go to My Accounts tab and click on Go to cPanel
- Look for Joomla Installer icon and click on it
- It will take you to softaculous interface and click Install
- If you want to install joomla in the main domain leave the directory field blank but if you want it in any subfolder then just add the folder name there.
- Check the admin details like username, password and email properly. Don’t forget to add a correct email id as it will be required to reset the password when required. Once done click on Install. That’s it!
You have successfully installed joomla on your server.
Manually install Joomla
For some reason if you want to install joomla manually then
Here are the steps to follow-
Get the latest version of joomla from https://downloads.joomla.org/
Extract the zip on your local drive (ideally in a folder )
Log in to your hosting ftp account using a ftp client.
Delete any file named “index” and then drag and drop all the files from your extracted folder to your ftp server.
Now go to your website url: YourWebsite.com you will see joomla configuration window.
Fill in the basic details like site name, description, email, username, password etc and click Next.
Now you will see Database configuration page here you need to add
Database type (ask your host what type of database they support)
Database username, password and database name. If you don’t have these details then ask your host for the same.
Once done then click Next.
You will be taken to Overview page, here you can choose if you want to install any sample data or not, it is advisable to choose Default sample data. Remember you can delete all these sample data anytime you want.
Scroll down the page it will show pre-installation checks, make sure there is no error.
Then click Install.
Once the installation is over you will see a congratulation window, now you need to remove the installation folder sounds bit odd but that’s how joomla works.
Click on Remove installation folder.
That’s it! you have successfully installed joomla.
Installing a template
Much like wordpress themes we have templates in joomla which will decide how your website will look.
You can find free templates for joomla too but unlike wordpress joomla doesn’t have its own templates library you need to find by searching yourself.
If you want more professional templates then you can look for premium templates in ThemeForest.
Now to install a template follow the steps
Download the template on your local drive.
Log in to your admin panel by typing YourWebsite.com/administrator.
Once logged in. go to Extensions > Manage > Install from the top menu.
Now just drag and drop your template zip folder here. Once the template is uploaded you will see a success message.
Now go to Extensions > Templates > Styles
Here you will see the list of templates and click on the “star” icon to choose a template.
With that you have installed a joomla template, give yourself a high-five!
Adding content by creating article page
You can add content to your site by creating article pages
Here is how
Go to Content > Articles > Add New Article from admin panel
You will see an interface like ms word where you can add your text and images, once you are happy with your content click on Save & Close button.
But your content won’t display in the website yet, for that follow along…..
Now go to Menus > Main Menu
By default you will have a “Home” menu and click on it.
It will take you to edit menu page, click on Select on Menu Item Type
A pop will appear, click on Articles and then Single Article
Save the menu and now you can see your page in the site.
Adding a menu in joomla
Now your content is ready need to add them to menu, but adding a menu in joomla is bit complex.
So follow along carefully
Go to Menus > Manage > Add New Menu
Add Title and Menu Type
Menu type is what type of menu it is like primary menu or footer menu etc.
Click on Save & Close button.
Once done then you will see all the menus including your new menu. You will see a button beside your menu Add a module for this menu click on it
You need to add module unless your menu will not be visible.
Now you will see add a module popup, here you can do a lot of things but two fields are most important Title and Position
Add a title and assign a position for your menu, remember available positions will depend on the template you are using.
Now click on Save & Close.
You still won’t see the menu in the front end yet, you need to add at least one menu item to your menu.
For that go to Menus > Your menu > Add New Menu Item
Add a Menu Title
and then on Menu Item Type click on Select
In pop click on Articles > Single Article
Now on to Select Article click on Select
A pop will open, choose the article you want to link with this menu item.
Then click on Save & Close
Well Done! now finally you can see your menu in the front end.
Adding logo in joomla template
Now you want to replace the default logo provided by the template with your own logo, to do that
Go to Extensions > Templates > Styles
Click on the template you are using
Now you will see template customization options look for Logo section and upload your logo. The panel options and look will differ from template to template.
Extend joomla even more by using extensions
Joomla has a lot of functionality built-in but you can add to that by using extensions. You can find many extension here extensions.joomla.org.
Installing an extension
Download the extension zip file.
Go to Extensions > Manage > Install
Simply drag and drop your extension zip here.
Activate the module and you are done.
Excellent! You have just created a basic joomla website
If you have followed the steps by now you should have a very basic working joomla website.
We have covered very basic things here, but hope this guide will help you get started with joomla.
So keep learning…..
Creating a website in drupal
Drupal is a very safe platform compared to other CMS that is why big companies choose drupal. But again like joomla drupal is a very complex cms perhaps even more than joomla, so not easy for beginners.
We will learn installation and few basic things to make a simple drupal website.
Like wordpress and joomla siteground hosting has one click installation for drupal too.
Follow the steps
- Log in to your hosting account
- Go to My Accounts tab and click on Go to cPanel
- Look for Softaculous and click on it
- Now on the left menu click on Portals/CMS > Drupal.
- Click on Install
- Choose the drupal version you want to install and leave directory blank if you want to install drupal in the main domain.
- Check the admin details like username, password and email properly. Change the site name to as you wish.
- Click on Install
Now you have installed drupal on your server.
Manually install Drupal
Though every good hosting company will provide one click installation but you should know manual installation process too as a backup.
Here are the steps
Get the latest and stable version of drupal from https://www.drupal.org/download
Extract the zip on your local drive
Log in to your hosting ftp account using a ftp client (filezilla).
Delete any file named “index” and then drag and drop all the files from your extracted folder to your ftp server.
Now go to your website url: YourWebsite.com you will see drupal installation window.
First choose the language, we will stick with English here and click on Save and continue.
Now to installation type, choose Standard and click on Save and continue.
Verify the requirements, make sure there is no error and click on Save and continue.
Now you need to set up database, choose the database type we will choose MySQL.
Fill in other details like database name, database username and database password, ask your host for the same.
Click Save and continue.
Now you will see an installation progress bar, once done a configuration window will open. Fill the profile and click on Save and continue and that’s it.
Cool! you have successfully installed drupal on your server.
Adding a modules in drupal
Before we start adding content or do anything else on this drupal website we will add a very useful module Admin Toolbar that will help you navigate the admin panel better.
Drupal admin panel menu can give you a hard time but this module will convert the menu in a dropdown menu and in the process we will learn how to add modules in drupal is well.
You can find thousands of modules in drupal’s module library.
First go to https://www.drupal.org/project/project_module
Search with a keyword, for this instance we will search with “admin toolbar”
Scroll down to find the module you are looking for and click on it to check which version of drupal it supports.
If it supports your drupal version then download it.
Now go to Extend and click on Install new module.
You can install a module via direct link or you can browse it from local drive.
Once selected then click on Install.
It will start to install once done it will show a success message then click on Enable newly added modules.
Now it will take you back to extend page, scroll down the page to find your module click the check box (for admin toolbar there will be two modules ) and scroll all the way down the page then click on Install.
Now your module is active and you admin panel has a beautiful dropdown menu.
Manually installing a module
Manually installing module in drupal is bit easier than through admin panel, just follow along
Log in to your hosting ftp account using a ftp client (filezilla) and navigate to your drupal installation
Look for modules folder and open it
Now drag and drop the downloaded module (after extracting) to your server.
Go to Extend from admin panel
Scroll down the page to find your module click the check box and scroll all the way down the page then click on Install.
Install a theme in drupal
Themes will make your development process faster. There are thousands of free themes to choose from drupal’s own library you should try them once but if you looking for premium themes you can try themeforest.
This how to install a drupal theme
Download the theme on your local drive.
Log in to your drupal admin panel YourWebsite.com/admin.
Go to Appearance > Install new theme
Now click on Browse and locate the downloaded theme from your local drive or you can upload theme by direct url, then click on Install.
Once the theme is uploaded a success message will appear, then click on Install newly added themes
Now you will see all available themes, look for your uploaded theme and click on Set as default.
And now your new theme is activated.
Setting and configuring home page
Now you theme is ready its time set up home page but first we need to create a page
Go to Content > Add content > Basic Page from top menu
Now you will see add content page with a WYSIWYG editor, add your content with title.
You can click Save and publish button here but to set this page as home page DON’T hit Save and publish yet.
Go to right panel and click on PROMOTION OPTIONS then check Promoted to front page
Now hit Save and publish button and you have just set your home page.
Creating other pages and url modification
For this you can repeat Step 1 and Step 2 from above mentioned steps once done if you hit Save and publish at this stage you see a url like this YourWebsite.com/node/2 but this type of url is not seo friendly.
To change the url
Go to right panel of add content or edit content page and click on URL PATH SETTINGS
add your custom url here ideally it should correspond to the page title like if it’s an About us page then you should add “/about” or “/about-us” then click on Save and publish.
And now your url should be like this YourWebsite.com/about.
Adding a menu in drupal
Once you have created the pages you want to add those pages to menu for easy navigation.
To create a menu in drupal follow the steps
Go to Structure > Menus > Add menu from top
Add a title and click Save.
Now you will see an Add link button click on it.
Add the Menu link title and Link then click Save.
Repeat this step for each menu item you want to add.
If you are editing Main navigation menu your menu should display in the front end now.
But if you are creating a new one then need to do few more things
Go to Structure > Block Layout
Click on Place Block
A pop up will open, scroll down to find your newly created menu and click on Place Block
Another pop up will appear, look for Region and choose a location from the dropdown. This will decide where your menu will appear in front end.
Click Save block and you are done.
Now you can see your new menu in the front end.
Add logo in drupal
Now your theme, content and menu is ready its time to add a logo.
Go to Appearance > Settings > Your theme
Now scroll down the page and look for LOGO IMAGE section, uncheck the checkbox you will see logo upload option. Upload the logo and click on Save configuration.
Great! Your basic drupal website is ready
If you have followed along you should have a working drupal website now. As you may have guessed it we have just touched the tip of the iceberg there is whole lot more to learn.
The purpose of this guide was to give you a basic idea of drupal. So keep exploring and learning.
But if you find all these CMS’s bit confusing and want a more simple solution then I have got good news for you.
Chapter 4: Build a website with website builders
If you don’t want to get into the hassle of domain, hosting, installation etc then website builders are perfect for you.
What is a website builder?
Website builders are an all in one solution to set up a website without any coding. They provide almost everything you need to create a website from hosting to design.
- Website builders are an all in one solution for a website.
- You don’t need any coding knowledge.
- They are hassle free you don’t have to worry about domain, hosting etc.
- They will have many templates to choose from.
- Website builders are not free you need to pay a monthly fee.
- Limited customization.
- All your files are hosted in their server so switching platforms are a problem.
When to choose website builder over CMS?
If you don’t have time to learn a cms or don’t want to get into the hassle of creating a website or need a small website quickly then choose website builders over a cms.
Choose the right website builder to avoid mess later
Website builders are a growing and popular trend in web industry now, so more and more companies are getting into this. You have many options when it comes to choosing a website builder but not all website builders are same in terms of features, service and support. So you need to choose them wisely.
Here in this guide I will show you features of thee of the most popular website builders going around today.
I won’t go into the details of how to use each one because these website builders are self-explanatory and easy enough for anyone to use. But if you get stuck at any point don’t hesitate to contact me.
Now let’s look at each one
Wix is probably the most popular website builder in the market. It is the go to website builder for many.
Let’s quickly look at the features
What do you get in Wix
Free version: Wix has a free version you can try that out, once you are happy with your site you can publish your site but it will be in a sub domain. To get your own domain you need to upgrade to premium version.
Price: Wix has different plans ranging between $4.50 – $24.50per month, it includes 14 day trial.
Free Templates: Wix has 100’s of templates most of them are free and can be a good starting point for your website.
Easy editing Interface: It has a very easy editing interface even a first time user can work around easily. You can simply drag and drop elements here it’s like working in an image editing software.
Easy customization: Wix has a lot of customization options virtually you can customize everything you see in template. Just click on an elements you will see options to edit that element.
Many built-in apps: You will find many built-in apps for SEO, Marketing etc, which will help in the progress of your website.
Good support: Wix has a huge knowledge base of articles and videos so if you ever get stuck you can check them. Wix has an active forum too where you can ask for help.
Final thoughts on Wix
The kind of flexibility you get at such a price is definitely worth trying especially for small websites (personal & business). Since you get to access to a lot of things in free version which should give you an idea if wix is right for you or not so go ahead and try out Wix you have nothing to lose .
Squarespace is another popular website builder that you can try. It is not as intuitive as wix but is very good and secure website builder.
What do you get in Squarespace
Free Trial: You get 14 day free trial to test out squarespace if you are not happy you can cancel the trial.
Price: The price is bit higher than wix it ranges between $8 – $18 per month (annually billed).
Free SSL: You get free SSL with any plan, generally a SSL certificate costs around $60 per year. You get it for free with squarespace subscription.
Free Templates: Squarespace has around 80+ templates, you get to access all even in trial version. All templates are beautiful and professionally designed.
No drag and drop: It has a very clean interface for editing but doesn’t offer any darg and drop feature like wix. First time users may find editing bit difficult because it has a bit of learning curve (simple).
Limited customization: One down side of squarespace is that it offers limited customization on templates. You just can’t make any design out of any template.
Not suited for all: Squarespace templates are generally image rich, you need to have lots of images to get the best out of a template so may not suit in all type of websites. Ideally suited for creative fields like photography, design etc.
24/7 support: You get 24/7 support on any plan which is good.
Final thoughts on Squarespace
As you can see it is not as flexible as some other website builders but if you want a portfolio site with lots of image squarespace can be a perfect fit for you.
Weebly is another option you can try, this one too is very simple and user friendly.
What do you get in Weebly
Free version: Weebly too offers a free subscription version where you can try out weebly to get the feel of things.
Price: Weebly price ranges between $8 -$25 per month (billed annually).
Free Templates: It has around 50+ free templates to choose from. Templates are decent in design.
Easy editing interface: Weebly also has a very easy to access drag and drop editor so new user can easily work around.
Easy customization: You can customize a template very easily just click on an element to see editing options.
Final thoughts on Weebly
I would suggest you to try out weebly for free first and see how it works for you, then decide if you want to stick with it or not.
Which web builder do I recommend ?
To be honest with you it depends on your requirement and I would suggest you try all three first hand (free version) and then decide. But if I have to pick one from the three I would go for Wix because of the flexibility it offers at a very competitive price.
So which one is better a CMS or a Web builder ?
This debate will always be there and it is one’s personal preference. Likewise mine is CMS (WordPress) being a front end developer I have never liked website builders over a cms wordpress in particular. I feel like bit restricted in website builders where as in wordpress I feel I’m in control and I could do anything with css, html, js etc.
That’s my point of view only not a general one. So if you are looking to make a website super quick and are on a tight budget you should go for website builders because CMS’s generally have a bit of learning curve and if you want to scale the website, there will be additional expenses on development.
But if you are serious about your website and its growth then defiantly go for a CMS preferably WordPress because it’s easy for beginners and you can scale your website easily.
Whether you have chosen a CMS or a website builder hope this guide has helped you in creating your first website. If you have any question or any problem in following this guide don’t hesitate to contact me.
If you find this guide useful please do share and leave your comments, that motivates me to keep producing useful contents.
He is a front end developer and an enthusiastic blogger. He loves playing with css and founder of www.designtheway.com