Summary

  • Overview
  • Video Tutorial
  • Blocks And Pages
  • Block Presets
  • Block Designs
  • Block Import
  • Search In Block Designs
  • Block Preview

Overview

The blocked layout is essential on modern websites, and you can learn to use Blocks in the Nicepage Applications, WordPress Plugin, Joomla Extension, and Online Editor.

Video Tutorial

Blocks And Pages

Before 2010, most web pages were the height of a monitor screen. Each page corresponds to a site's topic. For example, Home, Services, About, Contacts, and others have links from the Menu. You may watch the video about making a Menu with Nicepage.

Today, it is not convenient, especially for mobile devices. Many modern websites have such pages merged into one long page. Information on those pages is presented in separate parts called Blocks. Since their first appearance, Blocks have become the main building components of Modern Web Design. The unique "SECTION" tag is also used to separate blocks in HTML.

Building a web page out of Blocks is like building a toy tower with LEGO bricks. To create a one-page website, you can have links to Pages and Blocks in the Menu. Please watch the video about One-Page Website Menu.

Block Presets

You can start with a Blank Block, Block Preset, or Block Design. In Nicepage, you can use Block Presets grouped by their functions, such as Text on Image, Contact Form, Contacts, Video, and many others.

  1. Run the Nicepage Application for Windows or Mac OS, WordPress Plugin, or Joomla Extension.
  2. Add a New Website.
  3. Add a Block by clicking the button on the Top Bar.
  4. Select any Preset Category.
  5. Add any Block Preset.

block-categories-reviewed.png

Block Designs

  1. Click the Add Block button.
  2. Go to the Block Designs.

There are also over 10,000 thousand available Blocks Designs. We add Block Designs every day based on thorough research.

  1. The Block Designs are grouped by their functional and thematic use.
  2. Add any Block Design.

You have added the Block Preset and Block Design to your website.

Thumbnails For Large Screens

We have also improved the thumbnails for all Block Presets, making them more readable on large screens, like Retina for Mac.

thumbnails-support-retina.jpg

It is also useful for Windows computers, using more than 100% zoom.

modal-popup-thumbnails.jpg

Boxed And Wide Blocks

You can quickly choose the Block Width in the Property Panel by clicking the Thumbnails for the Width (W) property.

block-width-icons.png

Block Import

You can use the Import Block operation from the Page's Context Menu to import a block without adding an extra block when there are no Blocks on the Page.

import-block-in-page-context-menu.png

Search In Block Designs

You can use the Search for the Block Designs and choose the Thematic Category.

block-design-search.png

Block Design Preview

We have changed the behavior of the full-size preview on the page designs. Now, it hovers over the Zoom icon on the Block Design.

block-design-preview.png

Block Width And Height Properties

We have reworked the Block Width options, making them more obvious and usable.

block-width-options.png

Also, we have added a list of popular values for the Block Height options.

block-height-options.png

Block Margins

The Block Margins are presented as informative icons.

block-margins.png

## Summary - Overview - Video Tutorial - Blocks And Pages - Block Presets - Block Designs - Block Import - Search In Block Designs - Block Preview ## Overview The blocked layout is essential on modern websites, and you can learn to use Blocks in the Nicepage Applications, WordPress Plugin, Joomla Extension, and Online Editor. ## Video Tutorial <iframe width="600" height="340" src="https://www.youtube.com/embed/ZrJHpPD643w" title="Nicepage Blocks" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> ## Blocks And Pages Before 2010, most web pages were the height of a monitor screen. Each page corresponds to a site's topic. For example, Home, Services, About, Contacts, and others have links from the Menu. You may watch the video about [making a Menu with Nicepage](page:82280). Today, it is not convenient, especially for mobile devices. Many modern websites have such pages merged into one long page. Information on those pages is presented in separate parts called Blocks. Since their first appearance, Blocks have become the main building components of Modern Web Design. The unique "SECTION" tag is also used to separate blocks in HTML. Building a web page out of Blocks is like building a toy tower with LEGO bricks. To create a one-page website, you can have links to Pages and Blocks in the Menu. Please watch the video about [One-Page Website Menu](page:84074). ## Block Presets You can start with a Blank Block, Block Preset, or Block Design. In Nicepage, you can use Block Presets grouped by their functions, such as Text on Image, Contact Form, Contacts, Video, and many others. 1. Run the Nicepage Application for Windows or Mac OS, WordPress Plugin, or Joomla Extension. 2. Add a New Website. 3. Add a Block by clicking the button on the Top Bar. 4. Select any Preset Category. 5. Add any Block Preset. ### !block-categories-reviewed.png! ## Block Designs 1. Click the Add Block button. 2. Go to the Block Designs. There are also over 10,000 thousand available Blocks Designs. We add Block Designs every day based on thorough research. 1. The Block Designs are grouped by their functional and thematic use. 2. Add any Block Design. You have added the Block Preset and Block Design to your website. ## Thumbnails For Large Screens We have also improved the thumbnails for all Block Presets, making them more readable on large screens, like Retina for Mac. !thumbnails-support-retina.jpg! It is also useful for Windows computers, using more than 100% zoom. !modal-popup-thumbnails.jpg! ## Boxed And Wide Blocks You can quickly choose the Block Width in the Property Panel by clicking the Thumbnails for the Width (W) property. !block-width-icons.png! ## Block Import You can use the Import Block operation from the Page's Context Menu to import a block without adding an extra block when there are no Blocks on the Page. !import-block-in-page-context-menu.png! ## Search In Block Designs You can use the Search for the Block Designs and choose the Thematic Category. !block-design-search.png! ## Block Design Preview We have changed the behavior of the full-size preview on the page designs. Now, it hovers over the Zoom icon on the Block Design. !block-design-preview.png! ## Block Width And Height Properties We have reworked the Block Width options, making them more obvious and usable. !block-width-options.png! Also, we have added a list of popular values for the Block Height options. !block-height-options.png! ## Block Margins The Block Margins are presented as informative icons. !block-margins.png! ##