Horizontal Opt-in box in footer of Parallax Pro

Community Forums Forums Design Tips and Tricks Horizontal Opt-in box in footer of Parallax Pro

This topic is: not resolved

This topic contains 11 replies, has 6 voices, and was last updated by  odellmccants 3 months ago.

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #95352

    ashjoielee
    Member
    Post count: 9

    Hi all,
    Can someone guide me on how to create the horizontal opt-in such as what Brain Gardner has in his footer in the Parallax Pro?

    I’ve tried numerous things, including just adding my aweber opt in code to the footer in a widget. I’m not sure what needs to change in the css?

    Thank you!

    #95392

    kristabradford
    Member
    Post count: 8

    Great question . . . I love to know as well!


    Thank you!
    Krista Bradford
    CEO The Good Search | Intellerati

    #95452

    ashjoielee
    Member
    Post count: 9

    I followed Sridhar’s post on “Horizontal Opt-in with a full width background image in Genesis”…I got close to what I wanted, but his tut is on the opt in being in the middle of the full width image that parallax uses. His tut’s are so helpful, but I really want a small thin bar that doesn’t use an entire section.

    I think this will become more the norm as the new themes are great for this style. Wishing aweber would adjust to follow suit!
    Anyway…hoping someone can post how to do this! :)

    Ash

    #95489

    braddalton
    Participant
    Post count: 10256

    You could inspect the CSS using Firebug from Brian Gardners site.

    Looks like he’s using the MailChimp Embedded form code.


    #95564

    seanaske
    Participant
    Post count: 10

    Can anyone find a demo of what it looks like or it being used on a site? I went back to the demo theme and it looks like it is gone. I’m driving myself crazy thinking I saw something that didn’t exist.

    #95568

    ashjoielee
    Member
    Post count: 9

    I think mailchimp does allow for horizontal opt-in forms. Surprised aweber doesn’t.

    Sites who have this are: minimadesigns.com
    and briangardner.com (in footer)

    #95584

    Tom
    Participant
    Post count: 945

    The horizontal mail CTA on Brian Gardner’s (current) site appears to be a MailChimp plugin with text. The text is floated left, the input form is floated right. (This is in his ‘Altitude’ theme.)

    Mimimadesigns.com uses a widget area (an entire section, “home-section-2″) in Parallax, apparently also with a MailChimp Widget (“mc-embedded-subscribe-form”). It is styled to be horizontal with CSS. You can do this too, pretty much in any widget.

    @kristabradford – I know you are using Parallax … try this. Add the Enews Extended widget. It’s free, baked for Genesis, has excellent support and your theme already has CSS for it. it works with Feedburner, MailChimp, Aweber, FeedBlitz, Constant Contact and others.

    If you wanted to add a CTA for your mailing list after every post, add the Enews widget to the After Entry widget area, then add this bit of CSS to the bottom of style.css:

    #subbox,.enews-subbox {
    width: 29%;
    }
    
    #subbutton {
    width: 10%;
    float: right;
    }
    

    This is for the widget setup with FirstName, LastName, Email and the Go button. It may need some minor tweaks for media queries or if you use a different input field setup.

    @ashjoielee and @seanaske – we’re going to need to know more about what theme(s) you’re using, but try the instructions here and tweak them as needed. This should work for any after-entry widget area, and should need only minor adjustments for other widget areas.


    Choose your next site design from over 350 Genesis themes.
    Updates via GenesisThemes.ca | Twitter | Google+ | Tumblr

    #95882

    seanaske
    Participant
    Post count: 10

    Thanks Tom. I appreciate the run down on the options. I’ll give it a shot and see what I can get to work. Just an FYI, I’m looking at using Streamline Pro for http://www.eastphoenixhomes.com and then possible the parallax for another site.

    #95976

    ashjoielee
    Member
    Post count: 9

    I give up! I’m using Parallax pro…tried everything to get opt in in a horizontal row. Not sure what CSS to copy/add from other sites.

    What I have now is using Magic Action box and it has horizontal CSS added–still not displaying right. :(

    It’s at: ashjoielee.com (in footer)

    #95986

    Tom
    Participant
    Post count: 945

    @ashjoielee : Try this

    .mab-field-name,
    .mab-field-email,
    .mab-field-submit  {
    width: 30% !important;
    float: left;
    }
    
    .userstyle-1.magic-action-box .mab-main-action-wrap form input[type="submit"] {
    margin-top: 0px !important;
    }

    Adjust as necessary for padding, margins, media queries.

    You may have to install Genesis Style Trump to get your style sheets to play nice with each other.

    http://wordpress.org/plugins/genesis-style-trump/


    Choose your next site design from over 350 Genesis themes.
    Updates via GenesisThemes.ca | Twitter | Google+ | Tumblr

    #95989

    braddalton
    Participant
    Post count: 10256
    #115946

    odellmccants
    Member
    Post count: 16

    Magic Action Box plugin! I have been struggling with this on Parallax Pro as well. Magic Action Box instantly and easily gave me what I’ve been trying to do. i’m still learning it but it does the job.

Viewing 12 posts - 1 through 12 (of 12 total)

You must be logged in to reply to this topic.