To Insert a form into a web page manually use this code.

[[form id="1"]]

Where 1 is the id of the form you want to include.

Then where you attach the form on the page, set the form position (the above content, below content part) to manual.


To insert a form manually as a collapsible button use the code below.

Make sure the bold attributes match and that you're using the correct form id#.

LEFT  aligned button:

<div class="dropdown d-flex justify-content-start"><button aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="outside" type="button" class="btn btn-primary dropdown-toggle">Contact Us</button>

<ul style="position: absolute; width: 95%; background: #ffffff; padding: 25px; z-index: 1000; top: 100%; box-shadow: rgb(0, 0, 0) 0px 0px 10px; overflow: hidden;" class="dropdown-menu">

<li>[[form id="#"]]</li>

</ul>

</div>

Example: Aligned Left

 

CENTER  aligned button:

<div class="dropdown dropdown-center d-flex justify-content-center"><button aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="outside" type="button" class="btn btn-primary dropdown-toggle">Contact Us</button>

<ul style="position: absolute; width: 95%; background: #ffffff; padding: 25px; z-index: 1000; top: 100%; box-shadow: rgb(0, 0, 0) 0px 0px 10px; overflow: hidden;" class="dropdown-menu">

<li>[[form id="#"]]</li>

</ul>

</div>

Example: Aligned Center

 

RIGHT  aligned button:

<div class="dropdown d-flex justify-content-end"><button aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="outside" type="button" class="btn btn-primary dropdown-toggle">Contact Us</button>

<ul style="position: absolute; width: 95%; background: #ffffff; padding: 25px; z-index: 1000; top: 100%; box-shadow: rgb(0, 0, 0) 0px 0px 10px; overflow: hidden;" class="dropdown-menu">

<li>[[form id="#"]]</li>

</ul>

</div>

Example: Aligned Right


For Developers

Styling forms

When styling forms, if a style is added to hide the label, make sure to make it more specific so that it wont affect radio and check boxes.

Inserting menu shortcode in a blade file

{!! (new \App\CmsContent('[[short-code here]]'))->render() !!}

Building Relationships with Web Developers and Marketing Agencies that want better results

The world's fastest and most SEO friendly website code.