How can we help?

If you are looking for support for our PokaTheme, this is the place!

Home › Forums › Poka Review Plugin support › How to get exactly this look

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • April 16, 2021 at 11:07 am #13588
    Mahesh Gamage
    Participant

    Hi

    I am new to Poka Review Plugin. I’d like to know how do I go about achieving this exact view

    [url=https://ibb.co/QdF1wVV][img]https://i.ibb.co/QdF1wVV/Screen-Shot-2021-04-16-at-11-04-29.png[/img][/url]

    • This topic was modified 2 years, 9 months ago by Mahesh Gamage.
    April 16, 2021 at 12:09 pm #13595
    admin
    Keymaster

    Hi Mahesh,

    The exact shortcode used in the homepage of the demo is the following:

    [pokareview_tablelist sort="rating" num="5" size="big" style="normal" counter="true" score_style="number_stars"]
    April 16, 2021 at 1:22 pm #13600
    Mahesh Gamage
    Participant

    Thanks 🙂 And one last thing. Is it possible to change the color of the star rating? Any CSS code for that

    May 13, 2021 at 12:02 pm #13870
    admin
    Keymaster

    Hi Manesh,

    To change the color only for the stars, in every page, you should add the following lines of CSS:

    For the active (blue) star (let’s say you want to change it to red – #ff0000):

    .prp-page div.prp-content ul.star-list-sep li.star-active svg polygon,
.prp-page.page div.prp-content ul.star-list-sep li.star-active svg polygon,
.prp-page.page div.prp-content .prp-el-circle-rating ul.star-list li.star-active svg polygon,
.prp-page.page .prp-content .table-s2 .prp-item .prp-item-row .prp-col-rating .prp-rating.tablev2 li.star-active svg polygon,
.prp-page.page .prp-content .review-single-s6 .widget-info .widget-info-group .prp-star-group ul.star-list li.star-active svg polygon,
.prp-page.page div.prp-content .prp-bars-rating--star .bar-rating-full .bar-rating-group .bar-rating--grey ul.star-list li.star-active svg polygon {
  fill: #ff0000 !important;
}

    For the empty (gray) star (let’s say you want to change it to a different gray – #cccccc):

    .prp-page div.prp-content ul.star-list-sep li svg polygon,
.prp-page.page div.prp-content ul.star-list-sep li svg polygon,
.prp-page.page div.prp-content .prp-el-circle-rating ul.star-list li.star-half svg polygon,
.prp-page.page div.prp-content .prp-el-circle-rating ul.star-list li.star-empty svg polygon,
.prp-page.page .prp-content .review-single-s6 .widget-info .widget-info-group .prp-star-group ul.star-list li svg polygon,
.prp-page.page .prp-content .table-s2 .prp-item .prp-item-row .prp-col-rating .prp-rating.tablev2 li.star-half svg polygon,
.prp-page.page .prp-content .table-s2 .prp-item .prp-item-row .prp-col-rating .prp-rating.tablev2 li.star-empty svg polygon,
.prp-page.page div.prp-content .prp-bars-rating--star .bar-rating-full .bar-rating-group .bar-rating--grey ul.star-list li svg polygon,
.prp-page.page .prp-content .review-single-s6 .widget-info .widget-info-group .prp-star-group ul.star-list li.star-empty svg polygon {
  fill: #cccccc !important;
}
  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.