# FAQs

### General

<details>

<summary>How to disable the mosaic animation effect when loading images</summary>

To disable the lazy-loading effect for images, simply turn off **Enable Image Lazy Loading** in the **Animations** section of **Theme settings**.

[animations](https://en-ascent.webvista.studio/global-settings/animations "mention")

</details>

<details>

<summary>Does the Ascent theme support custom badges?</summary>

We provide badges for **Sold Out**, **Sale**, **Pre-order**, **New Arrival**, **Gift**, and **Limited Edition**. You can customize the badge text by modifying the **theme's default content**.

![](https://3086053958-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUtxdyhQYbUmYMEm4SSNh%2Fuploads%2FEr1cABtD5kwugAndY7Yw%2Fimage.png?alt=media\&token=e3e77073-ece1-4fde-b6c5-55c982059c49)

If you want to add other custom badges, please contact us, and our technical team will assist you.

[support-policy](https://en-ascent.webvista.studio/support-policy "mention")

</details>

<details>

<summary>How to change the background color of a page</summary>

You can control the background color, text color, and button color of the entire page by adjusting **Scheme 1** in the **Colors** settings under **Theme settings**.\
![](https://3086053958-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUtxdyhQYbUmYMEm4SSNh%2Fuploads%2Fs9hXmh5kNRXfIjPVqBiZ%2Fimage.png?alt=media\&token=0474d67f-349a-4af1-b3ae-fd8e4cf36f84)

</details>

<details>

<summary>How to Add Custom Payment Icons</summary>

If you are using a third-party payment service (e.g., Airwallex), Shopify will not automatically display the payment method icons. You need to manually add these icons by modifying the code. Detailed steps can be found [custom-payment-icons](https://en-ascent.webvista.studio/footer/custom-payment-icons "mention")

</details>

<details>

<summary>How to Handle Third-Party Plugin Element Obstruction of Mobile Menus</summary>

We can resolve the obstruction of mobile menus by third-party plugin elements by increasing the menu's z-index level.  [mobile-menu-obstruction-by-third-party-plugins](https://en-ascent.webvista.studio/header/mobile-menu-obstruction-by-third-party-plugins "mention")

</details>

<details>

<summary>Why the filter on the collection page is not working?</summary>

Shopify limits filtering when a collection contains more than **5,000 products**. We recommend splitting the large collection into smaller collections and distributing the products across them.

</details>

### Header

<details>

<summary>How to prevent dropdown menu links from redirecting to a new page</summary>

To disable link redirection for dropdown or Mega menus, you can set the link to "/" or select the homepage as the link.

</details>

<details>

<summary>How to Remove the Underline from a Transparent Header</summary>

You can find the "Hide bottom line" option under "Header" > "Transparent header settings." Simply uncheck it to remove the underline.

</details>

### Footer

<details>

<summary>How to remove the "Powered by Shopify" text in the footer</summary>

* **Log in to your Shopify Admin:** Use your admin account to log in to your Shopify Admin.
* **Go to Theme Settings:** In the sidebar menu, navigate to **Online Store > Themes**.
* **Access Theme Editor:** Under the **Current Theme** section, click **Actions > Edit default theme content**.

  <div align="left"><figure><img src="https://3086053958-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUtxdyhQYbUmYMEm4SSNh%2Fuploads%2FIAtfDvBEgaLkHGvq2vp8%2Fimage.png?alt=media&#x26;token=d0e47e10-eeed-4235-8520-d8beee3bffbc" alt=""><figcaption></figcaption></figure></div>
* **Search for "Powered by Shopify":** Use the search bar at the top to type **"Powered by Shopify"**, and locate the corresponding text field.
* **Delete the Text:** First, enter any content into the field and save it. Then, clear the text in the field and enter a single space instead; the "Powered by Shopify" logo will then be removed.
* **Save Changes:** Click the **Save** button in the upper-right corner to apply the changes.

</details>

### Product

<details>

<summary>How to display category metafield data on the product page</summary>

![](https://3086053958-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUtxdyhQYbUmYMEm4SSNh%2Fuploads%2FJ6WNHqCKnzATgJOakxOq%2Fimage.png?alt=media\&token=6e6c2da2-27a7-4217-9de0-2e4b726518c3)

Turn on the **Show category metafield table** on the product template page, and the category metafield data will be displayed automatically.

</details>

<details>

<summary>How to display custom metafield data on the product page</summary>

Add a block: **Custom Attribute**, then select Dynamic Source for the content and choose the custom meta field to display.

![](https://3086053958-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUtxdyhQYbUmYMEm4SSNh%2Fuploads%2FLavCaEeLxZALJVSIYan8%2F1741053281314.jpg?alt=media\&token=071adc60-8432-4d43-b229-026f6ca1df31)

![](https://3086053958-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUtxdyhQYbUmYMEm4SSNh%2Fuploads%2Fn63MQ6z9md5ZCaSEy7oT%2Fimage.png?alt=media\&token=5e7f4244-f90e-4f06-9841-811c4ce8cbc6)

</details>

<details>

<summary>How to display a product size chart using custom metafields</summary>

![](https://3086053958-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUtxdyhQYbUmYMEm4SSNh%2Fuploads%2FtCjobAaoPhM5zK3yJVbj%2Fimage.png?alt=media\&token=e0cd8dd1-42bc-4bf8-b9ca-de06afe4dba9)

Add a **Popup** block, then set the content to either text or an image, select the **dynamic source**, and choose the created size chart metafield.

[size-chart](https://en-ascent.webvista.studio/pages/main-product/size-chart "mention")

</details>

<details>

<summary>How to display color samples and image samples for variants</summary>

To enhance the shopping experience, you can display color and image samples for product variants, allowing customers to visualize options more effectively.

For more details, please refer to [variant-samples](https://en-ascent.webvista.studio/pages/main-product/variant-samples "mention")

</details>

<details>

<summary><strong>How to Add Complementary Products</strong></summary>

Use the **Shopify Search & Discovery** app to add complementary products and enhance the customer shopping experience. For detailed steps, see [complementary-products](https://en-ascent.webvista.studio/pages/main-product/complementary-products "mention")

</details>

<details>

<summary><strong>How to Display Related Products</strong></summary>

Add a related products section to the product page to showcase related items. For details, see [related-products](https://en-ascent.webvista.studio/pages/main-product/related-products "mention")

</details>

<details>

<summary>How to Create a Product A+ Page</summary>

Create an Independent and Customizable Product Page.This page will be highly flexible, supporting personalized content layouts and responsive design. For further details, please refer to [product-a+-page](https://en-ascent.webvista.studio/pages/main-product/product-a+-page "mention")

</details>

<details>

<summary><strong>How to Set Up Back-in-Stock Notifications?</strong></summary>

You can create an automated workflow that sends a notification to subscribed customers when a product is restocked. Here’s how to set it up:

#### **Step 1: Install the Required Apps**

* **Shopify Flow** (for creating automation workflows)
* **Seguno Email Marketing** or **Klaviyo** (for sending email notifications)

#### **Step 2: Create a Flow Automation**

1. Go to **Shopify Admin > Apps > Flow**
2. Use the built-in Flow template by searching for **"Send a back in stock notification"**
3. Follow the setup instructions, including installing **Seguno Email Marketing**
4. In Seguno (or Klaviyo), create an email template for back-in-stock notifications

</details>

**If the solution above does not resolve your issue, please contact us.**

{% content-ref url="support-policy" %}
[support-policy](https://en-ascent.webvista.studio/support-policy)
{% endcontent-ref %}
