The goal is to duplicate the existing website's layout design in 5 minutes.

Ensure you can master PythonModule's multiModule group: oneColumn, twoColumn, threeColumn, fourColumn, and sixColumn. Also, the 11 WebAsOne design blocks include the image, imagetext, code, SVG, panel, youtube, youtubetext, tab, slider, and accordion.

Must know

• Use TinyMCE templates.
  • TinyMCE
• Use InsertDesign.
  • E-TinyMCE, SVG
• Use SVG for complicated design
  • Ideal for all screen size
• About TinyMCE
  • The display or colors might differ between the management and live websites. 
• Learn to use the Design red button to help.
• Learn the PythonModule padding adjustment. Use the PythonModule red button to help.

Overview

• Theme color selection and recompile the Bootstrap 4 theme.
• Website background selection. Each page can have its background type.
• Bootstrap 4 navigation customization.
• Bootstrap 4 Panel style selection.
• Understand the meaning of module variable OutputRecords. Use UpdateModuleVar1 to access.

To copy the design of a page, 

• in most cases, you only need to design the home page. Use the insert menu to insert pages.
• for home page
  • identify the number of blocks
  • find the closest WebAsOne design block to use
  • also, copy the background of each block
• select website background
  • none
  • image/svg
  • video
  • colors

• To https website
  • Use ShortCut "A Toggle http or https - use right save."
• Use ShortCut "Copyright" to update copyright
• Learn to use the ShortCuts group "Group: 1 Common."

---

• Colors
  • At the menu-6 screen, click "Update Color."
  • Click the ShortCut Nav, click "Edit 1", and then click Save (Right Save) to recompile the Bootstrap 4 theme. 
• Design Blocks
• More designs
  • TinyMCE
  • Use InsertDesign.
    • E-TinyMCE, SVG
• Navigations Style
  • Click ShortCut "Nav"
  • Click the SelectNavType tab
  • Select and Update
• Slider Animation
  • At the module-6 screen, click M_CodeInc
  • Click 0_kenBurnsEffect
  • Select and Update
• First Block Animation
  • At the module-6 screen, click M_CodeInc
  • Click the 1_firstRow
  • Select and Update
• Scroll Animation
  • At the module-6 screen, click M_CodeInc
  • Click 2_nonFirstRow
  • Select and Update

• Add page titles for all pages.
  • At the menu-6 screen, click "Update Title" and "Update Meta."
• Add meta descriptions for all pages.
  • Goto level 5's Layout to update.

• Are the images in Webp format?
• Run Google's PageSpeed

• Register domain
• Allocating hosting servers
• Create FTP access on the management server
• Go live