Store Feedback and Not getting Sales From my Ads

[EagleHunted]

Hello everyone,

I’d appreciate feedback on my store. Despite running ads on Facebook and Instagram, I haven’t made any sales. Initially, my homepage was the landing page, but customers were visiting without making purchases or completing their carts. I switched the landing page to feature the dress collection I’ve been promoting on social media. However, it seems customers are still leaving immediately upon opening the collection. I suspect this might be due to issues with the landing page or the default Shopify collection page. Any advice would be appreciated.

Thank you in advance.

https://www.shopeaglestore.com/

[INA_MSWEB]

Hi @EagleHunted Here’s a detailed solution to help improve your store’s performance and address the issues you’re facing:

1. Landing Page Optimization:

   • Ensure your landing page is visually appealing with high-quality images and a clean, engaging layout. Use eye-catching banners and clear, concise text to draw attention.
   • Include prominent CTAs that guide visitors towards making a purchase, such as “Shop Now,” “View Collection,” or “Add to Cart.”

2. Page Load Speed:

   • Large images and bulky scripts can slow down your website. Use tools like TinyPNG or ImageOptim to compress images without losing quality.
   • Use tools like Google PageSpeed Insights or GTmetrix to identify and fix performance issues.

3. Product Descriptions and Reviews:

   • Ensure that your product descriptions are detailed, highlighting the key features and benefits of the products. Use bullet points for easy readability.
   • Display customer reviews and testimonials prominently on your product pages to build trust and credibility.

4. User Experience (UX):

   • Simplify the checkout process by reducing the number of steps and ensuring it is intuitive and user-friendly.
   • Ensure that your website is fully optimized for mobile devices, as a significant portion of traffic comes from mobile users.

The Coupon Discount on Cart app can improve the shopping experience on your store and drive conversions. The app automatically applies available discounts at the cart page, eliminating the need for customers to manually search for and enter coupon codes. This convenience can reduce cart abandonment and encourage customers to complete their purchases. By prominently displaying discounts at the cart page, you can create a sense of urgency and value for customers. This visibility of savings can motivate customers to proceed with the purchase. Customers appreciate the seamless experience of having discounts applied automatically. This convenience can lead to higher satisfaction rates, positive reviews, and repeat business.

By optimizing your landing page, page load speed, product descriptions, and using the Discount app, you can create a more seamless shopping experience that encourages customers to complete their purchases.

If you have any further questions or need additional assistance, feel free to ask.

Best Regards,

Ina

[mageplaza-cs]

Hi @EagleHunted ,

I am from Mageplaza - Shopify solution expert.

I would be happy to review your website and provide feedback on the performance.

Here are my recommendations to improve your conversion rate:

Your website isn’t effectively converting visitors into buyers despite your advertising efforts. Without seeing your ads, I can’t offer detailed recommendations on your landing page. However, here are some suggestions from Databox that you might find useful. You can read more in their article.

“When the click-through rate (CTR) is high but the conversion rate is low, it usually indicates an issue with the landing page. This is often due to a lack of effective calls-to-action (CTAs). To address this, create a clear CTA, such as a “Buy Now” or “Read More” button. This CTA can be a clickable image with a small amount of text or a simple button.”

1. Monitor Your Cart Abandonment Rate

Additionally, a high cart abandonment rate can be particularly frustrating for your business, especially after investing significantly in attracting visitors to your site. This issue indicates that many potential customers are deciding not to complete their purchases, contributing to low conversion rates.

To address this, you can remind customers about the items left in their carts and encourage them to complete their purchases by:

• Email Reminders: Send emails to customers who abandon their carts, reminding them of their items.
• Incentives: Offer a discount or free shipping to motivate them to finalize their purchases.
• For more detailed guidance, refer to an article from the Shopify Help Center

2. Improving the speed and performance on mobile and desktop

• I checked your website performance on PageSpeed Insights - a Google tool that measures the website performance and found that scores on mobile, where a high number of the traffic is coming from, is around 3x while the performance score on mobile should ideally be above 6x.
• Also, on the desktop , the score is around 7x while the expected score should be above 8x.

• Slow loading speeds affect various aspects related to user behavior and business outcomes, ultimately leading to lower conversion rates. Here is some suggestion:
• For Shopify stores, the following are several factors that impact website performance
• Store theme
• The apps installed
• Any additional third-party code you’ve manually added to your store, including tag managers and the tags within them- Here are some tips that you can use to improve your site performance:
• Use compressed images
• Optimize use of Shopify apps
• Or consider professional help
• You can check here more advice from Shopify

Besides, here are some suggestions regarding the UX/UI:

3. Homepage

3.1. Banner

The current banners are too general, you should use a high-quality, eye-catching hero banner with a clear value proposition and a strong call-to-action (CTA). Highlight any ongoing sales, new arrivals, or bestsellers. Below is a reference:

3.2. Adjusting text and spacing

Please check these and fix them. Make sure your text is the same style, same spacing and display well on both desktop and mobile. It will provide a professional impression to customers, encouraging them to buy your products.

4. Search bar

• You should enhance the search by making larger product images, including price information, rating etc to enhance shopping experience.
• Adding search by brand, search by collection to improve search bar
• Below is a reference:

5. Category page

Add more filter options like color, material, on sale, new arrivals, etc., to enhance customer experience, save time customer searching for products and therefore improve conversion rates. Here is a reference:

6. Related products

• You should add ATC, add to wishlist, quick view buttons to encourage customers to buy your products
• Here is a reference:

I hope some of my suggestions are helpful, feel free to give me any feedback.

Good luck!

[EagleHunted]

Hi @mageplaza-cs

Thank you for your feedback. I’m facing several issues with my website that I’d appreciate your help with:

1. Page Insights: The scores for mobile (47) and desktop (82) fluctuate inconsistently despite my efforts to optimize. How can I stabilize these scores? I checked my website score approximately 12 hours ago and noticed that the score for mobile devices was 47, while the score for desktops was 82. I am unsure why there is such a discrepancy in the scores. It seems that every time I make improvements for mobile devices, the desktop score decreases and vice versa.

2. CTA Button: I’m using the default Shopify collection page. Where i can add a CTA button?

3. Image Size in Search Bar: How can I increase the image size within the search bar?

4. Abandoned Checkout: Despite using automation with a 10% discount, customers aren’t returning. I’ve also added discounts in the header and product pages.

5. Currency Issues: Customers see the prices in their local currency until checkout they pay with (US dollars) Shopify said because I’m not using Shopify payment so I added the code at the header of my home page and product page to encourage the customers to make a purchase.

6. Banner Image: I can’t change the template’s default space as the Ecomposer team said. What type of picture would best replace the current banner images?

Your assistance would be greatly appreciated!

[EagleHunted]

Hi @INA_MSWEB

Thank you so much for your feedback

[EagleHunted]

Hi @mageplaza-cs I have removed the space gap on mobile, but there have been no noticeable changes. The speed score is fluctuating for both mobile and PC.

[INA_MSWEB]

Hi @EagleHunted I understand the challenges you are facing and am here to provide expert advice to help resolve these issues. Also, I will explain how our Shopify app- Coupon Discount on Cart app can aid in improving your website’s performance and customer engagement.

1. Page Insights

• The fluctuating scores for mobile (47) and desktop (82) can be attributed to various factors such as image optimization, code structure, and third-party apps. To stabilize these scores:
• Optimize Images: Ensure images are compressed and optimized for web use. Tools like TinyPNG can help reduce file sizes without losing quality.
• Minimize JavaScript and CSS: Reduce render-blocking resources. Use tools like Google PageSpeed Insights to identify and fix issues.
• Lazy Loading: Implement lazy loading for images and videos to improve loading times, especially on mobile devices.
• Evaluate Third-Party Apps: Disable or replace heavy third-party apps that may be slowing down your site.

2. CTA Button

• To add a CTA button on your default Shopify collection page:
• Go to Online Store > Themes and click Customize.
• Navigate to the Collection pages section.
• Add a Custom HTML section or use the Rich Text section to insert a button with a call to action.

3. Image Size in Search Bar

Increasing the image size within the search bar typically requires custom CSS:

search-bar img {
width: 50px; /* Adjust size as needed */
height: auto;
}
Add this CSS code to your theme’s stylesheet under Online Store > Themes > Edit code and find the theme.scss.liquid or theme.css file.

4. Abandoned Checkout

• Even with automation and discounts, improving your abandoned checkout recovery rate can involve:
• Personalized Emails: Customize the abandoned cart email with personalized recommendations and dynamic content.
• Exit-Intent Popups: Use popups that offer discounts or free shipping when a user is about to leave the site.
• Retargeting Ads: Implement retargeting ads on social media and Google to remind users of their abandoned carts.

5. Currency Issues

• The currency discrepancy is likely due to the payment gateway settings. Since you are not using Shopify Payments, ensure your store’s currency converter is configured correctly:
• Use a Currency Converter App: Install an app that supports multiple currencies and displays prices consistently throughout the shopping experience.

6. Banner Image

• To replace the current banner images effectively:
• Use High-Quality, Relevant Images: Choose images that resonate with your brand and audience.
• Consistent Branding: Ensure the images align with your brand’s color scheme and style.
• Call to Action: Include text overlays with clear CTAs to guide visitors.

How Shopify Coupon Discount on Cart App Help?

• Display available discounts directly in the cart, encouraging users to complete their purchases.
• Simplify the checkout process by automatically applying discounts, reducing the need for customers to search for coupon codes.
• By showing available discounts upfront, the app can reduce cart abandonment rates and increase conversion rates.

For more details on the app, visit MS - Coupon Discount on Cart. I hope this helps address your concerns. If you need further assistance or have any other questions, feel free to reach out or DM us.

Best regards,

Ina

[mageplaza-cs]

Hi @EagleHunted , thank you for your reply. Please revise my information below:

1. Since desktop and mobile share the same source code, issues affecting both platforms are common. You need to implement optimization solutions for both devices, or at least ensure that changes do not negatively impact the other device. The discrepancy arises because mobile screens are smaller than desktop screens, so HTML elements that are fine on desktop might be problematic on mobile. For instance, image size: a 900x1200 image might be acceptable for desktop but too large for mobile. In such cases, we need two differently sized images for the same HTML position to suit both devices.

2. You can follow these instructions to add an “Add to Cart” button:

From Shopify Admin select Online Store and click on Themes Choose your main theme Click the . . . on the top left-right (see below) and hit Edit code Open Snippets -> product-card-grid.liquid File and paste below code at the end of the page. <form method="post" action="/cart/add"> <input type="hidden" name="id" value="{{ product.variants.first.id }}" /> <input min="1" type="number" id="quantity" name="quantity" value="1"/> <input type="submit" value="Add to cart" class="btn" /> </form>

Please note that this solution applies to the default theme, so if you are using a different theme, you may need to modify a different file. We need to know which theme you are using to check this (in case you are using a free theme).

3. Please follow these instructions:

4. In your Shopify Admin go to online store > themes > actions > edit code

5. Find Asset >theme.css and paste this at the bottom of the file:
   a.predictive-search__item.predictive-search__item–link-with-thumbnail.link.link–text { grid-template-columns: 8rem 1fr; }
   img.predictive-search__image { width: 100%; height: 100%; }
   https://i.imgur.com/dYMxKwn.png

6. We are not sure which Ecomposer answer you are referring to. However, if it is about the home page banner, you should use a webp format image file with a size appropriate for each device.

I hope this will be work for you. Thank you!

[EagleHunted]

Hi INA & @mageplaza-cs

Thank you for reaching out and providing feedback. Regarding the CTA button on my default Shopify collection page, could you please confirm if this example aligns with what you had in mind? I’ve attached screenshots for your reference.

Regarding checkout and cart abandonment, as well as the currency issue, I’ve made some updates. Previously, I implemented a code on the product page to encourage purchases. Now, I’ve automated this process and added a note on both the product page and website header, ensuring customers know the discount is applied automatically. This note will be translated into French and German when customers select these languages.

Additionally, I’ve conducted a retargeting campaign aimed at customers who visited the website, added items to their cart, or abandoned their checkout. My goal is to minimize reliance on third-party apps and codes, following insights that recommend reducing their impact on my theme’s performance.

Currently, I’m using Dawn theme version 14 and plan to update it to version 15.0. I also utilized the Ecomposer page builder app, which advised optimizing the banner image size to 1920x500 pixels and removing section gaps to enhance website loading speed. Despite these efforts, I’ve encountered challenges with achieving significant improvement in speed. I also had an old code that is not working with theme version 15 for my footer. The code was for adding a “Soon” badge next to our brand. It worked in version 14, but after updating to version 15, it stopped working. Do you know how I can fix this issue? Thank you in advance for your assistance

[INA_MSWEB]

Hi @EagleHunted I’ve reviewed the attached screenshots and your comprehensive update on the changes you’ve implemented. Here are some specific suggestions to further improve your store layout, address the current challenges, and highlight how our Shopify app can be beneficial.

1. CTA Button Alignment: The CTA buttons on your collection page appear clear and strategically placed. Ensure that the text is compelling and encourages immediate action, such as “Shop Now” or “Grab Your Discount.”
2. Loading Speed Optimization: Optimizing banner images to 1920x500 pixels and removing section gaps are excellent steps. Consider using tools like TinyPNG to compress image sizes further without losing quality. Additionally, leverage Shopify’s built-in image optimization features and consider using lazy loading for images below the fold.
3. Theme and Code Issues: For the “Soon” badge issue with version 15 of the Dawn theme, you may need to adjust the custom code to match the new theme’s structure. Ensure that the HTML and CSS classes used in your custom code align with those in the updated theme version. Reviewing the theme’s documentation or consulting with a Shopify expert can provide targeted solutions.
4. Multilingual Note for Discounts: Translating the discount note into French and German is a great approach to cater to international customers. Ensure the translations are clear and professionally done to maintain credibility.
5. Coupon Discount on Cart App Benefits: To enhance customer experience and increase sales, integrating the Coupon Discount on Cart app. The app simplifies the discount application process by displaying available discounts directly on the cart page. Easily set up various discount types (e.g., percentage, fixed amount) and apply them based on cart value or specific product combinations. Visible discounts and incentives on the cart page can motivate customers to complete their purchases, boosting conversion rates and overall sales. Providing a seamless discount application experience enhances customer satisfaction, encouraging repeat purchases and positive reviews.

Additional Recommendations:

1. Retargeting Campaigns: Continue with your retargeting campaigns aimed at cart abandoners. Use personalized email marketing and dynamic ads to remind customers of the items left in their carts and the discounts they can avail themselves of.
2. Performance Monitoring: Regularly monitor your site’s performance using tools like Google PageSpeed Insights and Shopify’s performance analytics. This will help you identify areas that need improvement and track the impact of changes over time.
3. User Feedback: Actively seek feedback from your customers regarding the new updates and discount processes. Use this feedback to make continuous improvements.

I hope these suggestions help you enhance your store to achieve better sales performance. If you need further assistance or have any questions, please feel free to reach out.

Best regards,

Ina

[mageplaza-cs]

Hi @EagleHunted ,

Regarding the CTA, yes, that what I recommend you.

Regarding the code for adding a “Soon” which does not work, could you please share with me? Our team will check and see if there is anything we can help.

[EagleHunted]

Hi @INA_MSWEB

Thank you for your detailed and comprehensive feedback. Regarding Lazyload, I’ve researched various resources suggesting it’s not able to improve loading speed. I’ve experimented with this multiple times, observing varying outcomes—sometimes it enhances speed significantly, while other times, results are inconsistent. Do you recommend enabling it specifically for content below the fold within the scrolling area ? Thank you

[EagleHunted]

Hi @mageplaza-cs

Thank you for your feedback and here’s the completed code :

If you want to add a label or badge, please follow the steps below:

Step 1: Navigate to Online Store → Navigation → Find your footer menu that is displayed on the homepage. Then, go inside and find “Our Brand”. Insert this code: Soon.

Step 2: Navigate to Online Store → Themes → Edit Code. Find the base.css file and paste the following code at the end of the file:

.label-soon{

padding: 2px 10px;

background-color: #009fd3;

color: #fff;

border-radius: 5px;

margin-left: 10px;

}

Here is the code for changing the footer background color

footer.footer.color-scheme-1.gradient {

background-color: red;

}

If you want another color, simply change the name from “red” to “yellow”.

If you want to remove a line on hover in the footer, here is the code.

.footer-block__details-content .list-menu__item–link:hover{

text-decoration: none;

}

And here is the code for changing the Desktop background color

sticky-header.header-wrapper.color-accent-2.gradient {

background-color: red;

For your footer issue, here is the updated code:

.footer-block__details-content .list-menu__item–link:hover{

text-decoration: none !important;

}

After updating to version 15.0 of the theme, none of the previously mentioned codes have proven effective. If I update to version 15.0, will this code, along with other CSS additions I’ve made, be automatically removed? Could leaving this code impact my website’s loading speed, or would removing it potentially reduce the impact of third-party codes on my site? I’m just trying to improve the speed to reduce the Cart abandonment rate especially while running Ads.

[mageplaza-cs]

Hi @EagleHunted

This appears to be a CSS issue. Could you please let us know if you have a development site where we can check and fix it? You can send us a DM if you want.

Adding or removing this code should not significantly impact your page load speed. The code is not redundant and doesn’t affect other elements of the site much.

[EagleHunted]

Hi @mageplaza-cs

What is the acceptable hero banner size for mobile? I am currently using 1920*500 for desktop and have adjusted it for mobile, but Google PageSpeed Insights are indicating that it is too large for mobile. I do not have a development site, as it is the same website. I have reached out to all app developers to address the impact of their third-party codes on my theme, but the issue persists on mobile despite modifications.

[mageplaza-cs]

Hi @EagleHunted ,

Regarding your mobile banner size, Google PageSpeed Insights evaluates performance based on a Moto G Power screen, so the recommended size is 412*186. Please refer to this image for more details: https://i.imgur.com/wVsx2bS.png.

For the third-party JavaScript issue, consider deferring the loading of these scripts until after the main content has loaded, or only load them based on user interaction (e.g., scroll, click, mouse movement). You can contact the app developers for further assistance.

[EagleHunted]

Hi @mageplaza-cs
Thank you for your ongoing assistance, I have noticed that the 412x186 size of my mobile banner may be too small. Will it be blurred if I use it on mobile? I couldn’t attach the picture after I resized it to the recommended dimension. Also, could you please advise me on how to defer the loading of Javascript? I will be reaching out to the app developers to see if they can address this issue, as they have not been able to reduce the impact of their 3rd party codes on my theme. I have already removed the apps whose developers did not reduce their scripts from my theme. Thank you.

[mageplaza-cs]

Hi @EagleHunted ,

Regarding the image size, 412x186 is not too small for mobile use, as mobile screens typically measure around 412x823. This size should be sufficient to cover the mobile screen effectively.

For optimizing JavaScript loading, you can handle it as follows:

• The JavaScript files loaded from theme extensions are inserted into the page by Shopify using a Liquid variable called “content_for_header.” Every theme includes this variable in the head section.
• Consider adding a Liquid snippet to your theme to read this variable and alter the JavaScript file insertion, allowing you to defer their loading.
• It would be best to contact the extension support team to handle the removal of JavaScript files when there is no user action.

[EagleHunted]

Hi @mageplaza-cs

Hello,

Thank you for your assistance. It appears to be related to technical details. I’ll see what I can do. I have reached out to the Avada team developers to inquire if they can minimize the impact of their third-party codes on my theme. I am currently awaiting their feedback.

[mageplaza-cs]

Hi @EagleHunted ,

Thank you for your reply. If you have any other concerns, please let us know directly in this topic, or feel free to send us a DM or email. Have a nice day!