Search icon
How to Create a Website With Renderforest

How to Create a Website With Renderforest

13min read  

31 Jul 2019

Taking your business online is a huge step towards success. To go online, you need an awesome and professional website, or at least a landing page where you will have a chance to show what you have: your service or products.

Luckily for all non-coders, it’s now possible to create a website without any coding skills. You can use online website builders which can help you easily create your own professional website or landing page with beautifully designed, customizable, and responsive templates.

Renderforest offers an amazingly simple solution which takes website creation to a new level. In this tutorial, you can find all the instructions for using the website builder and its functionality.

 

 

 

  1. Customizable Templates and Components

 

So, how to get started? Go to Design Website from the navigation menu and click the “Create Website” button.

Website maker

Here you have 2 options: create your website from scratch or load a template.

website maker online

To create your website with the help of our ready-made templates, click “Load a Template”. There are 14 template categories, including but not limited to Business and Agency, Marketing, Personal and Portfolio, Music, Travel and Hospitality, Photography, Fashion and Beauty, with customizable templates ready to be used.

design website

If you want to create your website from scratch, click on “Add Component”. Choose from over 70 components (ready-made sections), which come with default texts and images. The components include headers, call-to-actions, simple text, testimonials, posts, sliders, videos, email forms, FAQs, contacts, footers, and more.

design website online

Select the component you like and click “Add”. Under each section, you can find a “+” button. Click it to add another component.

website templates

Customize each component by changing the texts, images, icons, buttons, and background color.

Click on a text section to type or paste your text. Note, that each text section has a limited number of characters. Please, write your texts within the character limits to keep the overall look and design.

customizable website templates

To customize the buttons, click on the edit button that appears when you hover on the button. Here, write your text, choose the link type from the dropdown menu and add the landing page or section.

customizable website components

At the upper right corner of each section, you can find the section settings. Here you can change the background color, replace the background image, move the section up or down, replace it, flip the orientation, or delete.

design website with components

To add an image or change the background image of a section, click on any image to open the popup with several options. You can add an image in 3 different ways: via image URL, choose an uploaded image from your Media Library, use stock images, or upload from your device.

build website with components

Media Library is your storage where you keep all your media files.

build website with customizable components

Click on “Use stock images” to find relevant images for your website. Search for specific keywords or terms, select an image and click “Insert”.

customize your website

Similarly, you can edit the sections with videos. Here you have 4 options: add via video URL, select an uploaded video from your Media Library, use a stock video, or upload from your device.

design website with Renderforest

If your component has icons that you need to change, click on the edit button that appears when you hover on the icon. Here you can search for icons, select a relevant one and save.

online website builder platform

Social follow icons are also fully customizable. Select a component containing them, remove the unnecessary icons, add the ones you need and edit to add your social profiles.

fully customizable website templates

To find a social icon, simply edit it and find the one you need from the “Social” section.

edit website template

 

  1. Website Style and Colors

 

The website components have their default text size and style that can be changed with one click. Go to the “Text” section from the left sidebar menu to select the text size and style of your choice.

change website  

In the “Style” section, you can select the style of your buttons, icons, and other shapes throughout the website. There are 3 options to choose from: rounded, cornered, and sharp.

website component style

To change the colors of your website, go to the “Color” section. Add your custom colors or choose one of the color palettes suggested by our professional designers.

website component colors

 

  1. How to Add a Page?

 

If your website is not a one-page website, you will need to add more pages. To create a new page, go to the “Pages” section from the same left sidebar menu and click on “New Page”. Then, write your page name, which is also used as the page URL, and click on “Create”.

create website page

Your page will be automatically added to the navigation menu. You can then manually edit the name or remove it by clicking on the menu item.

edit website navigation menu

Besides linking your internal pages, you can also link to external sites or landing pages. Click on “add link” and edit it by writing the page title, choosing the “External link” option from the dropdown menu and adding the link.

add external link to website navigation

You also have an option of linking your menu item to a specific section on the page. For example, if you want to link your “Contact Us” menu item to the “Contact Us” section on your homepage, click on “add link”, then write the name, select “to section” option from the dropdown menu and the section on a particular page. Please note, that this option is recommended for one-page websites.

one-page website section

 

  1. Edit the Settings of Your Website

 

In the “Settings” section, you can edit the general website settings and the settings of individual pages.

From the dropdown menu, select the page you want to edit. Add the page title, meta description, and the keywords.

edit website settings

Please note, that these features will be unlocked once you get a paid subscription.

edit website page settings

Click on “General” to start editing your website settings. Here, you can add a free or custom domain, upload your favicon and featured image for social, sync your company email, connect Google Analytics account and add Facebook pixel.

edit website general settings

Please note, that some settings will be unlocked once you get a paid subscription.

website general settings

Don’t forget to click the “Save” button once you update your settings.

 

  1. Preview and Publish

 

Preview your website during the editing process to see how it looks and make all the necessary changes to improve it. Click the “Preview” button at the top right corner of the editor.

preview website online

View your website on different devices: desktop, tablet, and mobile. Or, click “Preview in new tab”.

view website on different devices

Once your website is ready to go live, preview it to see whether everything works as expected. Then, click the “Publish” button.

publish website online

Congratulations! Your website is live!

Whenever you make changes on your website, don’t forget to save and publish them.

All your website projects are automatically saved on “My Websites” page which can be accessed from the top right dropdown menu. 

Very simple and intuitive, isn’t it? Renderforest website builder has all the tools to make your creation process effortless and fun. Once your website is ready, go ahead and publish it. You can publish your website for free or subscribe to our paid plan (monthly or annual).

Before you start designing your website, make sure to prepare wireframes for all your web pages. They will help you to easily find the desired components. Then, use our easy-to-use website builder to bring your ideas to life.

Are you ready to start?

Create My Website

User Avatar

Article by

Dive into our Forestblog of exclusive interviews, handy tutorials and interesting articles published every week!

Read all posts by Renderforest Staff
Related Articles
Close icon
Search icon