LayoutHub
  • What is LayoutHub?
  • User guides
    • Support
    • Installation
    • Uninstallation
    • Upgrade/Downgrade
    • FAQs
      • How to remove instagram section from Layouthub
      • What is "Pages limit"?
      • When can I "Edit code"?
      • What about "Save section"?
      • What is " Auto save draft"?
      • What is "Integration Services"?
      • How to set the same font between Shopify and LayoutHub?
      • How to custom font and color on LayoutHub?
      • How to set "Page handle or human url"?
      • Connective Button
      • How to save page without publish it
      • How to change the meta SEO for LayoutHub's page
    • Common Issues
    • Layout Management
      • Create Layouts
      • Design Blocks
      • Export & Import
      • Edit Section Code
      • Edit a Layout
      • Assign a Layout
      • Duplicate a Layout
      • Delete a Layout
    • Section builder
    • LayoutHub pages/templates
      • Home Page
        • Create additional Home Page
        • Make an existing page as home page
        • Restore to default Home Page
        • Customize Shopify Home Page
      • Sub-page
        • Contact Form
      • Product Template
        • Product Detail
        • Related Product
      • Collection Template
      • Blog Templates
      • Article Templates
      • Insert section
    • Pricing Plans
    • Settings
      • General
      • Theme Settings
      • Quickview Settings
      • Swatch color settings
      • Third party Apps
        • Product Review
        • Product Wishlist
    • Trash
    • Sale Tools
    • Referrals
    • Integration
      • Add/Edit Profile
      • Add New Contact
      • Export Contact
      • Mailchimp
      • Hubspot
      • ActiveCampaign
      • GetResponse
      • SendGrid
      • Gmail SMTP
      • Google Sheets
      • Omnisend
      • Klaviyo
      • ConvertKit
    • Tracking & Analytics
    • Layouthub & Shopify
    • Translate Apps
    • Recommend apps
      • Avada SEO Optimization
      • Ali Reviews ‑ Product Reviews
      • Ryviu: Product Reviews App UGC
      • Quick View by Secomapp
      • LAI AliExpress Reviews
      • Judge.me Product Reviews
      • Growave - Loyalty, Wishlist, Reviews UGC
      • Opinew Product Reviews
    • Refund Policy
    • Instagram token
  • Development
    • Getting started
    • Tools
      • LayoutHub Kit (for LayoutHub developers only)
      • LayoutHub Kit Extension for Visual Studio Code
    • Layout Structure
    • Reference
      • Engine syntax
        • Deprecated: March 2020
        • Chuẩn template mới - LayoutHub Editor V4
      • Create a section
      • Components
      • Liquid in section
      • Javascript in section
      • Register vendors
      • Settings.js
        • Call-to-action
        • Text
        • Textarea
        • Text Editor
        • Dropdown
        • Checkbox list
        • Checkbox radio
        • Toggle
        • Number slider
        • Number
        • Single image
        • Image library
        • Color picker
        • Icon picker
        • Font picker
        • Background
        • Picker
        • Group fields
Powered by GitBook
On this page
  • Sidebar widget & Real-time preview
  • Responsive Mode
  • Auto Save

Was this helpful?

  1. User guides

Layout Management

A live preview of your design, including all our pre-made designs library. This is where you’ll actually build your layout and it looks exactly like it will look to your visitors.

PreviousCommon IssuesNextCreate Layouts

Last updated 4 years ago

Was this helpful?

When you open the App from the Dashboard you can see recent pages. Click Customize to go the Editor.

Sidebar widget & Real-time preview

Editor is Customizer, you can adjust all the settings on the left sidebar. It shows a list of sections you can use.

You will see a real-time preview of how that abstract design will render on the right-side. You don’t need to save and click preview to see your new design.

With the Live Edit functionality, the changes you make on the sidebar are immediately shown on the Layout without reloading the page.

Responsive Mode

Our Layout are built and tested for automatically device-responsive, but if you want to make sure how they look on each device.

  • Mobile screen size

  • Tablet screen size

  • Desktop screen size

Auto Save

All the changes you make are automatically saved in Editor regardless to loading the page.

For more control over how your design looks, > Click the toggle icons as the device you need to check, to edit its settings. Switch between Full screen, Desktop, Mobile or Tablet views by clicking on the corresponding icons on the top of the view port.

If you love LayoutHub, could you consider posting an review? That would be awesome and really help us to grow our business, here is the

link