Horizontal Opt-in box in footer of Parallax Pro

[ashjoielee]

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!

[kristabradford]

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

---

Thank you!
Krista Bradford
CEO The Good Search | Intellerati

[ashjoielee]

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

[Brad Dalton]

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

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

---

Tutorials for StudioPress Themes.

[seanaske]

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.

[ashjoielee]

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)

[Tom]

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.
[ Follow me: Twitter ] [ Follow Themes: Twitter ] [ My Favourite Webhost ]

[seanaske]

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.

[ashjoielee]

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)

[Tom]

@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.
[ Follow me: Twitter ] [ Follow Themes: Twitter ] [ My Favourite Webhost ]

[Brad Dalton]

This is how i did it http://wpsites.net/web-design/display-e-mail-subscribe-box-inline-in-footer-of-parallax-pro-theme/

---

Tutorials for StudioPress Themes.

[odellmccants]

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.

[Author]

Posts