Styling ONLY the WordPress widget

Hi, I am styling the WordPress widget via the CSS override section in Checkfront.

When I do so, the changes are reflected on my default booking page.

Is there a way to target only the contents of the WordPress iframe instead of the booking page?


  • BrittanyBrittany Checkfront
    Hi brettdev,

    Thank you for your question!

    While this is not possible using the Wordpress Plugin, it is possible if you use the cut and paste Droplet instead (in Manage > Layout > Add-ons > Website Integrations > Droplet).

    Simply add a 'tracking ID' and target that ID in your CSS in order for that styling to apply to only that Droplet code. Example code below:

    .tid-test {
    font-size: .8em;
    color: red;
    background-color: blue;

    I have created a quick demonstration of this here.

    I hope this helps and please let us know if you have any follow up questions.

    Kind regards,

    Checkfront Support Team
  • edited April 10
    Hi Brittany, I've tried this droplet method and it isn't working.

    Edit: Don't worry I have resolved it. I didn't realise that 'tid' is appended to the beginning of the class, regardless of what tracking ID you use. For example, I used tracking ID 'cf-rock' but I had to target 'tid-cf-rock' with my CSS.
  • Is there a way to pull in a larger thumbnail using the droplet?
Sign In or Register to comment.