Keith Best demonstrates how to enhance a Lead Simplify form on a website using HTML and Bootstrap. He explains the use of div classes for layout, specifically the row and column-md-8 for a two-column effect, and column-md-4 for the form. Keith emphasises the importance of setting the iframe height to avoid a scrollbar, suggesting a height of 500 pixels. He also shows how to add a background colour using Bootstrap’s variables, such as “bg-light,” and adjusts padding and margins for a more polished look. Finally, he encourages viewers to subscribe to his channel for more tutorials and leave comments for future video ideas.
Action Items
- [ ] @Keith Best – Adjust the height of the Lead Simplify form to 350 pixels.
- [ ] @Keith Best – Add a heading (e.g., “On today?”) above the Lead Simplify form to provide more context.
- [ ] @Keith Best – Apply a light grey background colour to the Lead Simplify form using the Bootstrap “bg-light” class.
- [ ] @Keith Best – Add padding (3 units) to the top and bottom of the Lead Simplify form using the Bootstrap “p-3” and “mb-4” classes.
Outline
Adding Lead Simplify Form to a Site
- Keith Best introduces the video, explaining the goal of jazzing up forms using Lead Simplify.
- He demonstrates how to access the HTML source code by clicking the three dots and selecting “source code.”
- Keith explains the use of Bootstrap’s grid system, specifically the div class “row” and “column-md-8” to create a two-column layout.
- He emphasises the importance of adjusting the height of the iframe for the Lead Simplify form to prevent a scrollbar from appearing.
Adjusting Form Height and Adding Background Colour
- Keith shows how to add a height attribute to the iframe and suggests starting with a height of 100 pixels.
- He adjusts the height to 500 pixels to better fit the form, noting the impact of the form’s buttons on the required height.
- Keith discusses adding a background colour using Bootstrap’s variables, specifically “bg-light.”
- He explains the need for padding and margin adjustments to ensure the form fits nicely within the layout.
Finalising Form Appearance and Adding Text
- Keith demonstrates how to add a heading (h2) to the form for better visual appeal.
- He adjusts the size of the heading and centres it within the form.
- Keith adds a background colour and padding to create a more polished look.
- He finalises the form by adjusting the height and adding a pattern at the bottom for a more visually appealing effect.
Conclusion and Call to Action
- Keith summarises the steps taken to make the form look nice on the site.
- He encourages viewers to subscribe to the channel for more videos and to leave comments if the video was useful.
- Keith asks viewers to suggest other videos they would like to see in the future.
- He signs off, thanking the viewers and expressing his intention to create more helpful videos.
Enjoy!
Why 3local Benefits Local Businesses
Conventional SEO typically targets just one area at a time, while Google Ads only delivers results if you continually outspend your competition. Yet, over 90% of local customers search using both a location and a service.
At 3local, we implement a tried-and-tested method that builds SEO-optimised pages for every suburb, town, or village within your target region, tailored to each individual service you provide.
It’s the equivalent of having a highly targeted mini-site for every potential search your customers could make on Google.