I need Help with some CSS

@ove

First, please update to v3.1.5 which fixes using custom templates.

Next you have a couple of options:

1. You can use the “site-reviews/rendered/field/classes” hook to add your own classes to each field. For example:

/**
 * Adds additional CSS classes to the name and email fields of the submission form
 * Paste this in your active theme's functions.php file.
 * @param array $classes
 * @param array $field
 * @return array
 */
add_filter( 'site-reviews/rendered/field/classes', function( $classes, $field ) {
    foreach( ['name', 'email'] as $path ) {
        if( !isset( $field['path'] ) || $field['path'] != $path )continue;
        $classes[] = 'glsr-field--'.$path;
    }
    return $classes;
}, 10, 2 );

You can now use .glsr-field--name {} and .glsr-field--email {} in your CSS.

2. You can use also custom templates for the form and each of the field types. This gives you much more control over the HTML structure of the form and fields.

The first thing you will need to do is copy over the “templates” directory from the Site Reviews plugin to your theme. After you have copied it over, rename the copied folder to “site-reviews”. If you have done this correctly, the path to the templates folder in your theme should look something like this:

/wp-content/your-theme/site-reviews

Finally, delete any template files in that folder that you are not going to customise.

form/field.php will be used for all fields unless there exists a specific field type file (see below).

To target a specific field type, you can duplicate the form/field.php file and add a field type suffix to the file name. For example:

form/field_email.php will be used for all fields that contain a <input type="email">

form/field_checkbox.php will be used for all fields that contain a <input type="checkbox">

form/field_textarea.php will be used for all fields that contain a <textarea>

So, using custom templates, you could do something like this to match your Gravity Forms plugin:

/wp-content/your-theme/site-reviews/reviews-form.php

<?php defined( 'WPINC' ) || die; ?>

<div class="gform_wrapper glsr-form-wrap">
    <form class="{{ class }}" id="{{ id }}" method="post" enctype="multipart/form-data">
        {{ fields }}
        {{ response }}
        {{ submit_button }}
    </form>
</div>

/wp-content/your-theme/site-reviews/form/field.php

<?php defined( 'WPINC' ) || die; ?>

<div class="gfield glsr-field {{ class }}">
    {{ label }}
    <div class="ginput_container">
        {{ field }}
    </div>
    {{ errors }}
</div>

• This reply was modified 7 years, 5 months ago by Gemini Labs.
• This reply was modified 7 years, 5 months ago by Gemini Labs.
• This reply was modified 7 years, 5 months ago by Gemini Labs.
• This reply was modified 7 years, 5 months ago by Gemini Labs.

Great! May I mark this as resolved?