• Skip to main content
  • Skip to forum navigation

StudioPress

  • Shop for Themes
  • My StudioPress

Forum navigation

  • Home
  • General Genesis Discussions
  • StudioPress Themes
  • Genesis Blocks
    • Genesis Blocks
    • Genesis Custom Blocks
  • Retired Themes
  • FAQs
  • Forum Rules
  • Internationalization and Translations
  • Forum Bugs and Suggestions
  • Forum Log In

Are You Using The WordPress Block Editor?

Genesis now offers plugins that help you build better sites faster with the WordPress block editor (Gutenberg). Try the feature-rich free versions of each plugin for yourself!

Genesis Blocks Genesis Custom Blocks

eNews Extended Plugin & eleven40 Pro – Submit button + Email adress in same line

Welcome!

These forums are for general discussion on WordPress and Genesis. Official support for StudioPress themes is offered exclusively at My StudioPress. Responses in this forum are not guaranteed. Please note that this forum will require a new username, separate from the one used for My.StudioPress.

Log In
Register Lost Password

Community Forums › Forums › Archived Forums › Design Tips and Tricks › eNews Extended Plugin & eleven40 Pro – Submit button + Email adress in same line

This topic is: resolved

Tagged: Eleven40-Pro, eNews extended, Genesis eNews Extended

  • This topic has 7 replies, 2 voices, and was last updated 9 years, 9 months ago by Anita.
Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • August 17, 2013 at 5:03 am #57021
    markmaslow
    Participant

    Dear all,

    I use the Genesis eNews Extended Plugin in the Footer Widget Area of the eleven40 Pro Theme.

    Since I updated from eleven40 --> eleven40 Pro, the "Submit button" slipped into a new line and therefore takes up a lot space.

    For the previous eleven40 Theme, I managed to get the button next to the imput field (78% width input vs. 22% button).

    Since, I'm no CSS pro, I currently lost how to do that for the new theme (eleven 40 pro).

    This is, what is currently in my style.css

    /* Genesis eNews Extended
    --------------------------------------------- */
    
    .enews-widget input {
    	margin-bottom: 16px;
    	margin-bottom: 1.6rem;
    }
    
    .enews-widget input[type="submit"] {
            width: auto;
            display: block;
            margin: auto;
    }

    I would be more than happy if you could help me get the button one line above as in the tutorial for the Minimum 2.0 theme:

    http://www.brandonkraft.com/uploads/enews-minimum-style-go.png

    Thanks so much in advance!

    Regards,
    Mark

    http://www.marathonfitness.de
    August 18, 2013 at 10:24 am #57164
    Anita
    Keymaster

    Mark, is this for your marathonfitness.de website or a different website? If different, please post the link.


    Love coffee, chocolate and my Bella!

    August 18, 2013 at 10:40 am #57169
    markmaslow
    Participant

    Thanks for your reply!

    This is for http://www.marathonfitness.de.

    August 18, 2013 at 11:11 am #57174
    Anita
    Keymaster

    Try adding the float, margin and width the way I have it here. I think the text below it might go a little wonky, but we can see after you add it.

    .enews-widget input {
    margin-bottom: 16px;
    margin-bottom: 1.6rem;
    width: 45%;
    float: left;
    margin-right: 5px;
    }


    Love coffee, chocolate and my Bella!

    August 18, 2013 at 2:16 pm #57199
    markmaslow
    Participant

    This is great stuff, Anitac.

    Yeah, we're getting closer... Now, the optin-boxes don't take that much space anymore.

    What I would love, to change is, to have the first box take up a whole line and the second one (the one with the email address) ca. 70% and the button right next to it on the right.

    Any ideas?

    Thanks for your help!

    August 18, 2013 at 2:48 pm #57202
    Anita
    Keymaster

    It's close. I had to redo the code so match this up with what you have. The bottom text seems to be rendering before the submit button. I think the only way to get the submit to line up next to the second field is to remove the bottom text.

    .enews-widget input {
    float: left;
    margin-bottom: 1.6rem;
    margin-right: 5px;
    width: 200px !important;
    }

    .enews-widget #subbox1 {
    float: left;
    margin-bottom: 1.6rem;
    margin-right: 5px;
    width: 350px !important;
    }

    .enews-widget input[type="submit"] {
    display: block;
    float: right;
    margin: auto;
    width: auto;
    }


    Love coffee, chocolate and my Bella!

    August 18, 2013 at 3:13 pm #57209
    markmaslow
    Participant

    You are fantastic! I got it!

    Entering your code made the layout appear ALMOST as I desired.

    I tried a few tweaks and now it's perfect.

    This is the final solution:

    .enews-widget input {
         float: left;
         margin-bottom: 1.6rem;
         margin-right: 5px;
         width: 68% 
    }
    
    .enews-widget #subbox1 {
        float: left;
        margin-bottom: 1.6rem;
        margin-right: 5px;
        width: 100%
    }
    
    .enews-widget input[type="submit"] {
         display: block;
         float: right;
         margin: auto;
         width: 28%;
    }

    The text beneath seems to be OK so far!

    Thank you so much...!

    August 18, 2013 at 3:26 pm #57212
    Anita
    Keymaster

    Oh, you're welcome. Glad you got it.


    Love coffee, chocolate and my Bella!

  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)
  • The forum ‘Design Tips and Tricks’ is closed to new topics and replies.

CTA

Ready to get started? Create a site or shop for themes.

Create a site with WP EngineShop for Themes

Footer

StudioPress

© 2023 WPEngine, Inc.

Products
  • Create a Site with WP Engine
  • Shop for Themes
  • Theme Features
  • Get Started
  • Showcase
Company
  • Brand Assets
  • Terms of Service
  • Accptable Usse Policy
  • Privacy Policy
  • Refund Policy
  • Contact Us
Community
  • Find Developers
  • Forums
  • Facebook Group
  • #GenesisWP
  • Showcase
Resources
  • StudioPress Blog
  • Help & Documentation
  • FAQs
  • Code Snippets
  • Affiliates
Connect
  • StudioPress Live
  • StudioPress FM
  • Facebook
  • Twitter
  • Dribbble