Introduction - Nicepage Documentation

<!DOCTYPE html> <html lang="en"> <head> <title>Introduction - Nicepage Documentation</title> <link rel="shortcut icon" href="//csite.nicepage.com/favicon.ico" type="image/x-icon"> <meta charset="utf-8" /> <meta name="Keywords" content=" "> <meta name="Description" content="Our Video Lessons will help you learn how to build a website from scratch with Nicepage without special knowledge and skills, significantly reducing the time to master the program."> <meta property="og:type" content="article"> <meta property="og:url" content="https://nicepage.com/doc/428506/introduction"> <meta property="og:title" content="Introduction - Nicepage Documentation"> <meta property="og:image" content="https://static.nicepage.com/images/site/nicepage.jpg"> <meta property="og:description" content="Our Video Lessons will help you learn how to build a website from scratch with Nicepage without special knowledge and skills, significantly reducing the time to master the program."> <meta property="og:site_name" content="Nicepage.com" /> <meta name="viewport" content="initial-scale=1.0,maximum-scale=1.0,user-scalable=no,width=device-width"> <script src="//capp.nicepage.com/1662e8971b75e227453abf2b0c0bb260dcad244d/main-libs.js" ></script> <link href="//capp.nicepage.com/1662e8971b75e227453abf2b0c0bb260dcad244d/main-libs.css" rel="stylesheet" /> <link href="https://fonts.googleapis.com/css?family=Roboto|Open+Sans:200,300,400,700,800,900&subset=latin" rel="preload" as="font" /> <script> window.isAuthenticated = 0; window.useExternalGtmCode = 0; window.clientUserId = 0; window.clientUserName = ''; window.userCountryCode = ''; window.logPageEvent = 1; window.userHasAdsParams = 0; window.utmSourceFromReferrer = 0; window.currentLang = ''; window.baseUrl = 'html-templates'; window.currentUrl = ''; window.np_userId = ''; window.isAmplitudeInitialized = false; window.sha256Email = ''; function getCookieOrLocalStorage(name) { var nameEQ = name + "="; var ca = document.cookie.split(';'); for (var i = 0; i < ca.length; i++) { var c = ca[i]; while (c.charAt(0) == ' ') c = c.substring(1, c.length); if (c.indexOf(nameEQ) == 0) { return c.substring(nameEQ.length, c.length); } } var lsValue = localStorage.getItem(name); return !!lsValue; } function sendAnalyticsData(eventType, props, cb) { var json = { data: {} }; json.userToken = np_userId; json.data.adsParams = $.cookie('AdsParameters'); json.data.ga = $.cookie('_ga'); json.data.gac = $.cookie('_gac_UA-88868916-2'); json.data.userAgent = navigator.userAgent; json.data.eventType = eventType; json.data.props = props; $.ajax({ 'type': 'POST', 'url': '/Feedback/SendAdsLog', 'contentType': 'application/json; charset=utf-8', 'data': JSON.stringify(json), 'dataType': 'json', 'complete': cb || function() {} }); } function initializeAmplitudeUser() { if (isAmplitudeInitialized) { return; } isAmplitudeInitialized = true; if (clientUserId > 0) { identifyAmplitudeUser(clientUserId, clientUserName); } else { identifyAmplitudeUser(null); } } function sendAmplitudeAnalyticsData(eventName, eventProperties, userProperties, callback_function) { initializeAmplitudeUser(); if (userProperties) { if(userProperties.utm_source || userProperties.utm_campaign) { var identify = new amplitude.Identify(); identify.setOnce("utm_campaign", userProperties.utm_campaign); identify.setOnce("utm_source", userProperties.utm_source); identify.setOnce("utm_content", userProperties.utm_content); identify.setOnce("utm_group", userProperties.utm_group); identify.setOnce("utm_term", userProperties.utm_term); identify.setOnce("utm_page", userProperties.utm_page); identify.setOnce("utm_page2", userProperties.utm_page); identify.setOnce("referrer", userProperties.referrer); amplitude.getInstance().identify(identify); userProperties.utm_source_last = userProperties.utm_source; userProperties.utm_campaign_last = userProperties.utm_campaign; userProperties.utm_content_last = userProperties.utm_content; userProperties.utm_group_last = userProperties.utm_group; userProperties.utm_term_last = userProperties.utm_term; userProperties.utm_page_last = userProperties.utm_page; } var userProps = objectWithoutProperties(userProperties, ["utm_campaign", "utm_source","utm_content", "utm_term", "utm_page", "utm_group", "referrer"]); amplitude.getInstance().setUserProperties(userProps); } if (!eventProperties) { eventProperties = {}; } eventProperties.WebSite = 'true'; eventProperties.IsAuthenticated = window.isAuthenticated; eventProperties.country_code = getCountryCode(); eventProperties.lang = window.currentLang || ''; var fullPageUrl = window.location.pathname.split('?')[0]; eventProperties.full_page_url = fullPageUrl; eventProperties.page_url = clearPageUrl(fullPageUrl); if (typeof callback_function === 'function') { amplitude.getInstance().logEvent(eventName, eventProperties, callback_function); } else { amplitude.getInstance().logEvent(eventName, eventProperties); } } function identifyAmplitudeUser(userId, token) { if (userId) { amplitude.getInstance().setUserProperties({ "Token": token, "UserId": userId }); } var identify = new amplitude.Identify(); amplitude.getInstance().identify(identify); if (userId) { amplitude.getInstance().setUserId(userId); } } function getUtmParamsFromUrl() { var hash = window.location.hash; var url = new URL(window.location.href); if (hash && hash.indexOf('utm_') >= 0) { url = new URL(window.location.origin + window.location.pathname + hash.replace('#', '?')); } if (!url.searchParams) { return ''; } return getUtmParams(url); } function hasGoogleIdFromUrl() { var url = new URL(window.location.href); if (!url.searchParams) { return false; } return !!url.searchParams.get('gclid'); } function sendAnalyticsFromUrl(referrer, pageType) { var urlIsAvailable = typeof URL === "function" || (navigator.userAgent.indexOf('MSIE') !== -1 && typeof URL === 'object'); if (!urlIsAvailable) { return; } var utmParams = getUtmParamsFromUrl(); if (!utmParams) { return; } var gclidFromUrl = utmParams.gclid; var utmParamsFromUrl = !!utmParams.utmSource || !!utmParams.utmCampaign || !!utmParams.gclid; if (!utmParamsFromUrl && userHasAdsParams) { utmParams = getUtmParamsFromCookie(); } var canLog = canLogToAmplitude(pageType); if (utmParamsFromUrl || utmSourceFromReferrer) { var fullPageUrl = window.location.pathname.split('?')[0]; var pageUrl = clearPageUrl(fullPageUrl); var userProps = { "utm_source": utmParams.utmSource, "utm_campaign": utmParams.utmCampaign, "utm_content": utmParams.utmContent, "utm_group": utmParams.utmGroup, "utm_term": utmParams.utmTerm, "utm_page": getUtmPageValue(pageUrl), "utm_lang": window.currentLang || '', "referrer": referrer }; if (gclidFromUrl) { var landingUrl = pageUrl.startsWith('/') && pageUrl !== '/' ? pageUrl.substr(1) : pageUrl; userProps.landing_page = landingUrl; var event = { 'Page': landingUrl, 'Url': window.location.href, 'utm_campaign_event': utmParams.utmCampaign, 'utm_group_event': utmParams.utmGroup } sendAmplitudeAnalyticsData('Landing Page', event, userProps); } else { var eventProps = { "utm_source": utmParams.utmSource, "utm_campaign": utmParams.utmCampaign, "utm_content": utmParams.utmContent, "utm_group": utmParams.utmGroup, "utm_term": utmParams.utmTerm }; if (utmParams.utmSource === "elastic") { sendAmplitudeAnalyticsData('Email Click', eventProps); } if (canLog) { sendAmplitudeAnalyticsData('Campaign', eventProps, userProps); } } } if (logPageEvent && canLog || (pageType === 'Pricing Page' && window.isValidCountry(true))) { var pageEventProps = { 'type': pageType, 'accepted_country': isValidCountry(), 'force_log': !canLog }; if (utmParams.gclid) { pageEventProps.googleClickId = utmParams.gclid; } sendAmplitudeAnalyticsData('Page View', pageEventProps); } } document.addEventListener('DOMContentLoaded', function () { if (location.href.indexOf('/frame/') === -1 && window.location.href.indexOf('skipCookie') === -1) { PureCookie.initCookieConsent(); } setCountryCode('https://location.nicepagesrv.com/country'); setUserIdCookie(); var referrer = ''; var pageType = 'Doc Article'; sendAnalyticsFromUrl(referrer, pageType); }); </script> <script> // Define dataLayer and the gtag function. window.dataLayer = window.dataLayer || []; function gtag() { dataLayer.push(arguments); } var consentDefaultValue = 'granted'; gtag('consent', 'default', { 'ad_storage': consentDefaultValue, 'ad_user_data': consentDefaultValue, 'ad_personalization': consentDefaultValue, 'analytics_storage': consentDefaultValue }); if (hasGoogleIdFromUrl()) { useExternalGtmCode = 1; } </script>  <script> if (useExternalGtmCode) { (function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src='https://load.api9.nicepage.com/nldlswob.js?st='+i+dl+'';f.parentNode.insertBefore(j,f);})(window,document,'script','dataLayer','W76XGFR'); } else { (function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src='https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);})(window,document,'script','dataLayer','GTM-W76XGFR'); } </script>   <script> if(window.hideFacebookPixelCode !== true) { !function (f, b, e, v, n, t, s) { if (f.fbq) return; n = f.fbq = function () { n.callMethod ? n.callMethod.apply(n, arguments) : n.queue.push(arguments) }; if (!f._fbq) f._fbq = n; n.push = n; n.loaded = !0; n.version = '2.0'; n.queue = []; t = b.createElement(e); t.async = !0; t.src = v; s = b.getElementsByTagName(e)[0]; s.parentNode.insertBefore(t, s) }(window, document, 'script', 'https://connect.facebook.net/en_US/fbevents.js'); var fbInitOptions = { em: '' }; if (clientUserId > 0) { fbInitOptions.external_id = clientUserId; } fbq('init', '251025992170426', fbInitOptions); fbq('track', 'PageView'); } </script> <noscript><img height="1" width="1" style="display:none" src="https://www.facebook.com/tr?id=251025992170426&ev=PageView&noscript=1" /></noscript>   <script type="text/javascript"> (function(e,t){var n=e.amplitude||{_q:[],_iq:{}};var r=t.createElement("script") ;r.type="text/javascript" ;r.integrity="sha384-d/yhnowERvm+7eCU79T/bYjOiMmq4F11ElWYLmt0ktvYEVgqLDazh4+gW9CKMpYW" ;r.crossOrigin="anonymous";r.async=true ;r.src="https://cdn.amplitude.com/libs/amplitude-5.2.2-min.gz.js" ;r.onload=function(){if(!e.amplitude.runQueuedFunctions){ console.log("[Amplitude] Error: could not load SDK")}} ;var i=t.getElementsByTagName("script")[0];i.parentNode.insertBefore(r,i) ;function s(e,t){e.prototype[t]=function(){ this._q.push([t].concat(Array.prototype.slice.call(arguments,0)));return this}} var o=function(){this._q=[];return this} ;var a=["add","append","clearAll","prepend","set","setOnce","unset"] ;for(var u=0;u<a.length;u++){s(o,a[u])}n.Identify=o;var c=function(){this._q=[] ;return this} ;var l=["setProductId","setQuantity","setPrice","setRevenueType","setEventProperties"] ;for(var p=0;p<l.length;p++){s(c,l[p])}n.Revenue=c ;var d=["init","logEvent","logRevenue","setUserId","setUserProperties","setOptOut","setVersionName","setDomain","setDeviceId","setGlobalUserProperties","identify","clearUserProperties","setGroup","logRevenueV2","regenerateDeviceId","groupIdentify","onInit","logEventWithTimestamp","logEventWithGroups","setSessionId","resetSessionId"] ;function v(e){function t(t){e[t]=function(){ e._q.push([t].concat(Array.prototype.slice.call(arguments,0)))}} for(var n=0;n<d.length;n++){t(d[n])}}v(n);n.getInstance=function(e){ e=(!e||e.length===0?"$default_instance":e).toLowerCase() ;if(!n._iq.hasOwnProperty(e)){n._iq[e]={_q:[]};v(n._iq[e])}return n._iq[e]} ;e.amplitude=n})(window,document); amplitude.getInstance().init("878f4709123a5451aff838c1f870b849"); </script> <script> var shareasaleSSCID=shareasaleGetParameterByName("sscid");function shareasaleSetCookie(e,a,r,s,t){if(e&&a){var o,n=s?"; path="+s:"",i=t?"; domain="+t:"",S="";r&&((o=new Date).setTime(o.getTime()+r),S="; expires="+o.toUTCString()),document.cookie=e+"="+a+S+n+i+"; SameSite=None;Secure"}}function shareasaleGetParameterByName(e,a){a||(a=window.location.href),e=e.replace(/[\[\]]/g,"\\$&");var r=new RegExp("[?&]"+e+"(=([^&#]*)|&|#|$)").exec(a);return r?r[2]?decodeURIComponent(r[2].replace(/\+/g," ")):"":null}shareasaleSSCID&&shareasaleSetCookie("shareasaleSSCID",shareasaleSSCID,94670778e4,"/"); </script> <link rel="preconnect" href="https://images01.nicepagecdn.com" /> <link rel="preconnect" href="https://csite.nicepage.com" />  <script> window.serverSettings = { fbAppId: '290410448063109', googleAppId: '13150095650-mo8psu2colep6uv90a2mu6r87u87s35a.apps.googleusercontent.com' }; </script> <script src="https://accounts.google.com/gsi/client?hl=en" async></script> <script src="//csite.nicepage.com/Scripts/Site/auth-common.js?version=1662e8971b75e227453abf2b0c0bb260dcad244d" defer></script> <script> var T = new Object(); T['Post.Delete'] = 'Delete'; T['Loading'] = 'Loading'; T['Attachment.File.Limit.Error'] = 'You can attach only 5 files'; T['Attachment.General.Error'] = 'There is an error with the file or the file size exceeds the allowed limit (20MB). Try putting the file in a shared location and sending a link instead.'; T['Attachment.Insert'] = 'Insert Attachment'; T['Report.Spam.Success'] = 'Thank you for Report!'; </script> <link rel="canonical" href="https://nicepage.com/doc/428506/introduction" /> <style> @media (min-width: 1400px) { .container { width: 1370px; } } .col-sticky { position: sticky; top: 10px; } .col-widgets { max-height: calc(100vh - 50px); overflow-x: hidden; overflow-y: auto; } </style> <script> function getAcnhor() { return (document.URL.split('#').length > 1) ? document.URL.split('#')[1] : null; } function updateWaypoints() { var list = document.querySelector('.doc-waypoint-list'); if (!list) { return; } var items = list.querySelectorAll('.doc-waypoint-item'); if (!items.length) { return; } var i, active = 0; var scroller = document.documentElement; var height = scroller.clientHeight; var isScrollEnd = Math.abs(scroller.scrollTop + scroller.clientHeight - scroller.scrollHeight) < 1; var top = 30; // heading top offest var viewHeight = height * 0.5; // find visible anchor in viewport for (i = 0; i < items.length; i++) { var item = items[i]; var id = item.getAttribute('data-id'); if (!id) { continue; } var heading = document.getElementById(id); if (!heading) { continue; } var rect = heading.getBoundingClientRect(); if (!rect) { continue; } if (rect.top < -top) { // scrolled under top active = i; // or last scrolled } else if (rect.top + rect.height < viewHeight) { // in the upper half active = i; break; } } // check active anchor visible in viewport var anchor = getAcnhor(); if (anchor) { for (i = 0; i < items.length; i++) { var item = items[i]; var id = item.getAttribute('data-id'); if (!id || id !== anchor) { continue; } var heading = document.getElementById(id); if (!heading) { continue; } var rect = heading.getBoundingClientRect(); if (!rect) { continue; } if (rect.top >= -top && (rect.top + rect.height < viewHeight || isScrollEnd)) { // is visible in the upper half active = i; } break; } } // set active item for (i = 0; i < items.length; i++) { var item = items[i]; if (i === active) { if (!item.classList.contains('active')) { item.classList.add('active'); } } else { if (item.classList.contains('active')) { item.classList.remove('active'); } } } } var ticking; function onScroll() { if (!ticking) { window.requestAnimationFrame(function () { updateWaypoints(); ticking = false; }); ticking = true; } } function onClick(event) { if (event && event.target && event.target.closest('.doc-waypoint-item')) { onScroll(); // updateWaypoints(); } } function scrollToAnchorWaypoint() { var anchor = getAcnhor(); if (!anchor) { return; } var list = document.querySelector('.doc-waypoint-list'); if (!list) { return; } var items = list.querySelectorAll('.doc-waypoint-item'); if (!items.length) { return; } for (var i = 0; i < items.length; i++) { var item = items[i]; var id = item.getAttribute('data-id'); if (!id || id !== anchor) { continue; } var heading = document.getElementById(id); if (!heading) { continue; } heading.scrollIntoView({behavior: 'smooth', block: 'start'}); break; } } // try to disable default browser scroll position restore history.scrollRestoration = 'manual'; //try #1 (all browser, exclude IE11) document.documentElement.scrollTop = 0; // try #2 (all browser) document.addEventListener("DOMContentLoaded", function initWaypoints() { setTimeout(function () { // skip default scroll restoration, if triggered scrollToAnchorWaypoint(); setTimeout(function () { // skip scroll to anchor document.addEventListener('scroll', onScroll); document.addEventListener('click', onClick); // May be navigate without scroll onScroll(); // updateWaypoints(); }, 500); }, 250); }); </script> <script src="//capp.nicepage.com/1662e8971b75e227453abf2b0c0bb260dcad244d/forum-main-libs.js" defer></script> <link href="//capp.nicepage.com/1662e8971b75e227453abf2b0c0bb260dcad244d/forum-main-libs.css" rel="stylesheet" />  <!— Pinterest Tag —>  <!— end Pinterest Tag —> <style> .navbar { margin-bottom: 0; } </style> <script type="text/javascript"> document.addEventListener("DOMContentLoaded", function () { if (typeof IOlazy === 'function') { var lazy = new IOlazy(); } }); </script> </head> <body>  <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-W76XGFR" height="0" width="0" style="display: none; visibility: hidden"></iframe></noscript>  <div id="fb-root"></div> <script async defer crossorigin="anonymous" src="https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v18.0&appId=290410448063109" nonce="zGb432eF"></script> <div class="wrap wrap-fluid"> <div id="top-navbar" class="navbar navbar-inverse"> <div class="container-fluid"> <div class="navbar-header"> <a class="navbar-brand clearfix" href="https://nicepage.com"><img class="pull-left" width="123" height="40" alt="Nicepage.com" src="//csite.nicepage.com/Images/logo-w.png" /></a> <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-collapse"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> </div> <div class="navbar-collapse collapse"> <ul class="logon-block nav navbar-nav nav-list navbar-left u-unstyled" style="font-size: 14px;"> <li class="dropdown"> <a href="/download">Download</a> </li> <li class="dropdown"> <a href="/features">400+ Features</a> </li> <li class="dropdown"> <a aria-expanded="false" role="button" data-toggle="dropdown" class="dropdown-toggle template-menu-item" href="/html-templates">15,000+ Templates <span class="caret"></span></a> <ul role="menu" class="dropdown-menu dropdown-menu-hover u-unstyled"> <li><a href="/website-templates" class="templates-url" data-urls="website-templates;templates">Website Templates</a></li> <li><a href="/website-design" class="templates-url">Website Designs</a></li> <li><a href="/wordpress-themes">WordPress Themes</a></li> <li><a href="/joomla-templates">Joomla Templates</a></li> <li><a href="/html-templates" class="templates-url" data-urls="html-templates;html5-template;css-templates">HTML Templates</a></li> </ul> </a> </li> <li class="dropdown"> <a aria-expanded="false" role="button" data-toggle="dropdown" class="dropdown-toggle" href="#"> Website Builders <span class="caret"></span> </a> <ul role="menu" class="dropdown-menu dropdown-menu-hover u-unstyled"> <li><a class="builder-link" href="/html-website-builder">HTML Website Builder</a></li> <li><a class="builder-link" href="/wordpress-website-builder">WordPress Website Builder</a></li> <li><a class="builder-link" href="/joomla-page-builder">Joomla Page Builder</a></li> </ul> </li> <li class="dropdown"> <a href="/premium?code=bf24">Pricing</a> </li> <li><a href="/forum">Forums</a></li> <li class="dropdown"> <a href="/blog">Blog</a> </li> <li class="dropdown"> <a aria-expanded="false" role="button" data-toggle="dropdown" class="dropdown-toggle" href="#">Help<span class="caret"></span></a> <ul role="menu" class="dropdown-menu dropdown-menu-hover u-unstyled"> <li><a href="/doc/1318/video-lessons">Video Tutorials</a></li> <li><a href="/doc">Documentation</a></li> <li><a href="/Forum/Topic/Create">Contact Support</a></li> </ul> </li> </ul> <ul class="logon-block nav navbar-nav nav-list navbar-right u-unstyled"> <li><a href="/Editor/Account/LogOn">Sign In</a></li><li class="divider-vertical"></li><li><a href="https://nicepage.com/Editor/Account/Register">Register</a></li><li class="divider-vertical"></li> </ul> </div> </div> </div> <section class="container-fluid" style="padding: 0; margin-bottom: 0;"> <a href="/premium?code=bf24"> <img style="margin: 0 auto; display: block; width: 100%;" alt="Black Friday Sale! Save up to 50% off!" src="https://images02.nicepagecdn.com/cd46d0ff82086185e4d7aa0f/688183eae375568a98de87aa/coupon_34_1800-bf-87a8.jpg"/> </a> </section> <section id="" class="container"> <div id="jsquickmessage" style="display:none;"></div> <article class="article-containter"> <div class="row"> <div class="col-md-8"> <ol class="breadcrumb"> <li><a href="/doc">Home</a></li> <li><a href="/doc/c/video-lessons">Video Lessons</a></li> <li class="active">Introduction</li> </ol> </div> <div class="col-md-4"> <div style="margin-top: 10px;" > <a class="youtube-subscribe-btn" href="//youtube.com/c/nicepage?sub_confirmation=1" target="_blank"> <img src="//csite.nicepage.com/Images/Site/subscribe.png" alt="Subscribe on Youtube" style="width: 135px; vertical-align: bottom; margin-right: 5px;" /> </a> <div style="display: inline-block;"> <div class="fb-like" data-href="https://www.facebook.com/nicepageapp" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="false"></div> </div> </div> </div> </div> <div class="row"> <div class="col-md-8"> <div class="row"> <div class="col-md-12"> <h1> Introduction </h1> </div> </div> <div class="row"> <div class="col-md-12"> <div class="postbody"> <div id="postcontent-428506" class="postcontent"> <h3> </h3> <p>Our Video Lessons will help you learn how to build a website from scratch with Nicepage without special knowledge and skills, significantly reducing the time to master the program.</p> <h3> </h3> <iframe style="width: 95%; aspect-ratio: 16 / 9;" src="https://www.youtube.com/embed/7ZeKBHeuRE8" title="Nicepage Lessons: Introduction" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen=””></iframe> <h3> </h3> <table width="95%"> <tr> <td width="50%" align="left"><a href="/doc/1318/video-lessons">All Lessons</a></td> <td width="50%" align="right"><a href="/doc/430161/installation-first-website">Next</a></td> </tr> </table> <p><br></p> <span class="post-content-quote" id="post-content-428506">### Our Video Lessons will help you learn how to build a website from scratch with Nicepage without special knowledge and skills, significantly reducing the time to master the program. ### <iframe style="width: 95%; aspect-ratio: 16 / 9;" src="https://www.youtube.com/embed/7ZeKBHeuRE8" title="Nicepage Lessons: Introduction" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen=””></iframe> ### <table width="95%"> <tr> <td width="50%" align="left">[All Lessons](page:1318)</td> <td width="50%" align="right">[Next](page:430161)</td> </tr> </table> <br> </span> </div> </div> </div> </div> </div> <div class="col-md-4 col-sticky"> <div class=" sidebar-container col-widgets"> <div class="row"> <div class="col-md-12"> <h3><a class="doc-category-caption" href="/doc/c/video-lessons">Video Lessons</a></h3> </div> </div> <div class="row"> <div class="col-md-12"> <ul class="doc-article-list"> <li> <a href="/doc/1318/video-lessons" class=""> <svg id="icon-document" x="0px" y="0px" width="16px" height="16px" viewBox="0 0 16 16" enable-background="new 0 0 16 16" xml:space="preserve"> <path fill="#4184F4" d="M15,1v14H1V1 M16,0H0v16h16V0L16,0z"/> <path fill="#4184F4" d="M13,4H3v1h10V4L13,4z"/> <path fill="#4184F4" d="M13,7H3v1h10V7L13,7z"/> <path fill="#4184F4" d="M10,10H3v1h7V10L10,10z"/> </svg> All Video Lessons </a> </li> <li> <a href="/doc/428506/introduction" class="link-current"> <svg id="icon-video" x="0px" y="0px" width="16px" height="16px" viewBox="0 0 16 16" enable-background="new 0 0 16 16" xml:space="preserve"> <path fill="#808080" d="M15,1v14H1V1 M16,0H0v16h16V0L16,0z"/> <path fill="#808080" d="M5,4.6v6.9C5,12,5.5,12.2,5.9,12l5.8-3.4c0.3-0.2,0.3-0.7,0-0.9L5.9,4.1C5.5,3.8,5,4.1,5,4.6z"/> </svg> Introduction </a> </li> <li> <a href="/doc/430161/installation-first-website" class=""> <svg id="icon-video" x="0px" y="0px" width="16px" height="16px" viewBox="0 0 16 16" enable-background="new 0 0 16 16" xml:space="preserve"> <path fill="#4184F4" d="M15,1v14H1V1 M16,0H0v16h16V0L16,0z"/> <path fill="#4184F4" d="M5,4.6v6.9C5,12,5.5,12.2,5.9,12l5.8-3.4c0.3-0.2,0.3-0.7,0-0.9L5.9,4.1C5.5,3.8,5,4.1,5,4.6z"/> </svg> Installation & First Website </a> </li> <li> <a href="/doc/433033/add-pages-blocks-elements" class=""> <svg id="icon-video" x="0px" y="0px" width="16px" height="16px" viewBox="0 0 16 16" enable-background="new 0 0 16 16" xml:space="preserve"> <path fill="#4184F4" d="M15,1v14H1V1 M16,0H0v16h16V0L16,0z"/> <path fill="#4184F4" d="M5,4.6v6.9C5,12,5.5,12.2,5.9,12l5.8-3.4c0.3-0.2,0.3-0.7,0-0.9L5.9,4.1C5.5,3.8,5,4.1,5,4.6z"/> </svg> Add Pages, Blocks & Elements </a> </li> <li> <a href="/doc/442283/main-website-elements" class=""> <svg id="icon-video" x="0px" y="0px" width="16px" height="16px" viewBox="0 0 16 16" enable-background="new 0 0 16 16" xml:space="preserve"> <path fill="#4184F4" d="M15,1v14H1V1 M16,0H0v16h16V0L16,0z"/> <path fill="#4184F4" d="M5,4.6v6.9C5,12,5.5,12.2,5.9,12l5.8-3.4c0.3-0.2,0.3-0.7,0-0.9L5.9,4.1C5.5,3.8,5,4.1,5,4.6z"/> </svg> Main Website Elements </a> </li> <li> <a href="/doc/422558/text-element" class=""> <svg id="icon-video" x="0px" y="0px" width="16px" height="16px" viewBox="0 0 16 16" enable-background="new 0 0 16 16" xml:space="preserve"> <path fill="#4184F4" d="M15,1v14H1V1 M16,0H0v16h16V0L16,0z"/> <path fill="#4184F4" d="M5,4.6v6.9C5,12,5.5,12.2,5.9,12l5.8-3.4c0.3-0.2,0.3-0.7,0-0.9L5.9,4.1C5.5,3.8,5,4.1,5,4.6z"/> </svg> Text Element </a> </li> <li> <a href="/doc/422561/image-element" class=""> <svg id="icon-video" x="0px" y="0px" width="16px" height="16px" viewBox="0 0 16 16" enable-background="new 0 0 16 16" xml:space="preserve"> <path fill="#4184F4" d="M15,1v14H1V1 M16,0H0v16h16V0L16,0z"/> <path fill="#4184F4" d="M5,4.6v6.9C5,12,5.5,12.2,5.9,12l5.8-3.4c0.3-0.2,0.3-0.7,0-0.9L5.9,4.1C5.5,3.8,5,4.1,5,4.6z"/> </svg> Image Element </a> </li> <li> <a href="/doc/422576/button-element" class=""> <svg id="icon-video" x="0px" y="0px" width="16px" height="16px" viewBox="0 0 16 16" enable-background="new 0 0 16 16" xml:space="preserve"> <path fill="#4184F4" d="M15,1v14H1V1 M16,0H0v16h16V0L16,0z"/> <path fill="#4184F4" d="M5,4.6v6.9C5,12,5.5,12.2,5.9,12l5.8-3.4c0.3-0.2,0.3-0.7,0-0.9L5.9,4.1C5.5,3.8,5,4.1,5,4.6z"/> </svg> Button Element </a> </li> <li> <a href="/doc/422577/hyperlink-element" class=""> <svg id="icon-video" x="0px" y="0px" width="16px" height="16px" viewBox="0 0 16 16" enable-background="new 0 0 16 16" xml:space="preserve"> <path fill="#4184F4" d="M15,1v14H1V1 M16,0H0v16h16V0L16,0z"/> <path fill="#4184F4" d="M5,4.6v6.9C5,12,5.5,12.2,5.9,12l5.8-3.4c0.3-0.2,0.3-0.7,0-0.9L5.9,4.1C5.5,3.8,5,4.1,5,4.6z"/> </svg> Hyperlink Element </a> </li> <li> <a href="/doc/422578/icon-element" class=""> <svg id="icon-video" x="0px" y="0px" width="16px" height="16px" viewBox="0 0 16 16" enable-background="new 0 0 16 16" xml:space="preserve"> <path fill="#4184F4" d="M15,1v14H1V1 M16,0H0v16h16V0L16,0z"/> <path fill="#4184F4" d="M5,4.6v6.9C5,12,5.5,12.2,5.9,12l5.8-3.4c0.3-0.2,0.3-0.7,0-0.9L5.9,4.1C5.5,3.8,5,4.1,5,4.6z"/> </svg> Icon Element </a> </li> <li> <a href="/doc/422579/shape-element" class=""> <svg id="icon-video" x="0px" y="0px" width="16px" height="16px" viewBox="0 0 16 16" enable-background="new 0 0 16 16" xml:space="preserve"> <path fill="#4184F4" d="M15,1v14H1V1 M16,0H0v16h16V0L16,0z"/> <path fill="#4184F4" d="M5,4.6v6.9C5,12,5.5,12.2,5.9,12l5.8-3.4c0.3-0.2,0.3-0.7,0-0.9L5.9,4.1C5.5,3.8,5,4.1,5,4.6z"/> </svg> Shape Element </a> </li> <li><a href="/doc/c/video-lessons">show more »</a></li> </ul> </div> </div> </div> </div> </div> </article> <script> $(function () { var loadingTime = new Date(); var timeoutMsec = 3 * 1000; var longTimeoutMsec = 10 * 1000; var imgNode = "<img src='//static.nicepage.com/images/social/icont-attention.png'/>"; var calculateScrollPercents = function() { var s = $(window).scrollTop(), d = $(document).height(), c = $(window).height(); var scrollPercent = (s / (d - c)) * 100; return scrollPercent; }; var showStickyFooter = function () { if (calculateScrollPercents() > 20 && !$('.subscribe-modal').hasClass('show')) { $('.subscribe-modal').addClass('show'); } }; var isEmail = function(email) { var regex = /^([a-zA-Z0-9_.+-])+\@(([a-zA-Z0-9-])+\.)+([a-zA-Z0-9]{2,4})+$/; return regex.test(email); }; var hideTooltip = function () { var emailInput = $('.email-input'); if (emailInput.data('ui-tooltip')) {//if tooltip has been initialized emailInput.tooltip('option', 'content', '').tooltip('close').tooltip('disable'); } } var timerId = null; var hasScrollbar = document.body.scrollHeight > document.body.clientHeight; if (!hasScrollbar) { timerId = setTimeout(function () { $('.subscribe-modal').addClass('show'); clearTimeout(timerId); timerId = null; }, longTimeoutMsec); } var emailInput = $('.email-input'); emailInput.attr("title", " "); emailInput .tooltip({ tooltipClass: 'top', position: { my: 'left top+10', at: 'left bottom' } }) .tooltip("disable") .on('mouseout focusout', function (event) { event.stopImmediatePropagation(); }) .on('input', hideTooltip); $('.subscribe-close').on('click', function () { $('.subscribe-modal').removeClass('show'); $.cookie("HideStickyFooter", 1, { expires: 180 }); }); $('.subscribe-btn').on('click', function (e) { e.preventDefault(); $('.error').hide(); var email = $('.email-input').val(); if (!isEmail(email)) { var tooltipContent = 'Enter a valid email address'; $('.email-input') .tooltip('option', 'content', imgNode + "<span style='margin-left: 10px;'>" + tooltipContent + '</span>') .tooltip('enable') .tooltip('open'); return; } $('#subscribe-form').submit(); }); $(window).on('scroll', function() { if ($.cookie("HideStickyFooter")) return; hideTooltip(); var currentTime = new Date(); if (currentTime.getTime() - loadingTime.getTime() > timeoutMsec) { if (!timerId) showStickyFooter(); } else if (!timerId) { timerId = setTimeout(function () { showStickyFooter(); clearTimeout(timerId); timerId = null; }, timeoutMsec - (currentTime - loadingTime)); } if (calculateScrollPercents() < 20 && $('.subscribe-modal').hasClass('show')) { $('.subscribe-modal').removeClass('show'); if (timerId) { clearTimeout(timerId); timerId = null; } } }); }); </script> <div class="subscribe-modal" data-backdrop="false"> <button type="button" class="subscribe-close"></button> <div class="content subscribe-form-holder"> <h1>Join Us</h1> <p>Get free website builder. Easy drag-and-drop.<br/> Choose from 15,000+ Templates.</p> <form method="post" id="subscribe-form" action="/Editor/Account/RegisterByEmail?returnUrl=%2Fdoc%2F428506%2Fintroduction&source=Article"> <input class="email-input" type="text" name="email" placeholder="Enter your email address"> <input class="subscribe-btn" type="submit" value="Join"> </form> </div> <div class="subscribe-success"> <div class="content"> <h2>Thanks for subscribing!</h2> </div> </div> </div> </section> <div id="push"></div> </div> <div class="footer"> <div class="footer-top"> <div class="container"> <style> .footer-top a { color: #ddd !important; font-size: 16px; } </style> <div class="row"> <div class="col-md-2 col-sm-6 col-xs-12"> <h6>Company</h6> <ul> <li><a href="/Terms">Terms of Use</a></li> <li><a href="/Privacy">Privacy Policy</a></li> <li><a href="/Agreement">License Agreement</a></li> <li><a href="/About">About Us</a></li> <li><a href="/partners">Partners</a></li> <li><a href="/Abuse">Abuse</a></li> <li><a href="/Forum/Topic/Create">Contact Support</a></li> </ul> </div> <div class="col-md-2 col-sm-6 col-xs-12"> <h6>Product</h6> <ul> <li><a href="/doc/frequently-asked-questions-16656">FAQ</a></li> <li><a href="/download">Download</a></li> <li><a href="/features">400+ Features</a></li> <li><a href="/affiliates">Affiliates</a></li> <li><a href="/doc">Documentation</a></li> <li><a href="/forum">Forum</a></li> <li><a href="/blog">Blog</a></li> </ul> </div> <div class="col-md-3 col-sm-6 col-xs-12"> <h6><a href="/templates">Themes & Templates</a></h6> <ul> <li><a href="/website-templates">Website Templates</a></li> <li><a href="/wordpress-themes">WordPress Themes</a></li> <li><a href="/html-templates">HTML Templates</a></li> <li><a href="/css-templates">CSS Templates</a></li> <li><a href="/joomla-templates">Joomla Templates</a></li> <li><a href="/html5-template">HTML5 Templates</a></li> <li><a href="/one-page-template">One Page Templates</a></li> </ul> </div> <div class="col-md-3 col-sm-6 col-xs-12"> <h6>Nicepage</h6> <ul> <li><a href="/website-builder">Website Builder</a></li> <li><a href="/html-website-builder">HTML Website Builder</a></li> <li><a href="/wordpress-website-builder">WordPress Website Builder</a></li> <li><a href="/joomla-page-builder">Joomla Page Builder</a></li> <li><a href="/wysiwyg-html-editor">WYSIWYG HTML Editor</a></li> <li><a href="/static-site-generator">Static Site Generator</a></li> <li><a href="/html-code">HTML Code Generator</a></li> </ul> </div> <div class="col-md-2 col-sm-6 col-xs-12"> <h6>Web Design</h6> <ul> <li><a href="/website-design">Website Designs</a></li> <li><a href="/web-page-design">Web Page Designs</a></li> <li><a href="/ecommerce-templates">eCommerce Designs</a></li> <li><a href="/landing-page">Landing Pages</a></li> <li><a href="/homepage-design">Homepage Designs</a></li> <li><a href="/website-mockup">Website Mockup</a></li> </ul> </div> </div> </div> </div> <div class="footer-bottom"> <div class="container"> <div class="row"> <div id="footer-links" class="footer-inline col-sm-12 pull-right"> <div style="white-space: nowrap; float: left; text-align: left;"> <div class="row"> <div class="col-sm-3"> <a href="https://facebook.com/nicepageapp" rel="noreferrer" target="_blank" style="margin-right: 10px;"> <svg x="0px" y="0px" viewBox="0 0 112.2 112.2" style="width: 24px;"> <circle fill="#3B5998" cx="56.1" cy="56.1" r="55"></circle> <path fill="#FFFFFF" d="M73.5,31.6h-9.1c-1.4,0-3.6,0.8-3.6,3.9v8.5h12.6L72,58.3H60.8v40.8H43.9V58.3h-8V43.9h8v-9.2 c0-6.7,3.1-17,17-17h12.5v13.9H73.5z"></path> </svg><span style="position: relative;top: -7px;margin-left: 5px;">Facebook</span></a> </div> <div class="col-sm-3"> <a href="https://twitter.com/NicepageApp" rel="noreferrer" target="_blank" style="margin-right: 10px;"> <svg x="0px" y="0px" viewBox="0 0 112.2 112.2" style="width: 24px;"> <circle fill="#55ACEE" class="st0" cx="56.1" cy="56.1" r="55"/> <path fill="#FFFFFF" d="M83.8,47.3c0,0.6,0,1.2,0,1.7c0,17.7-13.5,38.2-38.2,38.2C38,87.2,31,85,25,81.2c1,0.1,2.1,0.2,3.2,0.2 c6.3,0,12.1-2.1,16.7-5.7c-5.9-0.1-10.8-4-12.5-9.3c0.8,0.2,1.7,0.2,2.5,0.2c1.2,0,2.4-0.2,3.5-0.5c-6.1-1.2-10.8-6.7-10.8-13.1 c0-0.1,0-0.1,0-0.2c1.8,1,3.9,1.6,6.1,1.7c-3.6-2.4-6-6.5-6-11.2c0-2.5,0.7-4.8,1.8-6.7c6.6,8.1,16.5,13.5,27.6,14 c-0.2-1-0.3-2-0.3-3.1c0-7.4,6-13.4,13.4-13.4c3.9,0,7.3,1.6,9.8,4.2c3.1-0.6,5.9-1.7,8.5-3.3c-1,3.1-3.1,5.8-5.9,7.4 c2.7-0.3,5.3-1,7.7-2.1C88.7,43,86.4,45.4,83.8,47.3z"/> </svg><span style="position: relative;top: -7px;margin-left: 5px;">Twitter</span></a> </div> <div class="col-sm-3"> <a href="https://youtube.com/nicepage?sub_confirmation=1" rel="noreferrer" target="_blank" style="margin-right: 10px;"> <svg x="0px" y="0px" viewBox="0 0 112.2 112.2" style="width: 24px;"> <circle fill="#D22215" cx="56.1" cy="56.1" r="55"></circle> <path fill="#FFFFFF" d="M74.9,33.3H37.3c-7.4,0-13.4,6-13.4,13.4v18.8c0,7.4,6,13.4,13.4,13.4h37.6c7.4,0,13.4-6,13.4-13.4V46.7 C88.3,39.3,82.3,33.3,74.9,33.3L74.9,33.3z M65.9,57l-17.6,8.4c-0.5,0.2-1-0.1-1-0.6V47.5c0-0.5,0.6-0.9,1-0.6l17.6,8.9 C66.4,56,66.4,56.8,65.9,57L65.9,57z"></path> </svg><span style="position: relative;top: -7px;margin-left: 5px;">YouTube</span></a> </div> <div class="col-sm-3"> <a href="https://www.pinterest.com/nicepagecom/pins" rel="noreferrer" target="_blank" style="margin-right: 10px;"> <svg x="0px" y="0px" viewBox="0 0 112.2 112.2" style="width: 24px;"> <circle fill="#CB2027" cx="56.1" cy="56.1" r="55"></circle> <path fill="#FFFFFF" d="M61.1,76.9c-4.7-0.3-6.7-2.7-10.3-5c-2,10.7-4.6,20.9-11.9,26.2c-2.2-16.1,3.3-28.2,5.9-41 c-4.4-7.5,0.6-22.5,9.9-18.8c11.6,4.6-10,27.8,4.4,30.7C74.2,72,80.3,42.8,71,33.4C57.5,19.6,31.7,33,34.9,52.6 c0.8,4.8,5.8,6.2,2,12.9c-8.7-1.9-11.2-8.8-10.9-17.8C26.5,32.8,39.3,22.5,52.2,21c16.3-1.9,31.6,5.9,33.7,21.2 C88.2,59.5,78.6,78.2,61.1,76.9z"></path> </svg><span style="position: relative;top: -7px;margin-left: 5px;">Pinterest</span></a> </div> </div> </div>  <div class="copy">© 2024 Nicepage Free Website Builder Software - All Rights Reserved</div> </div> </div> </div> </div> </div> </body> </html>

CINXE.COM

Introduction - Nicepage Documentation