Load scripts and styles on Fluent Form conversational form landing page

Someone asked how you could load your own custom scripts and styles on a Fluent Form conversational form landing page since using the default wp_head() and wp_footer() functions from WordPress don’t get called.

Fluent Forms does however have their own hooks we can use to inject custom scripts and styles into the header and footer of the page.

Header hook

You can use the hook fluentform_conversational_frame_head to add CSS or Javascript to the header of the page.

PHP


        <?php
// Adds code to header
add_action('fluentform_conversational_frame_head', 'tct_conversational_header_script')
function tct_conversational_header_script(){ 
    ?> 
    <style>
        /* Add your CSS here */
    </style>
    <script>
        // Add your javascript here
    </script> 
    <?php 
}
      Copy

Footer hook

You can use the hook fluentform_conversational_frame_footer to add CSS or Javascript to the footer of the page.

PHP


        <?php
// Adds code to footer
add_action('fluentform_conversational_frame_footer', 'tct_conversational_footer_script'); 
function tct_conversational_footer_script(){ 
    ?> 
    <style>
        /* Add your CSS here */
    </style>
    <script>
        // Add your javascript here
    </script> 
    <?php 
}

      Copy

Header hook

Footer hook

Table of contents

Tags

Related Posts

How to Hide the WordPress Admin Bar and Restrict Page Access Based on User Roles

Add custom code to Fluent Community Portal

How to Increase GenerateBlocks Pro Global Styles Limit

A guide to customising email headers in FluentCRM

👋🏻 Weekly Tutorial Digest