# Home

To get started with the app's features, make sure to install the add-on in your Shopify store and then enable it from the Dashboard section. Once the add-on is enabled, you can begin designing your mobile app.

### <mark style="color:blue;">1. User Greeting Text</mark>

Displaying a greeting text on your mobile app to welcome your visitors can help your app engage visitors and enhance their shopping experience. This friendly not makes visitors feel valued and creates a positive first impression.

<figure><img src="https://922942541-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIGRcMuVZCEGNibOl1OmW%2Fuploads%2F6uuHcs3raAyVPN6QHNq2%2Fimage.png?alt=media&#x26;token=5a30a97e-60cb-4075-8467-fbee57c251a8" alt=""><figcaption></figcaption></figure>

* **Main Text -** Enter the text that you want to display for your visitors. You can also configure to display the name of the customer if they are logged in to your app already.
* **Sub Text -** If you want to add a small message for your customer, you can configure that in this field.

### <mark style="color:blue;">2. Banners</mark>

Add banners to your mobile shopping app to promote sales, advertise new arrivals, highlight discounts, and share important information.&#x20;

These banners attract visitors' attention, encouraging them to explore the site further and leading to increased engagement and sales by directing customers to specific products or promotions.

<figure><img src="https://922942541-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIGRcMuVZCEGNibOl1OmW%2Fuploads%2FYFTvnjI1hcDyYFEy5ucG%2Fimage.png?alt=media&#x26;token=1f897818-0308-4803-b2ee-5f009a5f672c" alt=""><figcaption></figcaption></figure>

* **Style Settings -** Select **grid** if you want to show your banners in grid style and **slider** if you want your banners to be in slider form.&#x20;
  * **Slide view -** For slide view, you are provided with 3 options: **one slide view**, **flat slide view**, and **brand view**.
  * **Height -** Set your desired height for the banner section.
  * **Banner Title -** Set a title for the banner field.
  * **Object Fit -** Select how you want to showcase your collection field.
* Add the banner images by selecting the **Create New Banner** button. The banners that you add in this field will be later displayed on your app.

### <mark style="color:blue;">3. Brand Images</mark>

You can put pictures of the brands you sell here. You can choose to add logos, product pictures, or other images.&#x20;

Showing these pictures can help people recognize and trust the brands. Putting up nice brand pictures can make the online shopping experience better and help you sell more.

<figure><img src="https://922942541-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIGRcMuVZCEGNibOl1OmW%2Fuploads%2FEwKFldvkFD80QaRs0YJa%2Fimage.png?alt=media&#x26;token=8aa9e40d-9651-4cff-a18b-69a33513c365" alt=""><figcaption></figcaption></figure>

* Add the brand images that you provide to your store. You can add as many brand images as you want.
* Adjust the height and width of the field as per your need.
* **Brand Title -** Select if you want to hide or show the title name.
* **Object fit -** Select the fit of the field.

### <mark style="color:blue;">4. Search Box</mark>

This option allows you to include a search box on your homepage so customers can easily find what they're looking for. You can customize the text inside the search box to suit your preferences.

<figure><img src="https://922942541-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIGRcMuVZCEGNibOl1OmW%2Fuploads%2Fx3fUSbIT2kCUKPgWxP1M%2Fimage.png?alt=media&#x26;token=56f0e70f-fe65-4c4d-a9cb-6162b72b5671" alt=""><figcaption></figcaption></figure>

### <mark style="color:blue;">**5. Collections**</mark>

You can use this field to display your store collections on the homepage of your app. Showcasing specific collections can attract your target audience and guide potential customers to items that match their interests.

<figure><img src="https://922942541-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIGRcMuVZCEGNibOl1OmW%2Fuploads%2Fue1WstglxfbYWl87QL86%2Fimage.png?alt=media&#x26;token=6d3eff3a-2a6d-45dc-9e7d-57efb81603bd" alt=""><figcaption></figcaption></figure>

* **Height of image -** Set the height of the image.
* **Width of image -** Set the width of the image.
* **Image Styles -** Choose whether you want your collection's details in **square** or **circle** shape.
* Choose whether you want to show the field title, name or image of the collection, or if you want to give shadow to the image.
* Add the collections by selecting the **Add New Collection** button.

### <mark style="color:blue;">6. Products</mark>

You can use this section to display your products, such as best-sellers, new arrivals, and discounted items. You can choose a grid or slider format. Showcasing products on your homepage grabs visitors' attention and encourages them to explore more.

<figure><img src="https://922942541-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIGRcMuVZCEGNibOl1OmW%2Fuploads%2FUz7eU0U8a2FHIrOjvtZY%2Fimage.png?alt=media&#x26;token=abbff201-a0ad-4761-a599-af459cbd453c" alt=""><figcaption></figcaption></figure>

* Select the style as to how you want to display your products: **gird** or **slider.**
* Select the products that you want to add by selecting **Add New Products**.
* Select how you want to display your collections. You must also select how many collections you want to show on your app. With this, you can set the height and width of the collections section.

### <mark style="color:blue;">7. Collection Products</mark>

This feature highlights collection products on your homepage, promoting specific items and improving user navigation for increased engagement and conversions.

<figure><img src="https://922942541-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIGRcMuVZCEGNibOl1OmW%2Fuploads%2FOCg0j3C0fcfnrgLQoShX%2Fimage.png?alt=media&#x26;token=e5d2f3eb-66c3-4a55-a56a-be2cb5952a1d" alt=""><figcaption></figcaption></figure>

* Set the number of how many products you want to show on your app from your selected collection.

### <mark style="color:blue;">8. Collection Group</mark>

This is the features that allows you to showcase your collection products in group, making it easy for users to access your collections easily.

<figure><img src="https://922942541-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIGRcMuVZCEGNibOl1OmW%2Fuploads%2Ftaepa6aNv7zP5hJxQqd1%2Fimage.png?alt=media&#x26;token=5921d86d-53f1-42a6-956c-12374e17ef00" alt=""><figcaption></figcaption></figure>

Select the collection that you want to showcase and set a title name for the same.

<figure><img src="https://922942541-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIGRcMuVZCEGNibOl1OmW%2Fuploads%2F7RdmVC8nIQJ1mG8OIT2w%2Fimage.png?alt=media&#x26;token=bef9819c-3f16-408e-8d90-76409a8b7253" alt=""><figcaption></figcaption></figure>

### <mark style="color:blue;">9. Text</mark>

You can use this field to include your brand tagline or any other creative text on your homepage alongside engaging visuals and enticing text.

<figure><img src="https://922942541-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIGRcMuVZCEGNibOl1OmW%2Fuploads%2Fu14mPAqMBbY10C0gRo6m%2Fimage.png?alt=media&#x26;token=24dd457a-14f3-471e-ac9b-894539d538d8" alt=""><figcaption></figcaption></figure>

* **Text -** Enter the text that you want to display for your visitors.
* **Font Size -** Set the font size of your text.
* **Font Color -** Select the color you want for your font.
* **Background color -** Select the color of your text's background.
* Set the alignment of your text: **Center**, **Left** and **Right**.

### <mark style="color:blue;">10. Countdown Timer</mark>

Use a countdown timer on your website to create urgency and encourage engagement. It's versatile for promoting limited-time offers, product launches, or events and can increase conversions.

<figure><img src="https://922942541-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIGRcMuVZCEGNibOl1OmW%2Fuploads%2Fi7ouqlM5mSpqIVVOPJ0s%2Fimage.png?alt=media&#x26;token=cb629427-bc44-4bed-90b2-6332a41d8a12" alt=""><figcaption></figcaption></figure>

* Set the start and end times of your sale offer by adding the main and sub-text. You can also set the text and background color.

**Save** your changes and proceed.