Berry Theme Documentation

Berry Theme Documentation

Berry is your finest pick if you're looking for a theme that's perfect for your food business. This fantastic theme is ideal for a wide range of websites, including organic food, natural health products, food blogs, natural medicinal items, as well as any bakery, restaurant, ice cream shop, coffee shop, grocery store, and so on. Berry has thought of everything! It includes a pre-designed homepages as well as new components that may be utilized to present your company in the best possible light. Berry is the subject for you if you're interested in healthy cuisine, cosmetics, or health products in general. You may easily set up an online food store to sell food, groceries, and a variety of natural products.

Berry is a responsive theme created by nopStation. This guide contains all of the information needed to customize a nopCommerce application utilizing the theme's capabilities. These features are enabled by the theme's 12 plugins. The installation procedure, as well as a detailed description of the plugins, will be covered in the sections below

FEATURES

  • Supported versions 4.20 - 4.40
  • Responsive UI design
  • Blog, forum and news pages styled
  • RTL (Right-To-Left) Support
  • Multi-Store/ Multi-Vendor Support
  • Open to modification on public view
  • All major browsers have been tested and is supported
  • It's fully localizable and adaptable to any language
  • The theme includes a number of handy plugins that will enhance your e-commerce site with "out of the box" functionalities
  • Plug and play theme
  • Provided support and upgrade with new nopCommerce release

INSTALLATION

  • Download the NopStationBerry from our store https://nop-station.com/customer/downloadableproducts
  • Go to Configuration » Plugins from the Admin dashboard
  • Click on the Upload plugin or theme button and a popup will appear asking to navigate to the file that contains the theme
  • Upload your desired version that is NopStationBerry44.zip, NopStationBerry43.zip or NopStationBerry42.zip
  • Install and enable all the 12 plugins whose Group name is ‘Nop Station’. It is important to install and confirm that all plugins are configured properly to get the desired behavior of the theme. For any convenience, please contact us as early as possible
  • To get these plugins, search by the group name. Then install the Nop-Station Core plugin
  • Now install the Nop-Station Berry Theme and do not forget to enable it
  • Then install all the other plugins
  • To make the plugins functional, restart the application
  • To know how to install and enable a plugin, go to nopCommerce documentation describing this topic
  • Disable/Delete Nivo Slider plugin completely to get the expected view on the homepage

ENABLE THEME

  • Go to Configuration » Settings » General settings in the admin panel
  • Choose Berry Theme as the Default store theme
  • To make the theme functional, restart the application

ENABLE PLUGINS

  • Go to the plugins list
  • Search the plugins associated to this theme by using the Group Name Nop Station
  • Locate and click the Edit button for the plugin to be enabled for example, ‘Mega Menu'
  • In the pop-up window, tick the checkbox named Is enabled and click Save

LICENSE KEY

  • After buying the theme, one should contact nopStation for the licence key and it will be sent through an email. The contact info is available here
  • If anyone tries to configure the theme or bundled plugins for the first time, s/he will be redirected to a page prompting to enter the Product Key. It can also be entered by going to Dashboard » Nop Station » Core Settings » License

THEME PLUGIN

  • Berry theme plugin is the heart of the theme. There are several features which can be configured by this plugin. Following is the way by which this plugin can be configured
  • The configuration page can be accessed by going to Dashboard » Nop Station » Themes » Berry » Configure

nopStation - Berry

  • Enable image lazy-load: If you want to lazy-load for product box image check this box
  • Lazy-load picture: From here you can choose a picture from your device and upload it. This picture will be displayed initially in the product box. Upload picture size should not be more than 4-5 KB
  • Show picture on order completed page: Determines whether design image will be displayed on order completed page or not
  • Order completed page picture: From here you can choose a picture from your device and upload it. This picture will be displayed in the order completed page
  • Show supported cards picture at page footer: Determines whether the supported card picture will be displayed on page footer or not
  • Supported cards picture: With this, you can choose a picture from your device and upload it. This single picture of supported cards should be expected image height 30 px
  • Show logo at page footer: Determines whether the logo will be displayed on page footer or not
  • Footer logo: With this, you can choose a logo from your device and upload it. This single logo should be expected image height 40 px
  • Footer email: Specify email which will be displayed in at page footer
  • Custom CSS: Custom CSS for your website can be written in this section. It will be rendered in the head section of the HTML page

ABOUT THE PLUGINS AND CONFIGURATION

  • The theme contains 9 plugins in total. Except for Berry theme plugin, all the features of the other plugins are described in below

nopStation - Blog News

  • This plugin allows the administrators to configure the display options on the homepage News display. The configuration page can be accessed by going to Dashboard » Nop Station » Blogs and News » Settings. Admin user can add news images and author name which will show at the homepage

nopStation - Anywhere Slider

  • This plugin enables the administrators to manage homepage sliders. Sliders can be added, edited, and deleted from the configuration page which can be accessed by going to Dashboard » Nop Station » Anywhere slider » List in the admin panel
  • Note:
  • A slider must be saved with a name and a widget-zone before containing any item
  • Sliders with widget-zone ‘home_page_before_best_sellers’ can have a background image and an Alt text for it
  • A slider can contain multiple slider-items where each item has a picture, a title, a subtitle, a URL, and a display order

nopStation - Mega Menu

  • This plugin allows the administrators to configure the menu to be shown on the top with multiple levels. The configuration page can be accessed by going to Dashboard » Nop Station » Mega Menu » Settings in the admin panel
  • Configurable Features:
  • Number of categories to be shown
  • Maximum category level
  • Show the total number of products in a category
  • Show the total number of products in a sub-category
  • Which categories to show
  • Whether to show the category image in the menu
  • Whether to show the sub-category image in the menu
  • Number of manufacturers to be shown
  • Which manufacturers to show
  • Whether to show the manufacturers image in the menu

nopStation - O carousel

  • This plugin allows the administrators to customize different carousels to be shown on different widget-zones. The configuration page can be accessed by going to Dashboard » Nop Station » OCarousel » Manage OCarousels in the admin panel
  • Configurable Features:
  • A display order which will be effective if there are multiple carousels on the same widget-zone
  • Whether the carousels should slide automatically
  • The number of items to be shown at a time
  • The sliding direction. By default, it is set to left-to-right but can be configured to be right-to-left
  • A custom CSS class name can be set to be applied on a carousel
  • Note:
  • A carousel representing a data source of products type can have a background image. A background image can have the picture itself, a comment to be shown on hover, a URL to be redirected to on click, and Alt text

nop-station - Quick View

  • This plugin enables the administrators to configure the ability to have a quick-view from a product box with zoom effect without actually going to the details page. The zoom effect is configurabl from its configuration page. Its configuration page can be accessed by going to Dashboard » Nop Station » Quick View » Configure in the admin panel
  • Features:
  • Enable/disable the QuickView widget
  • Enable/disable the enlargement to the product image
  • Enable/disable the ability to show ‘also purchased products’
  • Enable/disable the ability to show ‘related products’
  • Ability to set custom CSS class name for the button container
  • Zoom possition (It is recommended to keep it inside)
  • Smooth move of cursor on zoomed image
  • Smooth move of the cursor on the zoomed image
  • AdjustX and AdjustY zoomed image coordinates
  • Ratio Of Zoomed Image For Width
  • Ratio Of Zoomed Image For Height
  • There are other more options related to the product image zoom on quickview

nopStation - Picture Zoom

  • The product photo zoom plugin allows you to zoom in and out on images to see the products. In the product detail page, customers can zoom in and out. Customers can quickly zoom in and out. It's quite beneficial to your online store. The configuration page of this plugin can be accessed by going to Dashboard » Nop Station » Product Picture Zoom » Configure in the admin panel
  • Configurable Features:
  • Enable picture zoom: Click to enable picture zoom of your store
  • Zoom width: Specifies the width of the zoom of your image in pixels
  • Zoom height: Specifies the height of the zoom of your image in pixels
  • Ltr position type: This is picture zoom position for left-to-right language default value set as right
  • Rtl position type: This is picture zoom position for right-to-left language default value set as right
  • Tint: Enables the Tint property, which allows you to specify a tint color that will cover the image being zoomed. The default is false
  • Lens opacity: Specifies the opacity of the lens mouse pointer, where 0 is fully transparent and 1 is fully opaque
  • Soft focus: Enables a subtle blur effect to the image being zoomed
  • Smooth move: Set the amount of smoothness of the zoomed image as it moves. The higher the number, the smoother/more drifty the movement will be. 1 = no smoothing
  • Show title: If you enabled it gives you options for showing the title tag of the image
  • Title opacity: It is title opacity value
  • Adjust X: With this option, you can fine-tune the horizontal position of the zoom
  • Adjust Y: With this option, you can fine-tune the vertical position of the zoom
  • Image size: It is your image size where you can put image size value
  • Full-size image: This is your full image size default value is 1000

nopStation - PWA lite

  • A typical manifest file includes information about the app name, icons the app should use, the url it should start at when the app is launched, and more. The configuration page can be accessed by going to Dashboard » Nop Station » OCarousel » Manage OCarousels in the admin panel
  • Configurable Features:
  • Picture: From here you can choose a picture from your computer and upload it. Its aspect ratio should be 1:1 (square). The supported format is PNG. For a better view, use a transparent background image
  • Name: From here you can give meaningful progressive web app name
  • Short name: This is for short name of your progressive web app
  • Start Url: From here you can put app start URL. The Start URL will launch when your app starts
  • Application Scope: It defines the set of URLs that the browser consider to be within your app, and it's used to decide when the app when the user has left the app
  • Background color: This property is used on the splash screen when the application is first launched
  • Theme color: It sets the color of the toolbar and may be reflected in the app’s preview in task switchers
  • Display: This is display property from the dropdown list. This property helps to customize what browser UI is shown when your app is launched. For example, you can hide the address bar and browser chrome. Or games may want to go completely full screen

nopStation - Products Ribbon

  • It enables the administrators to configure the various ribbon on the productbox. There are several types of ribbon which are configureable from the admin panel. The configuration page can be accessed by going to Dashboard » Nop Station » OCarousel » Manage OCarousels in the admin panel
  • Configurable Features:
  • Product details widget zone name(Better not to change it)
  • Product box widget zone name(Better not to change it)
  • Enable/Disable "New" ribbon tag for new products
  • Enable/Disable "Discount" ribbon tag for discounted products
  • Enable/Disable "Best Sellet" ribbon tag for best seller products

nopStation - Category Banner

  • To promote products or offers, manage category-specific banners on your nopCommerce store. Category banner plugin will help your store user to view the banner of the category. It displays the banner in the category page. Go to Dashboard ≫ Nop Station ≫ Plugins ≫ Category Banner ≫ Configuration
  • Configurable Features:
  • You can hide/show your content from this configure page
  • You can set the picture size from the banner picture size option
  • If you enable the loop option it will be applied for the banner slider when multiple banners are uploaded for the same banner
  • The nav enable will display the previous and next button in the banner slider when multiple banners are uploaded for the same banner
  • The auto play enables you to animate the slider automatically in the banner slider when multiple banners are uploaded for the same banner
  • It's autoplay interval timeout in millisecond. It will be applied for the banner slider when multiple banners are uploaded for the same banner
  • Auto play hover pause enables pause slider on mouse hover
  • To add vendor banner you need to Go to Catalog ≫ Categories ≫ Edit option of a category. Then add the picture in the banner section

nopStation - Product Tab

  • You may organize your products into collections and display them on your website with Product Tab Plugin. You can display products from a category and categorize them by criteria such as new, sale, featured, bestsellers, and so on. You can also display product groupings from a predetermined list, such as manufacturer or vendor, or construct a custom product list
  • Configurable Features:
  • Enable product tab: Click to enable product tab of your store
  • Go to Admin ≫ Nop Station ≫ Plugins ≫ Product Tab ≫ List
  • In the section, you can show your list of active and inactive tabs. The product tabs list will appear with four columns Name, Widget zone, Active, and Edit
  • Create: To create a new product tab, go to product tab list page Admin » Nop Station » Plugins » Product tab » List and then click Add new button
  • To edit an existing product tab, click on Edit button from carousel list table

nopStation - Vendor Banner

  • Enhancing the vendors is an important criteria of an e-commerce site. Vendor banner plugin will help your store user to view the banner of the vendor. It displays the banner in the vendor page
  • Configurable Features:
  • You can hide/show your content in the public store from this configure page
  • You can set the picture size from the banner picture size option
  • If you enable the loop option it will be applied for the banner slider when multiple banners are uploaded for the same banner
  • The nav enable will display the previous and next button in the banner slider when multiple banners are uploaded for the same banner
  • The auto play enables you to animate the slider automatically in the banner slider when multiple banners are uploaded for the same banner
  • It’s autoplay interval timeout in millisecond. It will be applied for the banner slider when multiple banners are uploaded for the same banner
  • Auto play hover pause enables pause slider on mouse hover
  • To add category banner you need to Go to Customers ≫ Vendors ≫ Edit option of a vendor. Then add the picture in the banner section

nopStation - Core Plugin

  • It's a little plugin with only one property: License
Leave your comment