Edit Layout

By clicking on Edit button of any Layout, you will be redirected to the “Edit Layout” page with different blocks displayed on the left side:

> Featured Categories

> Products Grid

> Products Horizontal Slider

> Banner Offer Slider

> Recently Accessed Products



There are 5 blocks provided to set layout of app. You can add any block by clicking on Plus icon .


Note: You can add only one block for Featured Categories and Recently Accessed Products and for other blocks, you can add unlimited blocks in layout for app’s home page.


Being an Admin, you will have full control to manage and customize the homepage.


By clicking on ‘Edit’ icon , you can edit the Layouts and by clicking on ‘Remove’ icon, you can remove the Layout.



> Featured Categories


You can select N-Number of products in Featured Categories block on Home Page layout of app.


Blocks will be horizontally slidable.


By clicking on ‘Edit’ icon , a popup window will open named Edit Featured Category Block.


Here you can add and manage the category blocks as per your need.


As per the configuration in the Edited Featured Category Block, the horizontal slider of the ‘Featured categories’ will display in the home page layout of the Mobile app.


You can Add / Edit following fields for the Featured Category Block:


Select Display Type: Select the Category image display. There are two options: Square and Circle.


Featured Category Block Title: Inset the name of the Title to display in home page layout of the app.


Add New Featured Category: By clicking on the Add New Featured Category button, the Featured category related options will appear.


Now, add the category details and select the category:


Category Title: Insert Category Title.


Select Image Type: Upload from the local drive or insert URL of image to display.


Status: Select the status, ‘Enabled’ or ‘Disabled’.


Select Category: Select the category for which you want to display the block.


Sort Order: Insert the position of the category to display in the slider.


Note: Categories will appear in the drop-down option as per the configured from Catalog -> Categories.


After inserting the information, click on Save button to save the details.


The record will be displayed on the Featured Category list.



> Products Grid


You can display the products in grid view by selecting the products from Magento Backend.


You must select minimum 4 products to display in Product Grid.


You can select N-Number of products for Product Grid.


More button will be displayed to check more products from the Product Grid in app.


By clicking on ‘Edit’ icon , a popup window will open named Edit Product Grid.


Here, you can insert the details regarding Product Grid and select the images which you want to display on Product Grid in App.


Component Title: Add a relevant Title which will be displayed above product grid block in app.


Select Product Type: You will have the two options to choose products to be displayed:


From a Category :
As you select From a Category, you must select the Category from the ‘Select Category’ dropdown and select products based on selected category.


Custom Products:
By selecting this option, you will have whole list of products and from that list, select the products which you want to display under the product grid in app.


By clicking on Save Button, product selection will be saved and displayed in the application.


> Product Horizontal Slider


Configuring from Magento backend, you can display the products which are Best seller, New arrival and many other products in horizontal view in the app.


By clicking on ‘Edit’ icon , a popup window will open named Edit Product Horizontal Slider.


Insert the details which you want to display in the app:


Component Title: Insert the name of Product Horizontal Slider.


Select Product Type: Select required Product Type. You will have the option to choose products based on your need.


Best Seller Products: Bestselling products based on the sales will be displayed.


New Products: Newly arrived products will be displayed. You can display new products based on category wise and default.


From a Category: Products will be displayed based on the selected categories from the backend.


Custom Products: As you select the ‘Custom Products’, you will get the list of the products.


By clicking on Save Button, product selection will be saved and displayed in the application.



> Banners/Offers Slider


You can display the Banners of new collection or product discount Offers on the home page of app.


By clicking on ‘Edit’ icon , a popup window will open named Edit Banner Slider.


If banners are already created, you will get the list of Banners with the details in the end.


You can edit/delete those banners as per your need.


Insert and select the following details to display the Banners/Offers in the app:


Banner Title: Insert relevant title related to Banner or Offer.


Select Image Type: Select URL of image or Upload from the local drive.


Status: Enable/Disable the Banner slider.


Type: You will have three type to manage the content of banners:


Category: If you select the Category, app user will be redirected to product listing page based on selected Category here.


Product: If you select the Product, app user will be redirected to the Product detail page based on Product selection here.


Offer: User will be redirected to the browser view in app as per inserted URL.


After inserting and selecting the details, click on Save You will get the slider in the app.



> Recently Accessed Products


You can add a block of Recently Accessed Products in Home Page layout. It will display the last 20 products in horizontal slider view.


> Mange Sequence of Blocks


You can also manage all the blocks with preferred sequence.


You can reorder any of the block by dragging up-down position.


Based on the sequence, you will get your App’s Home page.



Post a Comment