How to Use Google Reviews Widget

element pack

How to Use Google Reviews Widget

Credibility is important for anything. If it is an online business, reviews of different social media are very much needed in the matter of that. There are a few review sites such as Google, Facebook, Yelp, etc. that can help you to grow your online business credibility. In this article, I’ll show you the way of using Google Reviews Widget by Element Pack which will allow you to show Google reviews on your website.

Moreover, I’ll guide you in different phases of how you can insert & use the widget to design layout for the content (text, image, and video, etc.)  you want to work with and style as well.

To Insert Widget

Inserting widget, it is just a matter of drag and dropping. You’ve inserted the Google Reviews widget and placed Place ID under the Layout section but nothing is showing. As you see in the screenshot above.

To fix the issue, firstly, you have to cover the topics below

  • To generate Google Map API Key
  • To enable Google Maps JavaScript API
  • To enable Google Places API

Come on. Let’s see how to do all these.

Google Map API Key:

Making API Key is a matter of a few steps.

Step-1: Go to the WordPress dashboard > hit on the Element Pack > next click on the API Settings > then click on the generate the API key link

Step-2: If you click on the generate the API Key link, it will take you to the Google Cloud Platform. Then hit the navigation icon left side the page and go to APIs & Services > Credentials.

Step-3: Click the Credentials > + CREATE CREDENTIALS > APIKey > copy the generated API Key

Step-4: Back to the WordPress dashboard > and paste the API Key in the Google Map API Key input field > finally, hit the Save Settings. It’s done.



Google Maps JavaScript & Places API

For creating Google Maps JavaScript & Places API, follow the steps below.

Step-1. Go to Google Cloud Platform > hit the navigation menu icon > APIs & Services > Library.

Step-2: Then, hit on each of Maps JavaScript API and Places API and click the ENABLE button. It’s done.

Step-3:


Content Tab

Using the content tab, you’ll be able to make a layout of a particular part of a website. And in this regard, some handy sections in the tab will assist you a lot.

Layout

This section holding Place ID will allow you to place Google Place ID and the Place ID will help you to show Google reviews on your website.

Most importantly, the actual work of the Reload Reviews control is to let you cache the reviews over a Day, Hour, Week, Month, Year. If you once set reload reviews period, no new review will show until the end of the caching period such a day, hour, etc.

And using the switcher buttons holding Layout Section, you’ll easily be able to manipulate the Image, Time, Name, Rating, Excerpt, etc.

Simply, go to the Content Tab > Layout.

Additional

Here is Reviews language control that will allow you choosing the language( such as English, Arabic, Bengali, etc.) of reviews. If you are not interested, you can go for Language disable.

Go to the Content Tab > Additional.

Slider Settings

You’ll feel the necessity of manipulating reviews slider. If you do so. Just go to the Content Tab > Slider Settings.

Navigation

If you want to place an arrow with the reviews slider. The section will give you hand. So, go to the Content Tab > Navigation.



Style Tab

It is time to work with Style Tab. The tab will confidently have you style the web content (text, image, video, etc.) of the page you want to design. 

Styling with the Style tab in Elementor will always give you a fantastic experience.

Let’s have a look.

Google Reviews

There are two modes such as Normal and Hover under this section. In the Normal mode, you’ll be able to set Background Type like Classic and Gradient, Type (Radial, Linear), Position(Bottom Left, Center Center, etc.), Padding, Border Type, Radius, and Box-shadow.

In terms of the Hover mode, you can do the same things I mentioned regarding the Normal mode. As an addition, you can set the Angle of the gradient color.

Just go to > the Style tab > Google Reviews.

Image

The Image section will allow you to determine the image size and spacing. As you see in the screenshot above.

Come to > the Style tab > Image.

Name

From this section, you can put desire name text color and hover color, and also Typography. Learn more about Typography.

Follow the Style tab > Name.

Time

Following the Name section, You’ve to do the same things in the Time section. As an addition, you can vertically place a spacing with Name.

Go to the Style tab > Time.

Rating

Here, in this section, you have a chance to put color and active color of the Rating. In addition, giving a margin and space vertically.

Come to the Style tab > Rating.

Excerpt

This section holds an opportunity for you to place Color, Padding, Alignment, Spacing, and Typography.

Go to the Style tab > Excerpt.

Navigation

In many respects, you’ll find arrows, dots or both with navigation. To give style to the arrows and dots you’ve to go to the Style tab > Navigation. you want to place an arrow with the logo carousel. The section will give you hand. So, go to the Content Tab > Navigation

Follow the Style tab > Navigation.

In conclusion, hopefully, you’ve found this article useful. Following the guidelines mentioned over here, you’ll be able to present google reviews that will help you to grow your business.


About Selim Rana

Selim Rana is the Founder of BdThemes - the company behind Element Pack Pro! He is a Software Engineer passionate about WordPress and Elementor.


Up to 50% OFF

Missed The Black Friday offer this year? Get up for flat 50% discount right now.