• 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

E-mail sign-up banners

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 › E-mail sign-up banners

This topic is: not resolved

Tagged: e-mail, opt-in, sign up

  • This topic has 8 replies, 4 voices, and was last updated 8 years, 1 month ago by chrislines.
Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • February 5, 2015 at 3:26 am #139768
    chrislines
    Member

    Hi,

    I want to create e-mail sign up sections on specific pages of my site.

    Examples: at the top here: http://jilllynndesign.com/ or half way down the page here: http://connectwithcopy.com/

    Any idea how I would achieve this? I don't really know where to start. I'm assuming I need to create the areas in functions.php

    I have the mail chimp sign up code, I just need the sections/widgets to paste the code into?

    Thanks for any guidance.

    http://www.chrislines.net
    February 5, 2015 at 1:06 pm #139834
    JanHoek
    Participant

    You can combine mailchimp with . You can use this as a widget.


    Hi, my name is Jan Hoek. Sure, they all say I have a big head, but I like to think it’s way too small for all my ideas.

    February 5, 2015 at 2:00 pm #139854
    Badlywired
    Member

    You can use the plugin https://wordpress.org/plugins/genesis-enews-extended/ with mailchimp (instructions are on the plugin page) and then place the widget in the sidebar you have created for the purpose.

    To create / place the sidebar you can code the sidebar into functions.php following various tutorial / eaxmples or you can use this plugin https://wordpress.org/plugins/genesis-simple-sidebars/ I have never used it (as I am a developer so writing a few lines of code is no bother to me) but I hear it is good.


    My techy blog WordPress and stuff badlywired.com

    February 5, 2015 at 2:03 pm #139856
    desireejester
    Member

    Carrie Dils has a great tutorial (link below) for adding a widget area ( that she uses for a email signup form) below the navigation, but you can replace the Genesis hook to display it other places.

    http://www.carriedils.com/add-widget-area-below-nav/

    February 10, 2015 at 1:56 am #140303
    chrislines
    Member

    Thanks desireejester. That's a great tutorial. Much appreciated. I managed to get that set up on my site.

    Would you mind if I asked, where would be a good place to start learning how to populate the widget with code to create the examples I gave above (Examples: at the top here: http://jilllynndesign.com/ or half way down the page here: http://connectwithcopy.com/)

    I've tried just inserting mailchimp code but it doesn't look how I want and I'd like the widget sign up to look a bit more stylish.

    Thanks.

    February 11, 2015 at 8:13 pm #140558
    desireejester
    Member

    I love using the Genesis E-News Extended plugin for newsletter sign-ups. The forms it displays are prettier out of the box than the Mailchimp code. There is a spot in each instance of the widget settings to place HTML both before and after the form itself, and there are default classes for the plugin built into the Genesis theme CSS that make it super easy to style it however you would like.

    http://genesisgoodies.com/add-email-list-signup/

    February 12, 2015 at 8:28 am #140594
    chrislines
    Member

    Thanks again. I have tried Genesis E-News Extended plugin but I just end up with the forms looking like this: http://www.chrislines.net/test/

    How do I set the size of the e-mail form etc? Do you think this would be down to the mailchimp code or Carrie's Widget areas?

    Many thanks.

    February 12, 2015 at 8:49 am #140595
    desireejester
    Member

    Within the CSS of your child theme, there should be a section under Plugins called Genesis eNews Extended. For instance, in the One Pager theme that I am working with, the code looks like this:

    
    /* Genesis eNews Extended
    --------------------------------------------- */
    
    .enews-widget {
    	color: #999;
    }
    
    .enews-widget .widget-title {
    	color: #fff;
    }
    
    .enews-widget input {
    	margin-bottom: 16px;
    	margin-bottom: 1.6rem;
    }
    
    .enews-widget input:focus {
    	border: 1px solid #ddd;
    }
    
    .enews-widget input[type="submit"] {
    	background-color: #f15123;
    	color: #fff;
    	margin: 0;
    	width: 100%;
    }
    
    .enews-widget input:hover[type="submit"] {
    	background-color: #fff;
    	color: #333;
    }

    To control the size of the form, you can set max height/widths to the .enews-widget class. To style the before and after form text, you can create CSS classes of your own when you write your HTML in the Before Form and After Form boxes and style them accordingly in your CSS file.

    February 12, 2015 at 11:51 am #140616
    chrislines
    Member

    Thanks for your help. I tried to alter code in the CSS and I couldn't make much sense of it. I think this is a bit beyond me. Thanks anyway.

  • Author
    Posts
Viewing 9 posts - 1 through 9 (of 9 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