Black Box Under Post, White in Sidebar

Hi Greg,

Sure thing.

The easiest (and sure-fire) way to do this would be to wrap the form you add to the end of all your posts in another element, so we can then target this element in our CSS selector.

function mytheme_add_signup_form_to_posts( $content ) {
    if ( is_single() && get_post_type() == 'post' ) {
        $content .= '<div class="end-of-post-optin">'. mc4wp_get_form() . '</div>';
    }
    return $content;
}

add_filter( 'the_content', 'mytheme_add_signup_form_to_posts' );

(based on: add MailChimp sign-up form to end of all posts)

Then, to add a black background to just this form, we can use the following CSS rule.

.end-of-post-optin .mc4wp-form {
	background: black;
	color: white;
	padding:25px;
	text-align:center;
}

Hope that helps! If you have a quick minute, a plugin review here on WP.org would make me really happy.

Hi Greg,

You can upgrade to MailChimp for WP Pro which lets you create multiple forms. This way, you can create short and more extensive forms or alter the text in the various forms you show throughout your website.

If you’re not afraid of adding code to your theme its functions.php file, you can also add the title programmatically.

function mytheme_add_signup_form_to_posts( $content ) {
    if ( is_single() && get_post_type() == 'post' ) {
        $content .= '<div class="end-of-post-optin">';
        $content .= '<h3>Get Updates! Keep Growing!</h3>';
        $content .= mc4wp_get_form();
        $content .= '</div>';
    }
    return $content;
}

add_filter( 'the_content', 'mytheme_add_signup_form_to_posts' );

This approach is a little less flexible but I suppose it does the trick. 🙂

Hi Greg,

Yes, I understood. You can do that with the example I showed you or by upgrading to Pro and then creating two different forms, one for the sidebar and one for at the end of your posts.

Hope that helps!