# Custom Webforms style

**URL:** <https://integration.keap.com/t/custom-webforms-style/53415>\
**Category:** Max Classic\
**Created:** [September 28, 2018, 2:15pm UTC](https://integration.keap.com/t/custom-webforms-style/53415 "2018-09-28T14:15:53Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![Rodrigo\_Donini](https://sea1.discourse-cdn.com/flex019/user_avatar/integration.keap.com/rodrigo_donini/32/8273_2.png) [@Rodrigo\_Donini](https://integration.keap.com/u/Rodrigo_Donini)\
**Post date:** [September 28, 2018, 2:15pm UTC](https://integration.keap.com/t/custom-webforms-style/53415/1 "2018-09-28T14:15:53Z")

</div>

Hello!  
I have some issues with a web forms integrity.  
I’m currently using the web forms but as I need to make some customization I decided for the “HTML Code (unstyled)” type, and the main reason I choose this, it’s because I need to remove the text placeholders of the fields and apply some custom CSS. But my main problem is that every time I made some change in the forms I need to copy/paste the HTML code in my custom page on my website.  
I was wondering if there some way to do this with the “Javascript Snippet” type or some iframe in order to have a more automatic/dynamic process to update the forms in my end.

---

<div class="post-metadata">

**Author:** ![martinc](https://sea1.discourse-cdn.com/flex019/user_avatar/integration.keap.com/martinc/32/14_2.png) [@martinc](https://integration.keap.com/u/martinc)\
**Post date:** [September 28, 2018, 4:49pm UTC](https://integration.keap.com/t/custom-webforms-style/53415/2 "2018-09-28T16:49:35Z")

</div>

I would read through this, @Rodrigo_Donini. [Using CSS to affect div style inside iframe - Stack Overflow](https://stackoverflow.com/questions/583753/using-css-to-affect-div-style-inside-iframe)

---

<div class="post-metadata">

**Author:** ![Rodrigo\_Donini](https://sea1.discourse-cdn.com/flex019/user_avatar/integration.keap.com/rodrigo_donini/32/8273_2.png) [@Rodrigo\_Donini](https://integration.keap.com/u/Rodrigo_Donini)\
**Post date:** [September 28, 2018, 7:08pm UTC](https://integration.keap.com/t/custom-webforms-style/53415/3 "2018-09-28T19:08:01Z")

</div>

Thank you @martinc, but it seems this topic and techniques are not working anymore, for security reasons of the moderns browsers.  
I’m still looking for an alternative, maybe on the PHP side.

---

<div class="post-metadata">

**Author:** ![martinc](https://sea1.discourse-cdn.com/flex019/user_avatar/integration.keap.com/martinc/32/14_2.png) [@martinc](https://integration.keap.com/u/martinc)\
**Post date:** [September 28, 2018, 7:25pm UTC](https://integration.keap.com/t/custom-webforms-style/53415/4 "2018-09-28T19:25:17Z")

</div>

Let us know if you find a solution.

---

<div class="post-metadata">

**Author:** ![Rodrigo\_Donini](https://sea1.discourse-cdn.com/flex019/user_avatar/integration.keap.com/rodrigo_donini/32/8273_2.png) [@Rodrigo\_Donini](https://integration.keap.com/u/Rodrigo_Donini)\
**Post date:** [October 2, 2018, 2:04pm UTC](https://integration.keap.com/t/custom-webforms-style/53415/5 "2018-10-02T14:04:05Z")

</div>

This is my current solution, using PHP and the curl functions to trigger a request to the form embed URL.

In my case, I’m using WordPress so I create a shortcode to get the content inside the body and build my own page with my custom design and javascript validations.

Hope it helps, suggestions and comments are more than welcome.

/\*\*

- Function created to extend the Infusionsoft embed forms designs.
- 
- @param mixed $atts Shortcode attributes.  
_/  
function embed\_infusionsoft\_form\_shortcode( $atts ) {  
if ( is\_array( $atts ) ) {  
if ( ! empty( $atts[‘url’] ) ) {  
$curl = curl\_init( $atts[‘url’] );  
curl\_setopt( $curl, CURLOPT\_RETURNTRANSFER, true );  
$output = curl\_exec( $curl );  
curl\_close( $curl );  
if ( preg\_match( '#\<\s_?body\b[^\>]_\>(._?)\</body\b[^\>]\*\>#s’, $output, $body ) ) {  
wp\_enqueue\_script( ‘jquery’, ‘[https://cdn.jsdelivr.net/npm/jquery@3.3.1/dist/jquery.min.js](https://cdn.jsdelivr.net/npm/jquery@3.3.1/dist/jquery.min.js)’, null, true, true );  
wp\_enqueue\_script( ‘validate’, ‘[https://cdn.jsdelivr.net/npm/jquery-validation@1.17.0/dist/jquery.validate.min.js](https://cdn.jsdelivr.net/npm/jquery-validation@1.17.0/dist/jquery.validate.min.js)’, array( ‘jquery’ ), true, true );  
wp\_enqueue\_script( ‘validate-aditional’, ‘[https://cdn.jsdelivr.net/npm/jquery-validation@1.17.0/dist/additional-methods.min.js](https://cdn.jsdelivr.net/npm/jquery-validation@1.17.0/dist/additional-methods.min.js)’, array( ‘jquery’ ), true, true );  
wp\_enqueue\_script( ‘infusionsoft-forms’, plugin\_dir\_url( **FILE** ) . ‘assets/js/infusionsoft-forms.js’, array( ‘jquery’ ), true, true );  
return $body[1];  
}  
}  
}  
}

add\_shortcode( ‘infusionsoft-form’, ‘embed\_infusionsoft\_form\_shortcode’ );
