What's your biggest current challenge? Have your say in Community Polls along the right column.

Re: My website never looked this organized

Solved

How can I further improve my well-organized website?

GACSTOP
Excursionist
27 1 13

My website -(www.gacstop.com) has never been this organized and beautiful looking, we didn't buy any fancy theme but built with a free Shopify theme. For me, it looks clean, professional, and distraction-free. With that being said, I always think there is room for improvement. Let me know how you like it. Thank you in advance for your input, and happy selling.

Cheers 🙂

Accepted Solution (1)

PageFly-Garcia
Shopify Partner
497 80 137

This is an accepted solution.

Hi @GACSTOP 

 

I’m Garcia, a CRO expert from PageFly - Advanced Page Builder app.

Your store looks really lovely and promising! Still, there’s room for improvement as you mentioned and here I’ll provide you with some suggestions to elevate your storefront visually and potentially improve your store’s CRO in the process, too:

 

1. For the Homepage

  • Consider reducing the height of the header a bit, ideally to the red box I highlighted, since there’s still quite an amount of white space. Also, because you made your header sticky, your smaller header won’t block visitors’ view much as they scroll through your Homepage.

PageFlyGarcia_0-1701077587913.png

  • Optimize hero banner: You’ll want to showcase the best your store can offer in the banner that takes up almost everything your visitors see at first sight. So, consider giving more room for your products’ images. You can either use the 50/50 format (half product, half graphics) or use a full-width image with text overlay. 

PageFlyGarcia_1-1701077605998.png

  • Remove random white spaces here and there: There’s one above benefit section and one above the footer.

PageFlyGarcia_2-1701077634132.png

  • Optimize the benefit section: 
  • Increasing the height of the benefit section since its contained elements are touching the borders,
  • Using uniform set of icons (uniform in style and size) by looking for them on external sources like Flaticon,
  • Double-checking on spelling.
  • Regarding CTA buttons: Consider adding a CTA button to your hero banner since it currently doesn’t have one. Also, consider rewording the CTA for Men’s Wallet as it’s a bit blunt, like “Shop now!” or “Show me!”.

PageFlyGarcia_3-1701079369705.png

While you’re at it, make your CTA buttons dynamic and lively by adding a prominent color to them and implementing an animation on hover and/or on click.

  • Optimize the Featured Product section: Or as you called it “Cyber Monday Sale”. I see that you want to use full-width to give your visitors a full picture, but you’ll need to consider the images themselves, too. Try enhancing your images or choosing different, more HD images so that they display best. If you want to stay with them, consider having this section in a slideshow format.

PageFlyGarcia_4-1701079381349.png

2. For the Collection page

  • Use a “Load more” button: We generally avoid pagination for this because it makes your visitors go through multiple pages to get to where they need. “Load more” allows them to stay on the page and look for what they want with ease.

PageFlyGarcia_5-1701079391857.png

3. For the Product page

  • No need for sticky header: Consider un-sticky your header so that it doesn’t block the view of your products.
  • Use color swatches: Display your variants as color swatches instead of texts so that it helps your visitors visualize what exact color they’re getting.

PageFlyGarcia_6-1701079408342.png

  • Confine your secondary images into a small media list below the hero image: This helps your product page to look neat and helps your visitors easily navigate.
  • Add a prominent color for your ATC button: Preferably black to make it stand out.
  • Put the customers’ reviews section as a standalone one: Currently it’s contained within your product’s description. Consider putting it below your product as a standalone section to avoid your visitors having to scroll much.

Check out one of our pre-made Product page templates to get a clue:

PageFlyGarcia_7-1701079512676.png

4. Take advantage of upcoming holidays

Holiday seasons are nearing, especially Christmas. You might not want to miss out on this time of year to promote what’s best in your store.

Showcase your offerings in a festive vibe by:

  • Adding a promotional hero banner: Besides your current hero banner, add a Christmas hero banner where you show your holiday-themed products, discounts, etc., and have your hero banner section in a slideshow format.
  • Adding a timer: Have your visitor feel the urge to make a quick purchase by adding a countdown timer wherever possible. I suggest on the top of your homepage or as a pop-up box.

See an example template below to easily get going:

PageFlyGarcia_8-1701079540454.png

  • Creating your holiday discount code: This partially helps increase your brand awareness, too. Simply create a discount code that includes your brand’s name/initials and an XMAS suffix, like GACSTOPXMAS or GSXMAS, for example.

 

That’s all from me for now. I dearly hope that you have found my suggestions useful. Feel free to reach out to me if you need any further assistance.

Wishing you lots of luck on your store-building journey!

 

Cheers,

Kate | PageFly Team

Please let me know if it works by giving it a Like or marking it as a solution!


Unlock the secrets to a record-breaking BFCM with PageFly and Canva


➜ Optimize your Shopify store with PageFly Page Builder (Free plan available)


➜ Weekly updated Shopify tutorials on YouTube


All features are available from the Free plan. Live Chat Support is available 24/7.


View solution in original post

Replies 15 (15)

Made4uo-Ribe
Shopify Partner
9110 2177 2686

Hi @GACSTOP 

It look simple. I suggest that make this transparent, so more views for the products.

Made4uoRibe_0-1701033917394.png

 

If this fixed your issue, Likes and Accept as Solution are highly appreciated. Coffee tips fuel my dedication.
Get experienced Shopify developers at affordable rates—visit Made4Uo.com for a quick quote!
Need THEME UPDATES but have custom codes? No worries, for an affordable price.
Create custom Shopify pages effortlessly with PageFly's drag-and-drop ⚙️.
GACSTOP
Excursionist
27 1 13

Thank you for the suggestions. At one point I was looking to make the container transparent, but could not find the right code, so I literally gave up (not a coder!). But just gave another shot again, this time I found the code I was looking for and was able to make the container transparent. I appreciate your time scrolling through my website.

Cheers 🙂

Made4uo-Ribe
Shopify Partner
9110 2177 2686

Welcome, Oh I can help you with that. Check this code. 

.banner__box.gradient {
    background: transparent;
}
.banner__box.gradient * {
    color: white;
}

Paste in your base.css file at the bottom. 

Result:

Made4uoRibe_0-1701121923218.png

I also change the text color, you can change the color you like. I can help with small codes but costumization you need to visit our store. 😅

 

If this fixed your issue, Likes and Accept as Solution are highly appreciated. Coffee tips fuel my dedication.
Get experienced Shopify developers at affordable rates—visit Made4Uo.com for a quick quote!
Need THEME UPDATES but have custom codes? No worries, for an affordable price.
Create custom Shopify pages effortlessly with PageFly's drag-and-drop ⚙️.
GACSTOP
Excursionist
27 1 13

Thank you for your suggestions!

AliReviews
Shopify Partner
773 90 358

Hey GACSTOP,

 

Big congrats on your store! Even if you mentioned it's not on some fancy theme, I must say it's well put together with all the essential elements. I've got a few friendly suggestions to make it even better:

 

1. Keep icons consistent:

Ali Reviews Store Feedback (1).png

Let's stick to a consistent icon style to give your site that pro look. Flat design or outlined icons could do the trick. My favorite websites to search for icons are thenounproject or flaticon. Let’s give them a try!

Ali Reviews Store Feedback (2).png

2. Adjust product grid:

The current product grid seems a bit too big on my screen. It'd be awesome if you could tweak it to show 3-4 products in a row or maybe reduce the width a bit. That way, customers can see the whole product image and name without scrolling too much.

Ali Reviews Store Feedback (4).png

 

3. Show off visual reviews:

Having reviews is fantastic! Since you're in the fashion and accessories game, consider collecting and displaying reviews with photos and videos. It gives customers a real-life feel for your products. You can try out Ali Reviews for that.

Ali Reviews - Product Reviews - Store Feedback (2).png

 

Wishing you a ton of sales this season!

 

Cheers!

- Was my answer helpful? Please hit Like or Mark it as solution!
- Ali Reviews - The must-have Shopify app that empowers you to effortlessly collect, display, and manage product reviews.
- Start your FREE trial today!
GACSTOP
Excursionist
27 1 13

Thank you for your feedback!

 

PageFly-Garcia
Shopify Partner
497 80 137

This is an accepted solution.

Hi @GACSTOP 

 

I’m Garcia, a CRO expert from PageFly - Advanced Page Builder app.

Your store looks really lovely and promising! Still, there’s room for improvement as you mentioned and here I’ll provide you with some suggestions to elevate your storefront visually and potentially improve your store’s CRO in the process, too:

 

1. For the Homepage

  • Consider reducing the height of the header a bit, ideally to the red box I highlighted, since there’s still quite an amount of white space. Also, because you made your header sticky, your smaller header won’t block visitors’ view much as they scroll through your Homepage.

PageFlyGarcia_0-1701077587913.png

  • Optimize hero banner: You’ll want to showcase the best your store can offer in the banner that takes up almost everything your visitors see at first sight. So, consider giving more room for your products’ images. You can either use the 50/50 format (half product, half graphics) or use a full-width image with text overlay. 

PageFlyGarcia_1-1701077605998.png

  • Remove random white spaces here and there: There’s one above benefit section and one above the footer.

PageFlyGarcia_2-1701077634132.png

  • Optimize the benefit section: 
  • Increasing the height of the benefit section since its contained elements are touching the borders,
  • Using uniform set of icons (uniform in style and size) by looking for them on external sources like Flaticon,
  • Double-checking on spelling.
  • Regarding CTA buttons: Consider adding a CTA button to your hero banner since it currently doesn’t have one. Also, consider rewording the CTA for Men’s Wallet as it’s a bit blunt, like “Shop now!” or “Show me!”.

PageFlyGarcia_3-1701079369705.png

While you’re at it, make your CTA buttons dynamic and lively by adding a prominent color to them and implementing an animation on hover and/or on click.

  • Optimize the Featured Product section: Or as you called it “Cyber Monday Sale”. I see that you want to use full-width to give your visitors a full picture, but you’ll need to consider the images themselves, too. Try enhancing your images or choosing different, more HD images so that they display best. If you want to stay with them, consider having this section in a slideshow format.

PageFlyGarcia_4-1701079381349.png

2. For the Collection page

  • Use a “Load more” button: We generally avoid pagination for this because it makes your visitors go through multiple pages to get to where they need. “Load more” allows them to stay on the page and look for what they want with ease.

PageFlyGarcia_5-1701079391857.png

3. For the Product page

  • No need for sticky header: Consider un-sticky your header so that it doesn’t block the view of your products.
  • Use color swatches: Display your variants as color swatches instead of texts so that it helps your visitors visualize what exact color they’re getting.

PageFlyGarcia_6-1701079408342.png

  • Confine your secondary images into a small media list below the hero image: This helps your product page to look neat and helps your visitors easily navigate.
  • Add a prominent color for your ATC button: Preferably black to make it stand out.
  • Put the customers’ reviews section as a standalone one: Currently it’s contained within your product’s description. Consider putting it below your product as a standalone section to avoid your visitors having to scroll much.

Check out one of our pre-made Product page templates to get a clue:

PageFlyGarcia_7-1701079512676.png

4. Take advantage of upcoming holidays

Holiday seasons are nearing, especially Christmas. You might not want to miss out on this time of year to promote what’s best in your store.

Showcase your offerings in a festive vibe by:

  • Adding a promotional hero banner: Besides your current hero banner, add a Christmas hero banner where you show your holiday-themed products, discounts, etc., and have your hero banner section in a slideshow format.
  • Adding a timer: Have your visitor feel the urge to make a quick purchase by adding a countdown timer wherever possible. I suggest on the top of your homepage or as a pop-up box.

See an example template below to easily get going:

PageFlyGarcia_8-1701079540454.png

  • Creating your holiday discount code: This partially helps increase your brand awareness, too. Simply create a discount code that includes your brand’s name/initials and an XMAS suffix, like GACSTOPXMAS or GSXMAS, for example.

 

That’s all from me for now. I dearly hope that you have found my suggestions useful. Feel free to reach out to me if you need any further assistance.

Wishing you lots of luck on your store-building journey!

 

Cheers,

Kate | PageFly Team

Please let me know if it works by giving it a Like or marking it as a solution!


Unlock the secrets to a record-breaking BFCM with PageFly and Canva


➜ Optimize your Shopify store with PageFly Page Builder (Free plan available)


➜ Weekly updated Shopify tutorials on YouTube


All features are available from the Free plan. Live Chat Support is available 24/7.


PageFly-Garcia
Shopify Partner
497 80 137

Hi @GACSTOP 
For the point: 

  • Use color swatches: Display your variants as color swatches instead of texts so that it helps your visitors visualize what exact color they’re getting.

Here is the section on product page which I want to mention about:

PageFlyGarcia_0-1701100109308.png

 If you have any questions, please let me know.

Cheers,

Garcia | PageFly Team

 

Please let me know if it works by giving it a Like or marking it as a solution!


Unlock the secrets to a record-breaking BFCM with PageFly and Canva


➜ Optimize your Shopify store with PageFly Page Builder (Free plan available)


➜ Weekly updated Shopify tutorials on YouTube


All features are available from the Free plan. Live Chat Support is available 24/7.


GACSTOP
Excursionist
27 1 13

Thank you for your feedback.

GACSTOP
Excursionist
27 1 13

Thank for your time going through my site and providing me such a valuable insight. I appreciate you a lot.

PageFly-Garcia
Shopify Partner
497 80 137

You are welcome @GACSTOP ,
You can try page builder to save money but it may require time. In case you have any question, please let me know 

Cheers,
Garcia 

Please let me know if it works by giving it a Like or marking it as a solution!


Unlock the secrets to a record-breaking BFCM with PageFly and Canva


➜ Optimize your Shopify store with PageFly Page Builder (Free plan available)


➜ Weekly updated Shopify tutorials on YouTube


All features are available from the Free plan. Live Chat Support is available 24/7.


GACSTOP
Excursionist
27 1 13

Thank you all for providing me a valuable feedback. I am not a coder, but you guys made me feel yet I got lots of things to do. Lots of the things you guys pointed out makes sense. So, I definitely got to weigh now if buying a premium theme is better option or paying someone to code my website. That's the decision I will make next year. But now is the time for the holiday promotion. Happy holiday.

 

Cheers

Ollie
Shopify Staff (Retired)
2550 460 422

Hey @GACSTOP.
 
Thanks for reaching out. 
 
It looks like you have received lots of great feedback on this post! Looking into your store, I noticed that you are using an image as the first section under the header navigation to inform your visitors of a Black Friday sale. What do you think about making this a slideshow section to include more slides of your products. For example, you could include your best seller or favorite product in the slides. This can also make the homepage more engaging and personalized for your visitors. 
 
You have a beautiful store, by the way! What do you think about including more collections in the header navigation menu? Instead of having an option Collections on the header - you could include your main collections on the header navigation to make browsing products easier for your potential customers. You could include Bags and Wallets as their own separate collection categories available on the header without having to select a drop down menu. 
 
Let me know what you think and if you have any questions. 

Ollie | Social Care @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

GACSTOP
Excursionist
27 1 13

I applied some of the feedback you guys provided. Now my website looks even better. I can't thank you enough.

GACSTOP
Excursionist
27 1 13

Hello awesome people,

I scrolled through each of your feedback, took suggestions, and made necessary changes. After making some changes, I was finally able to draw some conversions this Holiday season. It could not have been possible without your valuable feedback. I would much appreciate you all if you could take another look at my site.

 

Thanks