PLEASE NOTE: These forums are no longer utilized and are provided as an archive for informational purposes only. All support issues will be handled via email using our support ticket system. For more detailed information on this change, please see this blog post.

Need help with formatting

  1. I'm upgrading several clients from cforms to Gravity Forms but need to keep the same formatting. Can you help in getting me started.
    Here is an example of the formatting for the main form:
    And one for the sidebar (I'll be using Yoast's plugin):


    Posted 4 years ago on Saturday March 17, 2012 | Permalink
  2. How comfortable are you with CSS? Here is our documentation:

    Once you start your conversion, just post back where you get stuck and provide links to your Gravity Forms on your site.

    Posted 4 years ago on Sunday March 18, 2012 | Permalink
  3. That's actually my problem. Not being trained on CSS I can modify it and adjust it as necessary but I cannot start one. Could you give me the initial push?

    Posted 4 years ago on Tuesday March 27, 2012 | Permalink
  4. Sure man, have you created your Gravity Forms yet that you'd like to use? If not, that would be the first step, if so, can you post them on a page and provide the urls. One for the normal page and one in the sidebar? Can always tackle them individually too, so if you wanted to get through the regular page first and then the widget styling.

    Posted 4 years ago on Wednesday March 28, 2012 | Permalink
  5. Here are the url on our dev site.
    Main page

    Thanks for your help.

    Posted 4 years ago on Wednesday March 28, 2012 | Permalink
  6. First things first for your full-page form you have chosen the "right aligned" labels instead of top like your reference URL has them:

    To style the input and textarea boxes you can add this to your theme's stylesheet:

    .gform_wrapper input[type="text"], .gform_wrapper input[type="url"], .gform_wrapper input[type="email"], .gform_wrapper input[type="tel"], .gform_wrapper input[type="number"], .gform_wrapper input[type="password"], .gform_wrapper textarea {
    border: 1px solid #aaa;
    padding: 3px;
    background: white;
    .gform_wrapper input[type="text"]:hover, .gform_wrapper input[type="url"]:hover, .gform_wrapper input[type="email"]:hover, .gform_wrapper input[type="tel"]:hover, .gform_wrapper input[type="number"]:hover, .gform_wrapper input[type="password"]:hover, .gform_wrapper textarea:hover {
    border: 1px solid #fc0;
    Posted 4 years ago on Thursday March 29, 2012 | Permalink
  7. Awesome thank you. I was also able to change some of the wrapper formatting. The next question I have is how do I adjust the button for the form without affecting other buttons on the site?

    Posted 4 years ago on Friday March 30, 2012 | Permalink
  8. You can use this (and change and add whatever properties of course):

    #content .gform_wrapper .gform_footer input.button {
    background: #555;
    border: 1px solid black;
    text-shadow: none;
    Posted 4 years ago on Friday March 30, 2012 | Permalink
  9. Here is my code thus far and I've migrated to the live site

    Next is the widget, please. The main issue is the width of the text-area.

    Posted 4 years ago on Saturday April 7, 2012 | Permalink
  10. I don't see a GravityForm in the widget area.

    Posted 4 years ago on Sunday April 8, 2012 | Permalink
  11. Here you go:

    Posted 4 years ago on Monday April 9, 2012 | Permalink
  12. This will target that specific comment box:

    #input_3_4 {
    width: 150px;
    height: 100px;
    Posted 4 years ago on Monday April 9, 2012 | Permalink


Support Tickets

Open A New Support Ticket
 Open A New Priority Support Ticket *

* Developer license holders only