WordPress.org

1. OttoMan28
   Member
   Posted 1 year ago #
   

   I'm using the Mailchimp widget on two sites.
   On site_a it display nicely like this:

   Site_A
   -----------
   Email:*
   [_________]
   First Name:
   [_________]
   Last Name:
   [_________]
   -----------

   On site_b its all messed up:

   Site_B
   ----------------------
   Email:* [_________]
   First Name: [_________]
   Last Name: [_________]
   ----------------------

   I have tried to copy the Theme from Site_A to Site_B to see if its releate to the Theme
   But even is i use the same Theme on B and on A, it will give the messy display.
   I have also tried to copy the plugin files directly from A to B, no change either.

   Any suggestions`?

   Thanks

   http://wordpress.org/extend/plugins/mailchimp/

2. mc_nate
   Member
   Posted 1 year ago #
   

   Hey there, OttoMan!

   Any chance you can shoot a link over to your site to have a closer look at the one that's not cooperating?

3. OttoMan28
   Member
   Posted 1 year ago #
   

   Hi mc_nate

   I have now pinpointed it to the theme "Twist of Ten", the error
   On a clean test installation, i get the samme error on if i install Twist of Ten.
   Switching back to the original "Twenty Eleven" then no problem.
   See below

   http://onlinedemo.dk/wordpress/

   Thanks

4. mc_nate
   Member
   Posted 1 year ago #
   

   No worries. If that's the theme you're wanting to use, we should be able to get you rockin' and rollin'. All we have to do is have the plugin set to "display: block;" so that each input field displays on it's own line. So you'll need to add something like this to your CSS;

   #mc_signup_form .mc_input {
   display: block;
   }

   Using that CSS should give you something like this:

   Screenshot -- http://cl.ly/2s3Y3G0N0n2r1Y463W1n

   Give us a shout back if that doesn't get it. We'll be happy to have a closer look!

   Cheers

5. Loppelyst
   Member
   Posted 11 months ago #
   

   Hi mc_nate

   I think my problem is similar to this described here, so I hope it is okay, that I write a comment/question.

   My site is http://www.loppelyst.dk

   In the sidebare where I have the subscribtionform for MailChimp the input fields are cramped together so it does not look very nice.

   I would like for the input fields to have space between them and be aligned.

   I guess I could try using the code you write above mc_nate but I am not that technical unfortunatly - I do know how to insert the code in a file but where should I insert it?

   Hope you can help. Thank you very much in advance.

   Best,
   Christian

6. Loppelyst
   Member
   Posted 11 months ago #
   

   Wow I did something that worked.

   I tried copy pasting the code into the css file named flick.css and the input fields aligned themselves. And it does not look like I have messed anything else :O)

   BUT I still have a question. If you take a look at my site the fields and texts are still very close together.

   Can you tell me how I put more space between them?

   Thank you in advance once again
   Christian

7. krolly
   Member
   Posted 11 months ago #
   

   I have a kind of the same problem, please look at:

   http://www.investors-overseas.co.uk/newsletter/

   I need to format the form so as the lenght of the fields are longer, and so as it does not look all joit together,

   thanks

8. mc_nate
   Member
   Posted 11 months ago #
   

   Hey there Loppelyst!

   That can be adjusted by adding some padding or a margin to the fields in your CSS, as well. It really depends on how you want things to look and how much padding you're looking to add. However, using either Firebug for Firefox or Chrome's built-in Developer Tools, you can pull out the specific class that you'll need to make changes to in your CSS. To add padding to the whole field (label and input box), you'll use something like this:

   .mc_merge_var {
   margin-top: 10px;
   }

   For Krolly, you'll want to do somewhat the same thing. We covered how to break the fields onto their own line, above. However, for additional styling, you'll want to use Firebug or Developer Tools to isolate the specific classes and ids you want to make edits to.

   From there, you'll add that CSS to your site's "Style.css" file. :)

   Let us know if we can help with anything else!

9. Loppelyst
   Member
   Posted 11 months ago #
   

   Hi mc_nate

   Thank you very much for your kind help.

   I will try this.

   Best,
   Christian

10. Loppelyst
    Member
    Posted 11 months ago #
    

    I tried to add it to the bottom of flick.css where I also added the code that put the fields in line.

    But it did not work. I am sure I am doing something wrong like putting the code in the wrong place but where to put it then? I hope you can point me to the correct location.

    Thanks in advance
    Christian

11. mc_nate
    Member
    Posted 11 months ago #
    

    Hey there, Christian!

    You'll need to add the CSS to your "Style.css" file. That should take care of it! :)

    Cheers

12. Loppelyst
    Member
    Posted 10 months ago #
    

    Hi again mc_nate

    I tried your suggestion but unfortunately it did not work.

    I am hoping you have another suggestion? Maybe it is me who places the piece of code wrong? I have just placed it at the bottem of the style.css file.

    Kind regards,
    Christian

13. mc_nate
    Member
    Posted 10 months ago #
    

    Hey Loppelyst!

    I had a look at the site, and I do see the margins for the Flick.css file, but nothing for the Style.css file. Try adding it there, instead and that should take care of it!

Topic Closed

This topic has been closed to new replies.