This week, as part of our ongoing Divi design initiative, we’re going to show you how to add star reviews to the profile pages with Divi’s new and free Babysitter Layout Pack. That way, whenever someone takes a look at the different babysitters at your company, they’ll also be able to see how people have responded to their presence in the past. This will likely increase the credibility of each babysitter and will help you turn leads into conversions much quicker.
The first thing you’ll need to do is download this super cool and free plugin called Site Reviews by going to the following link and clicking on the download button.
Then, upload the plugin and make sure you activate it as well.
We’re assuming you have already added each layout of the Babysitter Layout Pack as a page and created a primary menu with these pages as well. We’re going to make one small change, however. To make that change, navigate to your menu by going to your WordPress Dashboard > Appearance > Menus.
Depending on the number of profiles your babysitter website has, use them as sub menu items to your team page.
Next, you can make some small changes to the plugin by going to Site Reviews > Settings.
Within the general tab, choose the settings you want to apply to the reviews. One of these options allows you to enable approval for reviews. It’s best you select ‘yes’ for this option to have full control over what appears on your website and what doesn’t.
To increase the credibility factor of your babysitters, you can also enable avatars within the reviews tab.
The Site Reviews plugin allows you to connect reviews to different posts. We are, however, using pages for our profile pages. That’s why you’ll need to create some blank posts that match the number of babysitter you’re showing on your website. To do that, go to Posts > Add New and repeat this step for each one of the babysitters you have.
Give your posts a title and publish them right after. But don’t worry, once we go through all the steps, we’ll be able to put them to draft again without losing reviews. The plugin will just need to connect to a certain blog post in order for the shortcodes to work on a page.
Erase all the content in the content box, click on the star icon and select ‘Recent Site Reviews’. This option will make the different reviews show up on your page.
Then, click on the star icon again and select ‘Submit a Site Review’. This shortcode will make a submission form show up that will allow people to submit a review they have of that babysitter in particular.
Make sure you add the same Post ID number to this shortcode as you did for the recent reviews in the previous step of this tutorial. The recent reviews and submit review form need to have the same post ID to make sure only accurate reviews show up on the page. Depending on your needs, you can also hide certain elements of the submission form.
Now that we’ve added both necessary shortcodes, we can switch over to the Visual Builder to make some appearance changes.
To match the button on the submission form with the babysitter layout pack, we’ll need to apply a bit of CSS code. We’re not able to make this modification within the Divi Builder itself since we’re using a third-party plugin. To add this CSS code to your page, click on the icon at the bottom of your page and open the settings.
Once you’re done creating all of your profiles, you can go ahead and put each one of the blog posts to draft. We only needed the posts to enable the reviews and make sure they’re unique to the different profiles. Removing the blog posts might cause the reviews not to work anymore so putting them to draft is a nice alternative to have.
In this post, we’ve shown you how to add star reviews to each babysitter profile page using the new Babysitter Layout Pack and the free Site Review plugin. This use case is part of our ongoing Divi initiative where our design team shares a new layout pack with you each and every week. If you have any questions; make sure you leave a comment in the comment section below!
Nice & Clean. Thank you!
So if you just enter ‘post_id’ rather then an actual number it will work just fine.
Right on John, looks like you don’t need to back this with a standard post and in fact will probably work with custom post types. Could make a CPT for carers in Toolset Type and serve them up on the Team page in an archive view of that post type.
I just have a question on how the waves divider was created on the ‘Home’ page?
I have loaded it up in the Divi builder and neither section has a wave divider selected?
Is there some CSS going on? would love to recreate this between two sections!
Now you keep the CI of the site even you have that review plugin on that page.
For future tutorials, I would recommend that the overall Design of the Layout Examples stay as is even you build examples with new plugins. It is only a very little effort for you to present nice looking pages to the outside world and it actually would show the real power of DIVI as DIVI can keep design layouts.
Oh thanks! that looks great! I realized an increse of my sales when I inserted reviews on my profile pag. So useful!
Does this Site Review plugin include the star ranking to the SERPs on Google as a rich snippet?
Is this theme available for personal cv?