# Introducing the Shopify app: Pro Navi - Used to create bottom bars, float buttons, and more..

Introducing the new app on Shopify: [Pro Navi - Navigation design](https://apps.shopify.com/pronavi-navigation-design), used to create bottom bars, float buttons, drawers, and more for your website.

This is a powerful and user-friendly toolkit that enables you to create various navigation styles such as Tab bar, Drawer, Rail, Float button, and Menu, catering to each user's specific needs. Why? Because navigation is the most important aspect of a website? Similar to intelligently organizing shelves and pathways in a supermarket, customers will easily make purchase decisions aligned with business goals.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1699504545248/d0e1050c-e7f8-41f1-9d39-7aeac42419ce.png align="center")

### Why Pronavi? Because navigation is the most important aspect of a website?

Similar to intelligently organizing shelves and pathways in a supermarket, customers will easily make purchase decisions aligned with business goals, identify necessary information, share on social media, and become loyal customers by receiving newsletters.

### Pronavi Highlights

* Runs perfectly on both mobile and desktop, but is most effective for “<mark>Mobile-first</mark>”
    
* Extremely flexible, diverse, and <mark>limitless</mark>
    
* Run extremely <mark>lightweight</mark>, continuously optimized, and conflict-free
    
* Daily measurement, user understanding, and easy <mark>A/B testing</mark>
    
* No need for design or technical knowledge, just <mark>drag and drop</mark>
    
* <mark>Free</mark> still performs well until you truly need a higher version
    

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1699504551848/365941f0-c269-4961-829d-01d133a67878.png align="center")

### Pricing

**Starter: FREE**

* Lifetime usage
    
* Up to 2 components
    
* Unlimited kinds of controls
    
* Unlimited feature usage
    
* High-quality infrastructure (99.00% SLA)
    
* Email Support
    

**BUSINESS: $4.99**

* Everything in Free
    
* Unlimited components
    
* Maximize speed
    
* Embedding CSS and JS
    
* Image uploads (JPG, PNG, dynamic GIF)
    
* Data Analysis
    
* 24/7 Support
    

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1699504706996/66a98837-2fb2-43cd-81a1-0c6f00b72be4.png align="center")

## How to start: Really easy

#### Step 1: Design

Click on "Add new component" or edit from the sample components we have already created, and design the content, linkages, and styles for the component as you desire. Pay attention to the display on both mobile and desktop because the presentation on these two platforms is different.

#### Step 2: Deploy

* **Option 1:** Deploy on all pages. This is the option that allows this component to function on all pages (or on select pages if chosen)
    
* **Option 2:** Add a block to a separate page. This is the option that allows this component to be displayed on a specific page by embedding it into the theme. Copy the Embed ID of component then insert to block named "Pronavi - Per page" on Theme customize screen.
    

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1699504835157/b833f41e-df9f-4e4a-a22e-b53cd9935bab.png align="center")

### Demo video

<iframe width="560" height="315" src="https://www.youtube.com/embed/USwHQorxQ3o?si=47qfYmSUJODdyBPt"></iframe>

Start now: [https://apps.shopify.com/pronavi-navigation-design](https://apps.shopify.com/pronavi-navigation-design)