Unlocking the Power of Nicepage

This article is my final installment in a four-part series about one of the best web builders: Nicepage. It's not an instructional set of videos. Still, instead, I'm focusing on some of the fantastic features that make this builder a standout for me.

• In video number one, I discuss why NICE pages, subscription plans, and the accompanying desktop app are so effective in helping you design both offline and online. It's one of the features that has made it my go-to choice for all my web development projects.
• In video two, you'll witness the fantastic design features that Nice Page offers, many of which are exclusive to this platform.
• Then in the previous video, I presented the diverse publishing choices that come with a Nicepage desktop app. These include WordPress, HTML, and Joomla. Publishing directly to the Nicepage servers is another choice.
• In this final video, we'll be exploring Nicepage within WordPress. I will show you how to use the plugin that comes with it to get your website up and running in no time. And as a bonus, I'll also share tips on customizing your site online and offline. So let's get started.

Installing the Nicepage Theme

In the last video, I demonstrated the installation of the Nicepage website design in WordPress that I created in the desktop app. I installed it the same way as any other WordPress theme.

We exported the website design to a WordPress zip file from the desktop app. Then, going to WordPress, we select “Appearance” in the menu and “Themes.” We then click on “Add New” followed by clicking on “Upload Theme.” We locate and install the zip file we exported from our desktop app. Once installed, we need to activate our theme and customize it. Now, notice in the main menu on the left the addition of the Nicepage plugin.

Using Nicepage Editor

Now, let's go to “Pages” from the main menu. Hover over the page you want to edit and click “Edit with Nicepage.”

The first thing I want to point out in the editor is that you can do everything within the page editor without leaving it, including:

• Switching to another page
• Creating a new page
• Editing the menu

The image's arrows indicate “Pages” and “Menu Items.” I can do it all right here.

Also, if you don't use an SEO plugin, you can add meta information from the page editor. Notice the image highlighting page settings. I decided to use SEO plugins because they have additional features not included with Nicepage.

You can view all these features demonstrated in the video further down the page.

Browser View of Page

In the second video, I demonstrated several design features in Nicepage. With the page loaded in the browser, we can view those features.

• Animation – View the video and notice the animation in the first two blocks of the page. Trigger these instances by scrolling. Animation can also be triggered by hovering. In either case, there are numerous animations from which to select.
• Grid – A grid in Nicepage is similar to a table in which you can create multiple cells. Each cell can contain images, text, or any other type of content. A significant advantage of the grid is to tie content units together as the page responds to various devices. Otherwise, as a responsive page adjusts for multiple devices (desktop, laptop, tablet, phone), the content can become unstable in its positioning.
• Modal – A modal is a popup that overlays the page. It can have a transparent background that allows the page to show through. You can create any content in a modal. I like to use image slide shows. Create a single image or button as a hyperlink to launch the modal. The modal can display other images.

Modals can be triggered, as mentioned, with a link, timed to launch after the page has loaded, or set to launch when a view shows intent to leave the page.

• Accordion – An accordion is a series of labels with content that ‘accordions' out when you click the label. (Also on the video)
• Tabs – Tabs are similar to accordions. Whereas accordion labels are vertical, tab labels are horizontal, revealing additional content when clicked. (On the video)

Resizing Images

Resizing images is simple on Nicepage. Drag any side or corner of the image and drag it; the image will respond while keeping its aspect ratio. This feature is probably true in any web builder. However, occasionally I will need help sizing an image to fit a particular spot without losing portions of the image I want. I often get around this problem by using HTML.

To use the HTML image tag for an image, I insert an HTML element in the cell or box where I want the picture. I enter a simple image tag in the HTML code, including the image file's location and the width I want. I do not include the height. By doing this, the browser will automatically use the correct height to keep the aspect ratio. The same effect will work by using only the height. I use a percentage rather than a fixed width. In this way, the image will be responsive for different devices. In this way, the image will be in full view.

Editing Between Online and Offline

The last feature I will highlight is the ability to work online and offline with Nicepage. When I speak of working offline, it refers to using the desktop app. The ability to work offline is my favorite feature of Nicepage.

You may wonder why I want to edit offline when I can do everything I need online. I can do everything online, but every change I save will be public once I have published a page. If I make a significant change to a page, I may save the changes at several stages, so I keep them should something go wrong. Each time I make a save, my incomplete work becomes public. Not a very positive image to portray!

Instead, I will make sure the desktop app has the current version of the page and will make my changes in the app. Once the changes are complete, I will export them from the app and import them online. So how do I do that?

Notice where the location of the cursor in the nearby image and the popup menu next to it. This menu is related to the selected block with a blue border. The popup menu lists “Export Block.” Select this and export that particular block to your computer. Then go to the desktop app and open the same page. Select a block and click on the three dots on the left side of the block. Choose to import block and locate the block you just exported from online.

You will need to do this for each block in the desktop app that is not up-to-date. If the same block was already present on the desktop but is outdated, you must delete the obsolete version.

There may be several applications you can make to this feature. Another application would be when you have a block of information on a website page that you want temporarily removed. Using this feature, you could store it on the desktop and then move it back online when you want to display it again.

Conclusion

This article and series conclude. Please use the comment box below if you have questions or comments. Is there a topic you would like me to address in a future article? Share that in the comments.

Be sure to download a free copy of Nicepage and try these features yourself.

---