You can manage Products on the Products Panel and assign them to the Payment Button Element or output them into the Product List or Details page templates and elements.
Add Products
Click the Add Product button or Plus icon at the Panel's top to add a Product.
Default Products
There are default products for new websites for convenience. The Products Panel is not empty when creating a new website.
Manage Products
Click on the Element In the Product List and Details Elements to open the Edit Product dialog.
You can set the Old Price to the Product Dialog.
Product Images
You can add, order, and delete the Product Images in the Product dialog. The first Image is set as featured or default.
You can move Images in the Edit Product dialog.
Currency List
We have added almost all the World's currencies to the Currency List. Now, you can find all currencies supported by Stripe.
If you use PayPal and a currency is not supported, the Products with such currencies will be disabled in the Shopping Cart.
Currency Sign Position
For the British Pound, Japanese Yen, etc., we now support the correct position of the currency sign at the Price, Sum, and Total for all currencies.
Assign Product
You can assign a Product in the Properties to the selected Payment Button in the Editor.
Product Sorting
You can sort Products by clicking the Sorting icon at the top of the Panel and choosing the Sorting Parameters from the list.
Sorting And Pagination On Product List
With the Nicepage Source, you can enable Sorting and pagination for the product list page template and Element.
The Sorting and Pagination work together and are supported for HTML, WordPress, and Joomla E-Commerce websites.
Show Sorting On Product List
You can show and stylize the Sorting in the Property Panel for the selected Product List Element on a page or the Product List Page Template.
Show Pagination On Product List
You can also show and stylize the Pagination for the Product List Element on a page and the page template.
Change Sorting On Live Store
Your customers can change the Sorting for a Product List on your live E-Commerce websites made with Nicepage.
Product Search
You can search for Products and see them in the results.
Product Pages In Link Settings
For the Link Settings of the Menu, Button, or Hyperlink, you can use options to connect to Product Page Templates.
The Product Page Templates can output Products, which you add on the Products Panel. You can customize Product Page Templates in the Templates Panel.
Link to Product List Page Template
You can link the Menu Item, Button, or Hyperlink to the Product List page.
- Add a Button.
- Open the Link Settings dialog.
- Select the Page Option.
- In the Page option, select the Product List to open a page with Products.
Please read about the Product List Template for more information.
Link to Product Details Page Template
You can also link Menu Item, Button, or Hyperlink to an individual Product. In the Link Settings dialog, select the Product option and then the Product in the Products field.
Please read about the Product Details Template for more information.
Build A Menu From Products
When you edit the first Product, the Store link is automatically added to the Menu.
You can also link the Product List and Product Details Pages in the Menu, for example, the following Menu.
You can build the Menu and Submenu items from Product Pages like the following.
Manage Products On Context Toolbar
You can open the Products Panel by clicking the Manage Products button on the Context Toolbar of the Product List Element.
Currency Symbol Automatically
The Currency Symbol is shown automatically based on the user's locale. For example, for the Switzerland, it will show CHF.
Export Products
In the Export dialog, you can see the new "Include E-Commerce Products" checkbox, which allows you to publish and export the Products.
Publish Or Export HTML
You will export or publish the following HTML pages for Nicepage Hosting.
- The Product List and Product Details templates
- The Products from the Products Panel
The files are created for the Product List and individual pages, for example, /products/products.html and /products/pepperoni-pizza.html, as follows.
Export For WordPress Or Joomla
The Products from the Products Panel will be imported with the Content import to WordPress or Joomla websites, on which you should have WooCommerce or VirtueMart installed correspondingly.
NOTE: You should have the "Include E-Commerce Templates" and "Include E-Commerce Products" checkboxes checked in the Publish and Export dialog.
Import Products To WordPress and Joomla
You can import the Products added to the Products Panel to the WordPress WooCommerce plugin and Joomla VirtueMart extension.
You should check the Import Products checkbox during the Installation in the Wizard.
In WordPress:
In Joomla:
Products On Product Templates
The Product List and Product Details Template on the Templates Panel now show the Products added in the Products Panel.
Products With Nicepage Theme Only
We also show Products without importing the Content from the Desktop Application. You can link a Button or Hyperlink in the Header or Footer to the Product Page Template. Then, export only the Theme from the Desktop Application and import it to the WordPress or Joomla website.
IMPORTANT! You install the Theme without the Editor Plugin. Therefore, the Product Items on the Menu still need to be created. You should add the links to your E-Commerce Store pages manually.
For example, you can add a link to your Product List with the Button added to the Header.
You can manage Products on the **Products Panel** and assign them to the [Payment Button](page:425789) Element or output them into the Product List or Details page templates and elements. ## Add Products Click the Add Product button or Plus icon at the Panel's top to add a Product. !add-product.png! ### Default Products There are default products for new websites for convenience. The Products Panel is not empty when creating a new website. !default-products.png! ### Manage Products Click on the Element In the Product List and Details Elements to open the Edit Product dialog. !edit-product-click.gif! You can set the Old Price to the Product Dialog. !old-price-product-dialog.png! ### Product Images You can add, order, and delete the Product Images in the Product dialog. The first Image is set as featured or default. !product-images.png! You can move Images in the Edit Product dialog. !move-product-images.gif! ### Currency List We have added almost all the World's currencies to the Currency List. Now, you can find all currencies supported by Stripe. If you use PayPal and a currency is not supported, the Products with such currencies will be disabled in the Shopping Cart. !currency-list-expanded.png! ### Currency Sign Position For the British Pound, Japanese Yen, etc., we now support the correct position of the currency sign at the Price, Sum, and Total for all currencies. !currency-position.png! ## Assign Product You can assign a Product in the Properties to the selected Payment Button in the Editor. !select-product.png! ## Product Sorting You can sort Products by clicking the Sorting icon at the top of the Panel and choosing the Sorting Parameters from the list. !product-sorting.png! ## Sorting And Pagination On Product List With the Nicepage Source, you can enable Sorting and pagination for the product list page template and Element. The Sorting and Pagination work together and are supported for HTML, WordPress, and Joomla E-Commerce websites. !sorting-pagination.png! ### Show Sorting On Product List You can show and stylize the Sorting in the Property Panel for the selected Product List Element on a page or the Product List Page Template. !product-sorting.png! ### Show Pagination On Product List You can also show and stylize the Pagination for the Product List Element on a page and the page template. !product-pagination.png! ### Change Sorting On Live Store Your customers can change the Sorting for a Product List on your live E-Commerce websites made with Nicepage. !product-sorting-live-site.png! ## Product Search You can search for Products and see them in the results. !products-search.png! ## Product Pages In Link Settings For the Link Settings of the [Menu](page:82280), [Button](page:243504), or [Hyperlink](page:110462), you can use options to connect to Product Page Templates. The Product Page Templates can output Products, which you add on the Products Panel. You can customize Product Page Templates in the Templates Panel. ### Link to Product List Page Template You can link the [Menu](page:82280) Item, [Button](page:243504), or [Hyperlink](page:110462) to the Product List page. 1. Add a Button. 2. Open the Link Settings dialog. 3. Select the Page Option. 4. In the Page option, select the Product List to open a page with Products. Please read about the [Product List Template](page:102300) for more information. !products-page-link.png! ### Link to Product Details Page Template You can also link [Menu](page:82280) Item, [Button](page:243504), or [Hyperlink](page:110462) to an individual Product. In the Link Settings dialog, select the Product option and then the Product in the Products field. Please read about the [Product Details Template](page:102304) for more information. !product-link.png! ### Build A Menu From Products When you edit the first Product, the Store link is automatically added to the Menu. !store-menu-automatically.gif! You can also link the Product List and Product Details Pages in the Menu, for example, the following Menu. !products-in-menu.png! You can build the Menu and Submenu items from Product Pages like the following. !menu-links-products.png! ## Manage Products On Context Toolbar You can open the Products Panel by clicking the Manage Products button on the Context Toolbar of the Product List Element. !manage-products-toolbar.gif! ## Currency Symbol Automatically The Currency Symbol is shown automatically based on the user's locale. For example, for the Switzerland, it will show CHF. !swiss-franc-automatically.png! ## Export Products In the Export dialog, you can see the new "Include E-Commerce Products" checkbox, which allows you to publish and export the Products. !include-ecommerce-products.png! ### Publish Or Export HTML You will export or publish the following HTML pages for Nicepage Hosting. - The Product List and Product Details templates - The Products from the Products Panel The files are created for the Product List and individual pages, for example, */products/products.html* and */products/pepperoni-pizza.html*, as follows. ### !export-html-products.gif! ### Export For WordPress Or Joomla The Products from the Products Panel will be imported with the Content import to WordPress or Joomla websites, on which you should have WooCommerce or VirtueMart installed correspondingly. **NOTE:** You should have the **"Include E-Commerce Templates"** and "Include E-Commerce Products" checkboxes checked in the Publish and Export dialog. !export-products-wordpress.png! ## Import Products To WordPress and Joomla You can import the Products added to the Products Panel to the WordPress WooCommerce plugin and Joomla VirtueMart extension. You should check the Import Products checkbox during the Installation in the Wizard. In WordPress: !import-products-wordpress.png! In Joomla: !import-products-joomla4.png! ## Products On Product Templates The Product List and Product Details Template on the Templates Panel now show the Products added in the Products Panel. !products-product-list-template.png! ## Products With Nicepage Theme Only We also show Products without importing the Content from the Desktop Application. You can link a Button or Hyperlink in the Header or Footer to the Product Page Template. Then, export only the Theme from the Desktop Application and import it to the WordPress or Joomla website. **IMPORTANT!** You install the Theme without the Editor Plugin. Therefore, the Product Items on the Menu still need to be created. You should add the links to your E-Commerce Store pages manually. For example, you can add a link to your Product List with the Button added to the Header. !products-theme.gif! ##