# Customize Website



# How to Edit Button

This Guide will Help you to edit Button Widget Settings and Style.

#### BUTTON WIDGET SETTINGS

When you **Drag and Drop** Button Widget in SitePad Website Builder Dashboard. You will see **Button Settings and Style** in Button Widget. Go to Button Settings. You will see the image like below. You can change the **Button Text** and **Button Link** and after that one checkbox is there, if you check this checkbox you can **open** that link in **another window**.

If you want to display **Icon** under the **Button** then click the Icon, Choose particular Icon from a list.

If you want the Button in **full width style** then check the checkbox of **Stretch**, and **Alignment** Settings gives you Button Alignment.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Button-settings.png)

#### LINK BUTTON TO THEME PAGES

To link you **Button** to existing theme page just click on three dots of Link section as shown in image below.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Link-page-click.png)  
   
Now in popup box click on **Arrow**.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Insert-link-popup.png)  
   
Select page which you want to link and in the end click on **Add Link**.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Select-page-to-link.png)

#### EDIT BUTTON ELEMENT STYLES AND PRESETS

If you want to change the **Button Custom Styles** like Background color, Text color etc. then click **Edit Element Style**.

For **Predefined styles** which comes in **widget** like Background color and Text color then you can click **Predefined Styles**.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Button-style.png)

#### BUTTON CUSTOM STYLE

Button Custom Styles gives you to change Button Background color, Text color, Padding, Border-radius etc. When all are set then click on **Apply** button.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Button-custom-style.png)

#### BUTTON PREDEFINED STYLE

Predefined style gives you **clasees** of various predefined button for Background and Text color. And Size gives you various types of **Button Size**.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Button-predefined.png)

# How to Download the Website

In this tutorial, we will show you How to **Download the Website**.

<p class="callout info">**Note:** By default **Download** option is disabled, if you want to use the Download option you will need to contact your web host to enable the **Allow Download Website** setting from SitePad admin panel. The download option is not available in SitePad Free plan.</p>

#### GO TO SITEPAD EDITOR

From your Control Panel click on **SitePad Website Builder**. You will be redirected to SitePad Editor Server.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Click_on_sitemush.png)  
   
Once you are redirected to the Editor Server you will see **Download** button in the top bar.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Download_button_enable.png)

#### DOWNLOAD ZIP FILE

Click on **Download Now** button to download the website files in ZIP package.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Download_zip_file.png)  
   
Once the ZIP file is downloaded, upload that file on your server in your web directory e.g. **public\_html/** and unzip that file in same directory. You can use the **File Manager** feature in your control panel to upload the file.

That’s it ! Your site should now be accessible when you access your domain name in the browser.

# Sites in multiple languages

This guide helps you how to make a site in **multiple languages**.

Make a full website with one language and clone that site so you have a full copy of your website and change the language strings with the other language string using the editor. For easily understanding, you can follow the below steps:<a name="1"></a>

#### CLONE FULL SITE

For cloning the website go to the Dashboard -&gt; Sites -&gt; Clone Site or you can also do by clicking of Dashboard -&gt; All Sites, click the button of cloning which sites you want to clone.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Clone-site.png)  
   
Select the **source site** which you want to clone from dropdown list. Enter **site name** which show in SitePad editor url, Select **domain name** and enter **site address** for your cloning site. This will be your site address for your cloned site after publish. And enter **Site Title**for the language which you want, after that click on **Clone** button for cloning the site.

After completing the cloning process it shows two links Visit Dashboard and Visit Site, click on **Visit Dashboard** link for editing the cloning site.<a name="2"></a>

#### EDIT ON CLONE SITE

   
![](https://dotroll.com/wp-content/uploads/2020/08/Language-text-change.png)  
   
After cloning, click on **Visit Dashboard** link for editing the cloning site. You will get exact copy of site with same style and properties, and make changes on cloned site of French language.<a name="3"></a>

#### ADD LINKS IN HEADER

   
![](https://dotroll.com/wp-content/uploads/2020/08/Header-language.png)  
   
Suppose you have a domain **www.example.com**, this domain point to your **English language** and make button link for English and French languages in the header of both the sites, on clicking of their button it redirects to their languages and **French domain** is like this **www.example.com/fr**<a name="4"></a>

#### PUBLISH BOTH SITES

When all changes are done then **publish** both the sites.

# Password Protect Pages

This documentation will guide you on How to Password Protect your pages.

<p class="callout info"><span class=".">**Note:** Password Protection is supported only for Apache web server.</span><a name="1"></a></p>

#### GO TO EDITOR

When on **SitePad Website Builder** Dashboard. Hover on **Pages** option given on the left sidebar and then click on **All Pages**. Once on all Pages Click on **Edit Icon** of Any Page.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Click_edit_contact.png)  
   
You will be redirected to Editor.

#### SELECT PASSWORD PROTECT

On **SitePad Editor** hover on more menu on the navigation bar. When you hover over more menu four buttons will be drop down **i.e** Reset Page, SEO Options, Custom HTML and Password Protect.

Click on **Password Protect**.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Select_password_protect.png)

#### PASSWORD PROTECT PAGES

On clicking **Password Protect** you will see a dialog box will appear. Click on **Enable Password Protection** checkbox. Insert **Username**, **Password** and **Title for Authentication**. Then select the option from **Protect Pages** i.e **All Pages** or **Selected Pages**.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Password_protect_options.png)

<div class="vc_row wpb_row vc_row-fluid" id="bkmrk-on-click-of%C2%A0enable-p"><div class="wpb_column vc_column_container vc_col-sm-12"><div class="vc_column-inner"><div class="wpb_wrapper"><div class="wpb_text_column wpb_content_element "><div class="wpb_wrapper">- On click of **Enable Password Protection** your password protection option will be enabled.
- Insert **Username** that you want. It will be asked when you Log-in to password-protected pages/site.
- Insert **Password** that you can remember. It will be asked when you Log-in to password-protected pages/site.
- Insert **Title for Authentication**. This will be shown on the Log-in a Dialog box.
- Select an option from **Protect Pages** i.e **All Pages** if you want to password protect the full site or if you want only **Selected Pages** then choose the given option.
- If **Selected Pages** option has been selected you will find **Select Pages** option through which you can select which page to password protect.

</div></div></div></div></div></div>Once you have made the changes then click on **Save** to save the Password Protect Pages Option.

<div class="vc_row wpb_row vc_row-fluid" id="bkmrk-note%3A%C2%A0you-will-need-"><div class="wpb_column vc_column_container vc_col-sm-12"><div class="vc_column-inner"><div class="wpb_wrapper"><div class="vc_message_box vc_message_box-standard vc_message_box-rounded vc_color-info vc_custom_1599131237099"><div class="vc_message_box-icon">  
</div><div class="ricsi exclamation"><span class=".">**Note:** You will need to Publish your site for all the changes to take place.</span><a name="4"></a></div></div></div></div></div></div>#### REMOVING PASSWORD PROTECTION

To Remove Password Protect Pages click on **Password Protect** option. Uncheck the **Enable Password Protection** checkbox. Click on **Save**.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Remove_password_protect.png)

<div class="kb-article-content" id="bkmrk-note%3A%C2%A0you-will-need--1"><div class="ricsi exclamation"><span class=".">**Note:** You will need to Publish your site for all the changes to take place.</span></div></div>

# How to Add Custom links in Menu

This guide will show you how to add custom links in Menu.

#### GO TO MENUS

First you will need to go to the **Menus** as shown in image below.

![](https://dotroll.com/wp-content/uploads/2020/08/Click_on_menus.png)

Now in menus page click on **Custom Links** and add url of your page and give name for that page. after that click on **Add to Menu** button as shown in image below.

![](https://dotroll.com/wp-content/uploads/2020/08/Custom-link-menu-img01.png)

After all things done please click on **Save Menu**. This will add your custom link into menu.

# How to Add Unique ID

This guide will show you how to add Unique ID.

### GO TO PAGE EDITOR

Go to the page editor and select the row where you want to add **unique id** as shown in below image. Then click on **settings** in dialog box and add id for that row in **Element unique Id** section.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Unique-id-img01.png)  
   
After adding unique id please update the page as shown in image below.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Unique-id-img02.png)

# How to Add Background to Section

This guide will help you to Add Background to Section.

There are two Different ways to do that.

#### USING ROW DIALOG BOX

1\) Open Page you want to edit in editor. To do that Click on Edit icon present next to page name as shown image below.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Click_edit_contact.png)  
   
2\) Once you open Page in Editor follow steps below

1. **Select Row** where you want to **Add Background** by Clicking on **Three Vertical Dots** as shown image below.
2. Step i will pop up the **Dialog Box** for that Row.
3. Now Click on **Settings** option in Dialog Box.
4. Now Select the **Type of Background** you want to give for that **Particular Row  
       
    ![](https://dotroll.com/wp-content/uploads/2020/08/Add-background.png)**

3\) When you select one of the Option for **Background** then it will need some inputs just Fill that as shown below.

##### FOR VIDEO BACKGROUND

##### ![](https://dotroll.com/wp-content/uploads/2020/08/Background-video.png)

##### FOR YOUTUBE VIDEO BACKGROUND

##### ![](https://dotroll.com/wp-content/uploads/2020/08/Background-youtube.png)

##### FOR PARALLAX IMAGE BACKGROUND

##### ![](https://dotroll.com/wp-content/uploads/2020/08/Background-parallax.png)

##### FOR IMAGE BACKGROUND

##### ![](https://dotroll.com/wp-content/uploads/2020/08/Background-image.png)

##### FOR IMAGE SLIDER BACKGROUND

#### ![](https://dotroll.com/wp-content/uploads/2020/08/Background-slider.png)

#### USING EDIT ELEMENT STYLE

1\) Once you open Page in Editor follow steps below

1. **Select Row** where you want to **Add Background** by Clicking on **Three Vertical Dots** as shown image below.
2. Step i will pop up the **Dialog Box** for that Row.
3. Now Click on **Style** option in Dialog Box.
4. Now Click on **Edit Element Style**.  
       
    ![](https://dotroll.com/wp-content/uploads/2020/08/Edit-element-background.png)

2\) Now in **Edit Element Style** select **Background Color** or **Background Type** you want as shown in image below.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Edit-element-background-color.png)

##### FOR IMAGE BACKGROUND

If you want Image Background then just click on Image and select Image you want as shown in image below.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Edit-element-background-image.png)

##### FOR GRADIENT BACKGROUND

If you want Gradient Background then just click on Gradient and select Gradient Angle and Color as shown in image below.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Edit-element-background-gradient.png)

# How to Edit Header and Footer

This Guide will Help you to edit Header and Footer Page.

#### GO TO PAGES AND EDIT

When you are on SitePad Website Builder dashboard. You will see **Pages** option on Sidebar Navigation Menu. Hover on **Pages** and Click on **All Pages**

Once you see all Pages. Click on the Edit Icon of the Header Page or Footer Page whichever you want to Edit shown like in the image below.

![](https://dotroll.com/wp-content/uploads/2020/08/All-pages.png)

#### EDIT HEADER

Once you open **Header Page** in editor you will be able to **Edit** all the stuff from Header Page as shown image below.

![](https://dotroll.com/wp-content/uploads/2020/08/Header-editor.png)

Note: You can also add extra items that you want to display in **Header**. Just **Drag and Drop** them as shown in image below.

![](https://dotroll.com/wp-content/uploads/2020/08/Add-item.png)

#### EDIT FOOTER COPYRIGHT TEXT

You can also edit Footer Page as similar to Header Page shown above. Click edit icon of Footer Page as shown in above images and edit.

To change the footer copyright text just click on that and change as per your needs as shown in image below.

![](https://dotroll.com/wp-content/uploads/2020/08/Footer-editor.png)

# How to Add Tags to Blog Post

In this tutorial, we will show you How to **Add Tags to Blog Post**.

For Adding Tags to your Blog Post you will need to access **SitePad Editor**.<a name="editor"></a>

#### GO TO SITEPAD EDITOR

From your Control Panel click on **SitePad Website Builder**. You will be redirected to SitePad Editor Server.

![](https://dotroll.com/wp-content/uploads/2020/08/Click_on_sitemush.png)  
Once you are redirected to the Editor Server you will see **Blog** in the Main menu. Click on **All Posts** and then click on **Edit Icon** to edit the Post. You will be redirected to the Editor.

![](https://dotroll.com/wp-content/uploads/2020/08/Select_all_and_edit.png)

#### MORE OPTION AND TAGS BUTTON

In **Editor**, you will need to hover the mouse on **More** then select **Tags Button**

![](https://dotroll.com/wp-content/uploads/2020/08/Select_tags.png)  
A dialog box will appear in which you can add a **New Tags** as shown in the image below.  
![](https://dotroll.com/wp-content/uploads/2020/08/Add_tags.png)

After selecting the Tags that you want to assign to your post click on **Save** to update the Tags for the **Post** as shown in the image below.

![](https://dotroll.com/wp-content/uploads/2020/08/Save_tags.png)

#### PREVIEW CHANGES

After assigning Tags to the post, on preview, your post would look like the image given below

![](https://dotroll.com/wp-content/uploads/2020/08/Tags_on_preview.png)

Also if you assign a **single tag** to more than one post and when you click on that **tag name** it will show all the blog post assigned to that tag as shown in the image below:.

![](https://dotroll.com/wp-content/uploads/2020/08/Post_display_per_tags.png)

# How to Add Categories to Blog Post

In this tutorial, we will show you How to **Add Categories to Blog Post**.

For Adding Categories to your Blog Post you will need to access **SitePad Editor**.<a name="editor"></a>

#### GO TO SITEPAD EDITOR

From your Control Panel click on **SitePad Website Builder**. You will be redirected to SitePad Editor Server.

![](https://dotroll.com/wp-content/uploads/2020/08/Click_on_sitemush.png)  
Once you are redirected to the Editor Server you will see **Blog** in the Main menu. Click on **All Posts** and then click on **Edit Icon** to edit the Post. You will be redirected to the Editor.  
![](https://dotroll.com/wp-content/uploads/2020/08/Select_all_and_edit.png)

#### MORE OPTION AND CATEGORIES BUTTON

In **Editor**, you will need to hover the mouse on **More** then select **Categories Button.**

![](https://dotroll.com/wp-content/uploads/2020/08/Select_categories.png)  
A dialog box will appear in which you can add a **New Category** as shown in the image below or you can select from different Categories already added.

![](https://dotroll.com/wp-content/uploads/2020/08/Add_new_category.png)

After selecting which Categories you want to assign to your post then click on **Save** to update the categories for the **Post** as shown in the image below.

![](https://dotroll.com/wp-content/uploads/2020/08/Save_categories.png)

#### PREVIEW CHANGES

After assigning categories to the post, on preview, your post would look like the image given below:

![](https://dotroll.com/wp-content/uploads/2020/08/Categories_preview.png)  
Also if you assign a **single category** to more than one post and when you click on that **category name** it will show all the blog post assigned to that category as shown in the image below:

![](https://dotroll.com/wp-content/uploads/2020/08/Category_displayed_post-1.png)

# How to Edit Custom Site Title

This documentation will guide you on How to Insert Site Title for Pages.<a name="editor"></a>

#### GO TO EDITOR

When on **SitePad Website Builder** Dashboard. Hover on **Pages** option given on the left sidebar and then click on **All Pages**. Once on all Pages Click on **Edit Icon** of Any Page.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Click_edit_contact.png)  
   
You will be redirected to Editor.<a name="slctsptn"></a>

#### SELECT SEO OPTION

On **SitePad Editor** hover on more menu on the navigation bar. When you hover on more menu three buttons will be drop down **i.e** Reset Page, SEO Options and Custom HTML.

Click on **SEO Option**.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Click_on_seo.png)

#### INSERT SITE TITLE

On clicking **SEO Option** you will see a dialog box will appear. Insert Site Title for any Page using drop down menu.

<div class="vc_row wpb_row vc_row-fluid" id="bkmrk-note%3A%C2%A0if-site-title-"><div class="wpb_column vc_column_container vc_col-sm-12"><div class="vc_column-inner"><div class="wpb_wrapper"><div class="wpb_text_column wpb_content_element "><div class="wpb_wrapper"><div>  
</div></div></div><div class="vc_message_box vc_message_box-standard vc_message_box-rounded vc_color-info vc_custom_1598965746759"><div class="vc_message_box-icon">  
</div><div class="ricsi info"><span class=".">**Note:** If Site Title is set for Global Meta it will also change the main Site Title for your website in SitePad Settings. Also, if any page does not have Custom Site Title then it will be used from Global Meta.</span></div></div></div></div></div></div>   
![](https://dotroll.com/wp-content/uploads/2020/08/Add_site_title.png)  
   
Once you have made the changes then click on **Save Meta** to save the Site Title.<a name="clrmtdtl"></a>

#### CLEAR META DETAILS

To Clear Site Title of the current page click on **Clear Meta**. Site Title will be reset to none.

<div class="vc_row wpb_row vc_row-fluid" id="bkmrk-note%3A%C2%A0for%C2%A0global-met"><div class="wpb_column vc_column_container vc_col-sm-12"><div class="vc_column-inner"><div class="wpb_wrapper"><div class="wpb_text_column wpb_content_element "><div class="wpb_wrapper">  
</div></div><div class="vc_message_box vc_message_box-standard vc_message_box-rounded vc_color-info vc_custom_1598965826169"><div class="vc_message_box-icon">  
</div><div class="ricsi info"><span class=".">**Note:** For **Global Meta** if you click on Clear Meta to clear Site Title it will not reset SitePad Settings Site Title that was saved previously when Global Meta Site Title was set.</span></div></div></div></div></div></div>  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Reset_meta.png)

# How to Add CSS using Custom HTML

This documentation will guide you on How to Insert CSS using Custom HTML code.<a name="editor"></a>

#### GO TO EDITOR

When on **SitePad Website Builder** Dashboard. Hover on **Pages** option given on the left sidebar and then click on **All Pages**. Once on all Pages Click on **Edit Icon** of Any Page.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Click_edit_contact.png)  
   
You will be redirected to Editor.<a name="slctcstmhtml"></a>

#### SELECT CUSTOM HTML

On **SitePad Editor** hover on more menu on the navigation bar. When you hover on more menu three buttons will be drop down **i.e** Reset Page, SEO Options and Custom HTML.

Click on **Custom HTML**.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Select_custom_html.png)

#### INSERT CSS IN CUSTOM HTML

On clicking **Custom HTML** you will see a dialog box will appear. Insert all your CSS under style tag as shown in image below.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Css_using_custom_html.png)

# How to Insert Custom HTML

This documentation will guide you on How to Insert Custom HTML code.<a name="gotoeditor"></a>

#### GO TO EDITOR

When on **SitePad Website Builder** Dashboard. Hover on **Pages** option given on the left sidebar and then click on **All Pages**. Once on all Pages Click on **Edit Icon** of Any Page.

![](https://dotroll.com/wp-content/uploads/2020/08/Click_edit_contact.png)

You will be redirected to Editor.<a name="selectcustomhtml"></a>

#### SELECT CUSTOM HTML

On **SitePad Editor** hover on more menu on the navigation bar. When you hover on more menu three buttons will be drop down **i.e** Reset Page, SEO Options and Custom HTML.

Click on **Custom HTML**.

![](https://dotroll.com/wp-content/uploads/2020/08/Select_custom_html.png)

#### INSERT CUSTOM HTML FOR HEADER

On clicking **Custom HTML** you will see a dialog box will appear. Insert Custom HTML code for Header in the given textarea.

![](https://dotroll.com/wp-content/uploads/2020/08/Insert_custom_html.png)

Once you have made the changes then click on **Save** to save the Custom HTML.

# How to Reset Pages, Blogs or Site

This guide will show you how to Reset Pages, Reset Blogs and Reset Site.

#### <span class="mw-headline" id="bkmrk-reset-1">RESET</span>

When you are on SitePad Editor you will see Reset Button. Click on the Reset Button.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Reset1.png)  
   
Then you will find three option. Choose an appropriate option.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Reset2.png)

<p class="callout info">**Note:**  
1. Reset all Pages – This will Reset only Pages.  
2. Reset all Blog Posts – This will Reset only Blog Pages.  
3. Reset full site – This will Reset full site (after reset you will need to start making the website from scratch).</p>

Once you select the option then click on **Continue** Button. Then you will see a confirmation box.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Reset3.png)  
   
When you click on **Yes, Reset** Button it will process ahead with the option that you have just confirmed.

Once Reset is done it will reload the page.

<p class="callout info"><span class=".">**Note:** On Full Reset you will be redirected to Themes where you will need to select the new theme.</span></p>

# How to Change Language

You can change the SitePad Editor Language in two ways (second one is easier).

#### FROM NAVIGATION BAR

You can change language from the **Navigation bar**. i.e On Top Navigation bar where you see the selected language name being displayed you can hover on the name. This will open a drop down list of available languages you can select your desired language. Check out the example below.

![](https://dotroll.com/wp-content/uploads/2020/08/Change_language.png)

#### FROM SETTINGS PAGE

When you are on **SitePad Editor** dashboard. Hover on **Settings** and then click on **General**.

![](https://dotroll.com/wp-content/uploads/2020/08/Genera_settings.png)

Once on **General Settings** page you will see the option **Site Language** as shown in the image below. You can select your desired language from the drop down list.

![](https://dotroll.com/wp-content/uploads/2020/08/Site_language.png)

# How to Clone a Site

This guide will show you how to Clone a Site.

#### CLONE A SITE

Click the **Sites** to display all the site that you have created from SitePad Dashboard.

Once you see all Sites. Click on the **Clone Icon** of the site that you want to clone or you can click on **Clone Site** as shown in the image below.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Clone_a_site.png)  
   
When you click on **Clone Icon** you will see all the options regarding the cloning.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Clone_site_details.png)  
   
Select the site from **source site** dropdown list and Add **New Site Name** for website. Then enter the New **Site Address** (select from your domains) and then add new directory. Next you need to Enter **Site Title**. You can also change the language of your clone site and select it to your native language.

Once the website is cloned Successfully you will see the success message asking you to **Visit Dashboard** of the clone site or **Edit** newly created clone site.

# How to Clone a Page

This guide will show you how to Clone a Page.

#### CLONE A PAGE

When you hover on **Pages** and Click on **All Pages**

Once you see all Pages. Click on the **Clone Icon** of the page you want to clone as shown in the image below.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Clone_a_page.png)  
   
After you click on **Clone Icon** you will be redirected to **SitePad Editor** of the newly clone page. You can provide the URL and **Page Title** and then click on Update and then edit the newly cloned page as per your requirement.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Add_clone_title.png)

# How to Create Menu

When the first **Theme** is selected it automatically populates the **Menu** but if you want to **Edit** or **Create Menu** you can follow this guide.

1. Hover on **Themes** tab in the left sidebar and when you see **Menus** option click on it as shown in the image below. **Please Note :** The menu name should be **Header Menu**.  
       
    ![](https://dotroll.com/wp-content/uploads/2020/08/Click_on_menus.png)

1. Select the Pages that you want to show on your **Header Menu** after Selection click on **Add Menu**.  
       
    ![](https://dotroll.com/wp-content/uploads/2020/08/Add_menu.png)

1. Adjust the **Menu** and **Sub Menu** by using **Drag &amp; Drop** once done Click on **Save Menu**.  
       
    ![](https://dotroll.com/wp-content/uploads/2020/08/Add_menu2.png)

1. If you want to remove any page from **Menu** you can do this by following below steps once done Click on **Save Menu**.  
       
    ![](https://dotroll.com/wp-content/uploads/2020/08/Menu-delete-img.png)

That’s it your done.

# How to Add Add Site Title and Tagline

This documentation will show you how to add Site Title and Tagline to your website.

#### GO TO SETTINGS AND CLICK GENERAL

When you are on **SitePad Website Builder** dashboard. Hover on **Settings** tab in left menu and then click on **General**.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Genera_settings.png)  
   
Once on **General Settings** page you will see editable options like **Site Title, Tagline, Date Format, TimeZone, Time Format, Week Start On** etc.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Sitetitle_tagline.png)

Enter the **Site Title** and **Tagline** for your website once you add it. Click on **Save Changes** button.

# How to Add Custom Logo

This guide will show you how to Add a Custom Logo.

#### GO TO PAGES AND EDIT HEADER

When you are on SitePad Website Builder dashboard. You will see **Pages** option on Sidebar Navigation Menu. Hover on **Pages** and Click on **All Pages**

Once you see all Pages. Click on the Edit Icon of the Header Page shown like in the image below.

![](https://dotroll.com/wp-content/uploads/2020/08/Edit_header.png)

#### ADDING CUSTOM LOGO

You will be redirected to **SitePad Editor** for Header. When you are in **SitePad Editor** if you want to add just the logo you will need to remove **Site Title** as shown in the below image and if you want the logo as well as text you do not need to remove the **Site Title**.

![](https://dotroll.com/wp-content/uploads/2020/08/Remove_title.png)  
Now drag and drop **Images Widget** to a new column in the same row with menu as shown in the image below.

![](https://dotroll.com/wp-content/uploads/2020/08/Dragndrop_image.png)  
After you drop the **Image Widget**. You will see a dialog box with naming **Insert Media** shown in the image below.

![](https://dotroll.com/wp-content/uploads/2020/08/Dialouge_box.png)  
You can select the logo file or drop the file in the dialog box.

<div class="vc_row wpb_row vc_row-fluid" id="bkmrk-note%3A-image-file-sho"><div class="wpb_column vc_column_container vc_col-sm-12"><div class="vc_column-inner"><div class="wpb_wrapper"><div class="wpb_text_column wpb_content_element "><div class="wpb_wrapper"><div class="ricsi info">  
</div></div></div><div class="vc_message_box vc_message_box-standard vc_message_box-rounded vc_color-info vc_custom_1598520271178"><div class="vc_message_box-icon">  
</div><div class="ricsi info"><div class="ricsi info">Note: Image File should be in **.jpeg**, **.jpg** or **.png** format only and Size of the Logo as per your requirement ( Image File in rectangular style would be more suitable ).</div></div></div></div></div></div></div>Once you upload the file Click on **Insert into Page**. Once the image is inserted you can adjust your logo column as per your menu.

Once Finished you can click on Update to Save if you want to edit other page.

# How to Add New Blog

This guide is to help you add new Blog Post.

#### LOGIN IN TO CONTROL PANEL

Firstly Login to your Control Panel (e.g. cPanel’s url will be [https://domain.com:2083](https://domain.com:2083/)) and login with your details. There click on the SitePad Icon or Link.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Click_on_sitemush.png)  
   
You will be redirected to **SitePad Website Builder**.

#### ADD NEW BLOG POST

Once you are on **SitePad Website Builder** dashboard. You will see **Blog** option on Sidebar Navigation Menu.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Sitemush_dashboard.jpg)  
   
Click on **Blog** and then click on **Add New.**  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Add_new_blog_post.jpg)  
   
After you click on Add New it will redirect you to **SitePad Website Editor.**  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Edit_new_blog.jpg)  
   
Enter the **Blog Title** then drag and drop items in your blog or you can even write a Blog Post by clicking on the textarea provided.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Edit_new_blog_with_layout.jpg)  
   
Also you can pick a predefined layout that we offer.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Click_publish_blog.jpg)

#### PUBLISH

After editing the blog post Click on **Publish** button to publish your blog post.

<div id="bkmrk-"></div><div id="bkmrk--1"></div>

# How to Add New Page

This guide will help you to Add New Page.

#### LOGIN IN TO CONTROL PANEL

Firstly Login to your Control Panel (e.g. cPanel’s url will be https://domain.com:2083) and login with your details. There click on the SitePad Icon or Link.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Click_on_sitemush.png)  
   
You will be redirected to **Website Builder**.<a name="newpage"></a>

#### ADD NEW PAGE

Once you are on Website Builder dashboard. You will see **Pages** option on Sidebar Navigation M  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Sitemush_dashboard.jpg)  
   
Click on **Pages** to Add new pages or Edit pages for your website.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Add_page_view_page.png)  
   
You can click on either option i.e Add Page or Click on Pages option to Select All Pages. When you select All Pages you can see certain options such as Edit Page, Delete Page, View Page etc.

<div class="toc" id="bkmrk-note%3A-do-not-delete-"><div class="ricsi info"><div class="ricsi info">**Note**: Do not delete Header and Footer page</div><div>   
![](https://dotroll.com/wp-content/uploads/2020/08/Edit_page_delete_page.png)</div></div></div>If you Select to **Add New** Page/**Edit** Page option. Then you will be redirected to Edit Page where you can Edit Page. If you select to Add new Page the page title will be New Page and Page url will be Page. You can change these both to your desire **Page name** and URL. By default the new page gets Added on the **Menu Bar** once you update the **Menu Name** changes to that of the **Page Title**.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Edit_a_page.png)  
   
You can also drag and drop different Widgets where ever you want the to see the elements. There are many different Widgets like Title, Paragraph, Slider, Service Box, Rich Text, Images, Videos, etc.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Use_drag_and_drop.png)  
   
When the item is dropped on a particular position to Edit you will be able to find Action bar, Advance Option to Customize etc. for different types of Widgets.

**Action Bar for Title**

   
   
![](https://dotroll.com/wp-content/uploads/2020/08/Action_bar_title.png)  
   
**Advanced Option to Customize the Widget**  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Customizing_an_element.png)  
   
You can select from different range of **40+ Widgets**.

**Duplicate a Widget or Delete a Widgets**  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Duplicate_delete_widget.png)

#### PUBLISH

After you Finish Editing your work you can Publish your Website or you can update it and later on Publish it.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Finishing_option.png)  
   
You can find these **Finishing Option** on the upper right corner of the editor.

After you click on Publish button you will see progress bar. Once the progress bar is complete you will find visit website button you can check the website you Published.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Publish_visit_website.png)

# Add New Site

This guide will show you how to Add New Site.

#### LOGIN IN TO CONTROL PANEL

Firstly Login to your Control Panel (e.g. cPanel’s url will be https://domain.com:2083) and login with your details. There click on the SitePad Icon or Link.

<div class="toc" id="bkmrk-%C2%A0%C2%A0">   
![](https://dotroll.com/wp-content/uploads/2020/08/Click_on_sitemush.png)  
 </div>You will be redirected to **Website Builder**.

#### ADD NEW SITE

Once you are on SitePad Website Builder dashboard. You will see **Sites** option on Sidebar Navigation Menu.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Sitemush_dashboard.jpg)  
   
Click on **Sites** and then Click on **Add New Site**.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Add_new_site.jpg)  
   
Now you will see all the options regarding adding new sites.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Enter_new_site_details.jpg)  
   
Add **New Site Name** for website to be shown on switch site. Then enter the New **Site Address** (select from your domains) and then add new directory. Next you need to Enter **Site Title**. You can also change the language of your new site and select it to your native language. Also if you want you can also add new admin email.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Success_message.jpg)

Once the website is added Successfully you will see the success message asking you to visit **Dashboard** of the new site or **Edit** newly created Site.

# How to Create Website

This guide will help you how to Create a Website using SitePad Website builder.

#### LOGIN IN TO CONTROL PANEL

Firstly Login to your Control Panel (e.g. cPanel’s url will be https://domain.com:2083) and login with your details. There click on the SitePad Icon or Link.

![](https://dotroll.com/wp-content/uploads/2020/08/Click_on_sitemush-1.png)

You will be redirected to **SitePad Website Builder**.

#### SELECT A THEME

Once you are redirected to **SitePad**. You will need to select a Theme for your website

![](https://dotroll.com/wp-content/uploads/2020/08/Choose_theme_option-1.png)

You can click on either option and you will be redirect to our Theme directory where you will need to select/choose a theme for your website. You can also search for a Theme through Theme Search Option. Checkout Theme details. Once you find a theme suitable for your website you can click on **Activate** button to Set the theme as a default theme for your Website Editing.

![](https://dotroll.com/wp-content/uploads/2020/08/Activate_theme_search_theme.png)

When theme is Activated. You can checkout for a preview of this Theme.

![](https://dotroll.com/wp-content/uploads/2020/08/Click_to_preview_site.png)

Click on Visit Site to Preview.

#### ADDING/EDITING PAGES

You can now Add new pages or Edit pages for your website.

![](https://dotroll.com/wp-content/uploads/2020/08/Add_page_view_page.png)

You can click on either option i.e Add Page or Click on Pages option to Select All Pages. When you select All Pages you can see certain options such as Edit Page, Delete Page, View Page etc.

**\*\*Note:** Do not delete Header and Footer page

![](https://dotroll.com/wp-content/uploads/2020/08/Edit_page_delete_page.png)

If you Select to Add New Page/Edit Page option. Then you will be redirected to Edit Page where you can Edit Page. If you select to Add new Page the page title will be New Page and Page url will be Page. You can change these both to your desire Page name and URL. By default the new page gets Added on the Menu Bar once you update the Menu Name changes to that of the Page Title.

![](https://dotroll.com/wp-content/uploads/2020/08/Edit_a_page.png)

You can also drag and drop different Widgets where ever you want the to see the elements. There are many different Widgets like Title, Paragraph, Slider, Service Box, Rich Text, Images, Videos, etc

![](https://dotroll.com/wp-content/uploads/2020/08/Use_drag_and_drop.png)

When the item is dropped on a particular position to Edit you will be able to find Action bar, Advance Option to Customize etc. for different types of Widgets.

![](https://dotroll.com/wp-content/uploads/2020/08/Action_bar_title.png)

![](https://dotroll.com/wp-content/uploads/2020/08/Customizing_an_element.png)

#### PUBLISH

After you Finish Editing your work you can Publish your Website or you can update it and later on Publish it.

![](https://dotroll.com/wp-content/uploads/2020/08/Finishing_option.png)

After you click on Publish button you will see progress bar. Once the progress bar is complete you will find visit website button you can check the website you Published.

![](https://dotroll.com/wp-content/uploads/2020/08/Publish_visit_website.png)