How can I fix design errors and improve form placement on my webpage?

I need some help with minor coding or solutions. (Problem) I’ve pasted a embed link from my crm jobber to my services page, it’s placed on the side awkwardly and it make the site look weird with so much open space, I would like to increase the width of the form or put it in its own section. Thanks a lot for the help :+1:t4: :grin:

yes here’s a link :slightly_smiling_face: https://reconcleaningservices.com/products/airbnb-turnover

on the right side of the page is the form and the left side is all the empty space where I would like to extend the width and decrease the length

Hello @Reconcleaning ,

You can try these steps:

  • Find the embed code for the Jobber form on your services page. You may need to edit the HTML code of the page to locate the embed code.
  • Once you have found the embed code, copy it and paste it into a text editor.
  • Look for the HTML code that corresponds to the Jobber form. This will typically be a
    element with a unique ID or class name.
  • Edit the CSS for the
    element to adjust the width of the form or add additional styling. For example, you could add a CSS rule like this:
#jobber-form {
  width: 100%;
}
  • Alternatively, you can create a new section for the Jobber form by adding a new HTML element, such as a
    or element, and placing the Jobber embed code inside it.

  • Edit the CSS for the new section to adjust its position and styling, as needed. For example, you could add a CSS rule like this:
.jobber-section {
  margin: 0 auto; /* Center the section horizontally */
  max-width: 800px; /* Set a maximum width for the section */
}
  • Save your changes and refresh your services page to see the updated Jobber form.

Hope this can help. Let us know if you have any further questions.

Regards,

AliReviews team.