page-setting-fig.php — Rich Showcase for Google Reviews 3.1

widget-google-reviews / includes / page-setting-fig.php

widget-google-reviews / includes Last commit date

page-setting-fig.php

133 lines

1	<p>To correctly use this plugin you need to get two things - <b><u>Google Place ID</u></b> and <b><u>Google Places API key</u></b>. These are two different values, please do not confuse them.</p>
2
3	<p style="background: #eee; padding: 4px 10px; border-radius: 4px; border: 1px solid #ccc; font-size: 16px; font-weight: 600; text-align: center; line-height: 32px; color: #304cd3;">There is nothing complicated and the whole process will not take even 5 minutes,<br>and as a reward you receive a constantly updated and collected Google Rating and Reviews!</p>
4
5	<hr></hr>
6
7	<h3 id="place_id"><u>I. Google Place ID</u></h3>
8
9	<p><b>First of all, you need to find Google Place ID:</b> this is the identification of your Google Place (business). It should be like that: <b>ChIJ..</b>, for instance: ChIJ3TH9CwFZwokRIvNO1SP0WLg. If you know it, go to <a href="#fig_api_key">How to create Google API key</a></p>
10	<p><b>Please keep in mind: your Google Place must have a physical address</b>, because Google Place API, which is used in this plugin, works only with a phisical Google places, it's not possible to connect area or virtual place. Unfortunately, it's a limitation of Google, not specifically the plugin.</p>
11	<p>The standard way to find your Google Place ID is to go to <a href="https://developers.google.com/places/place-id" target="_blank">https://developers.google.com/places/place-id</a> and search for your company name. But sometimes it just doesn’t work.</p>
12
13	<h3 class="subheader">How To Find Any Google Place ID…</h3>
14
15	<div class="grw-flex-row">
16	<div class="grw-flex-col3">
17	<b>1</b> Search for your business on Google.
18	</div>
19	<div class="grw-flex-col7">
20	<div class="box-img"><img src="<?php echo GRW_ASSETS_URL . 'img/google_placeid_1.png'; ?>"></div>
21	</div>
22	</div>
23
24	<div class="grw-flex-row">
25	<div class="grw-flex-col3">
26	<b>2</b> Inspect the “<b>Write a Review</b>” button. To do this in Firefox, right-click and choose “<b>Inspect Element</b>“. In Chrome, right-click and choose “<b>Inspect</b>“. (Most browsers follow a similar process.)
27	</div>
28	<div class="grw-flex-col7">
29	<div class="box-img"><img src="<?php echo GRW_ASSETS_URL . 'img/google_placeid_2.png'; ?>"></div>
30	</div>
31	</div>
32
33	<div class="grw-flex-row">
34	<div class="grw-flex-col3">
35	<b>3</b> Find “<b>data-pid</b>” as shown above. (This part is a little tricky, but just look inside the <b><a></b> tag until you find <b>data-pid=</b>).
36	</div>
37	<div class="grw-flex-col7">
38	<div class="box-img"><img src="<?php echo GRW_ASSETS_URL . 'img/google_placeid_3.png'; ?>"></div>
39	</div>
40	</div>
41
42	<div class="grw-flex-row">
43	<div class="grw-flex-col3">
44	<b>4</b> Copy the characters within the quotes (as shown above). You now have your google Places ID. Paste this somewhere you can easily find it.
45	</div>
46	</div>
47
48	<hr></hr>
49
50	<h3 id="fig_api_key"><u>II. Google Places API key</u></h3>
51
52	<div class="grw-flex-row">
53	<div class="grw-flex-col">
54	<b>1</b> Go to your <a href="https://console.developers.google.com/apis/dashboard?pli=1" target="_blank">Google Console</a> dashboard. If you new user agree Google terms:
55	</div>
56	<div class="grw-flex-col">
57	<div class="box-img"><img src="<?php echo GRW_ASSETS_URL . 'img/google_key_1.png'; ?>"></div>
58	</div>
59	</div>
60
61	<div class="grw-flex-row">
62	<div class="grw-flex-col">
63	<b>2</b> Select your existing project or create new:
64	</div>
65	<div class="grw-flex-col">
66	<div class="box-img"><img src="<?php echo GRW_ASSETS_URL . 'img/google_key_2.png'; ?>"></div>
67	<div class="box-img"><img src="<?php echo GRW_ASSETS_URL . 'img/google_key_2_1.png'; ?>"></div>
68	</div>
69	</div>
70
71	<div class="grw-flex-row">
72	<div class="grw-flex-col">
73	<b>3</b> Wait for creation and then click '<b>ENABLE APIS AND SERVICES</b>':
74	</div>
75	<div class="grw-flex-col">
76	<div class="box-img"><img src="<?php echo GRW_ASSETS_URL . 'img/google_key_3.png'; ?>"></div>
77	</div>
78	</div>
79
80	<div class="grw-flex-row">
81	<div class="grw-flex-col">
82	<b>4</b> Type '<b>Places API</b>' in the search area, select the first result '<b>Places API</b>' and click '<b>ENABLE</b>' button:
83	</div>
84	<div class="grw-flex-col">
85	<div class="box-img"><img src="<?php echo GRW_ASSETS_URL . 'img/google_key_4.png'; ?>"></div>
86	<div class="box-img"><img src="<?php echo GRW_ASSETS_URL . 'img/google_key_4_1.png'; ?>"></div>
87	</div>
88	</div>
89
90	<div class="grw-flex-row">
91	<div class="grw-flex-col">
92	<b>5</b> After enable the Places API, click '<b>Navigation menu</b>', select '<b>APIs & Services</b>' and '<b>Credentials</b>':
93	</div>
94	<div class="grw-flex-col">
95	<div class="box-img"><img src="<?php echo GRW_ASSETS_URL . 'img/google_key_5.png'; ?>"></div>
96	</div>
97	</div>
98
99	<div class="grw-flex-row">
100	<div class="grw-flex-col">
101	<b>6</b> On Credentials page click '<b>+ CREATE CREDENTIALS</b>' and select '<b>API key</b>':
102	</div>
103	<div class="grw-flex-col">
104	<div class="box-img"><img src="<?php echo GRW_ASSETS_URL . 'img/google_key_6.png'; ?>"></div>
105	</div>
106	</div>
107
108	<div class="grw-flex-row">
109	<div class="grw-flex-col">
110	<b>7</b> After creation of API key you need to copy & paste it to the plugin's settings (<b>please do not restrict the key</b>, the plugin can't work with a restricted API key, it's a limitation of Google):
111	</div>
112	<div class="grw-flex-col">
113	<div class="box-img"><img src="<?php echo GRW_ASSETS_URL . 'img/google_key_7.png'; ?>"></div>
114	</div>
115	</div>
116
117	<div class="grw-flex-row">
118	<div class="grw-flex-col">
119	<b>8</b> Now, you need to enable Google Billing. It's mandatory step to use the API key. <b>Don’t worry, <a href="https://developers.google.com/maps/billing-credits" target="_blank">Google is currently giving $200 free credit a month</b></a> and it should be enough to use the plugin for connecting several Google places without additional fees except this free $200 credits. Go to <a href="https://console.cloud.google.com/project/_/billing/enable" target="_blank">https://console.cloud.google.com/project/_/billing/enable</a>, select your recent created project and click '<b>CREATE BILLING ACCOUNT</b>':
120	</div>
121	<div class="grw-flex-col">
122	<div class="box-img"><img src="<?php echo GRW_ASSETS_URL . 'img/google_key_8.png'; ?>"></div>
123	</div>
124	</div>
125
126	<div class="grw-flex-row">
127	<div class="grw-flex-col">
128	<b>9</b> Agree Google terms, fill your contact information and start using your Google API key with the plugin.
129	</div>
130	</div>
131
132	<p style="text-align:center"><b>Congratulation! Now you need to <a href="<?php echo admin_url('admin.php?page=grw-builder'); ?>" target="_blank">create your first widget and connect Google reviews</a>,<br>then you can show this widget in a sidebar or like a shortcode on the any page of your website.</b></p>
133