Why isn't my product review app aligning well with the Dawn theme?

Wiltshire_Scent
Tourist
7 1 2

Hi,

I've recently added the product review app but it is not working with my theme very well. 

I'm trying to get the fields to be more line with the contact form but I can't see where I can edit this.

Product review template.PNGContact form.PNG

I am using the Dawn theme. 

Thanks, 

Alex

Replies 8 (8)

oscprofessional
Shopify Partner
15830 2369 3072

@Wiltshire_Scent ,

Your review app is working on contact form ?

what do you want from review fields? share the URL with password

Get pass your Store Core Web Vital Free Speed Optimization Audit, Chat on WhatsApp | Skype : oscprofessionals-87 | Email: pallavi@oscprofessionals.com | Custom Pricing Wholesale App : Free | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing
Wiltshire_Scent
Tourist
7 1 2

Hi, 

I want to amend the product review form so that the style is in keeping with my contact form.

I will send you the store password separately. 

Thanks, 

Alex

oscprofessional
Shopify Partner
15830 2369 3072

@Wiltshire_Scent ,

You only sent password not URL .

Thanks

Get pass your Store Core Web Vital Free Speed Optimization Audit, Chat on WhatsApp | Skype : oscprofessionals-87 | Email: pallavi@oscprofessionals.com | Custom Pricing Wholesale App : Free | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing
Wiltshire_Scent
Tourist
7 1 2

Apologies, I should have another coffee!

www.thewiltshirescentcompany.co.uk 

Thanks, 

Alex

oscprofessional
Shopify Partner
15830 2369 3072

@Wiltshire_Scent ,

input#review_author_6877583245488, input#review_email_6877583245488, input#review_title_6877583245488, textarea#review_body_6877583245488 {
    background: rgba(22,34,46) !important;
    border: 1px solid #27323B;
    padding: 12px;
    color: #fff;
}
a.spr-summary-actions-newreview {
    color: #fff;
}
.spr-form-input.spr-starrating a {
    color: #fff !important;
}

Add this css at the bottom of
Online Store->Theme->Edit code->Assets->section-main-product.scss.liquid

Get pass your Store Core Web Vital Free Speed Optimization Audit, Chat on WhatsApp | Skype : oscprofessionals-87 | Email: pallavi@oscprofessionals.com | Custom Pricing Wholesale App : Free | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing
Wiltshire_Scent
Tourist
7 1 2

@oscprofessional 

Thanks for getting back to me. 

The first part of the CSS you sent me isn't being picked up but the .spr elements are.

 

input#review_author_6877583245488, input#review_email_6877583245488, input#review_title_6877583245488, textarea#review_body_6877583245488 {
    background: rgba(22,34,46) !important;
    border: 1px solid #27323B;
    padding: 12px;
    color: #fff;

 

I've input the below which is given me the desired effect, but for some reason the first part (background-color: 16222e) is not being picked up so I'm having to enter it twice??

 

.spr-summary-actions-newreview {
    color: #947B57;
}
.spr-form-input.spr-starrating a {
    color: #947B57!important;
}
  
.spr-form-input.spr-form-input-text {
    id="review_author_6877583245488"; 
    background-color: #16222e;
    border: 1px Solid #27323B;
    padding: 12px;
    color: #fff;
    background-color: #16222e
}  

.spr-form-input.spr-form-input-email {
    id="review_email_6877584097456";
    background-color: #16222e;
    border: 1px Solid #27323B;
    padding: 12px;
    color: #fff;
    background-color: #16222e;
}
.spr-form-input.spr-form-input-textarea {
    id="review_body_6877584097456";
    background-color: #16222e;
    border: 1px Solid #27323B;
    padding: 12px;
    color: #fff;
    background-color: #16222e;
}

 

This is giving me;

Product review template.PNG

Thanks, 

Alex 

sampymishra
Shopify Partner
296 10 35

Hi @Wiltshire_Scent 

The reviews are getting collected by the process of form submission.

You can look at the app we have developed, the Easy Google Shopping Feed app by AdNabu for Shopify. You can bulk edit all the fields, and the changes will be pushed to the Google Merchant Center within a couple of minutes.

Some of the other features of our app include: 

  • The product-specific score for every product & recommendations to increase the score &, most likely, your performance in Google Shopping
  • Metafield mapping to customize every single attribute of Google Shopping Feed
  • Faster update of Google Shopping Feed with unlimited manual syncing
  • Supports Multi-language and Multi-currency feed
  • Many more features which can save your time and effort.

You can also get in touch with our experts and request a demo. 

Hope this helps.

Sampy Mishra | Customer Success Manager @ AdNabu

 - Was my reply helpful? Click Like to let me know! 

 - Was your question answered? Mark it as an Accepted Solution

 - Try our Nabu for Google Shopping Feed from Shopify App Store. 

Wiesen_Phan
Shopify Partner
63 6 14

Hi @Wiltshire_Scent

You can try out Ali Reviews app instead. Ali Reviews has "theme settings" feature which helps you to customize your reviews section such as: customizing text color, editing the start rating, etc. It can even set up the review displays into various styles: review carousel, review box, review pop up which fit your store theme. 

Check Ali Reviews here: https://apps.shopify.com/ali-reviews 

FireApps - Premium e-commerce solutions come together for your growth