Newsletter widget after post Genesis 2.0

[Reginald]

Hi guys

I have a question. I followed Brian's guide here: http://www.briangardner.com/email-newsletter-signup-box/

I can see the signup box on widget screen but the email box doesn't show up on live page. I tested with different browsers (cleared cache too) but doesn't seem to work.

I am using Genesis Sample and with Genesis 2.0 and HTML5.

Do you have any idea what is wrong? Here's the link: http://www.reginaldchan.net/blogging-experience/

Thank you.

---

Website | Facebook | Twitter | Google+ | Editorial Sumo

http://www.reginaldchan.net

[Brad Dalton]

The code uses the old XHTML hooks so you need to replace:

genesis_after_post_content

With

genesis_entry_footer

Here's the working code with new HTML 5 hook

//* Register newsletter widget area
genesis_register_sidebar( array(
	'id'		=> 'newsletter',
	'name'		=> __( 'Newsletter', 'custom-theme' ),
	'description'	=> __( 'This is the newsletter section.', 'custom-theme' ),
) );

//* Add the newsletter widget after the post content
add_action( 'genesis_entry_footer', 'custom_add_newsletter_box', 5 );
function custom_add_newsletter_box() {
	if ( is_singular( 'post' ) )
	genesis_widget_area( 'newsletter', array(
		'before' => '<div id="newsletter">',
	) );
}

You can change the 5 to 15 if you want to move the box below the post meta.

---

Tutorials for StudioPress Themes.

[Reginald]

Hi Brad,

Thanks for that. I have another 'stupid' question I hope you don't mind.

What happens if I want to add another widget area below the newsletter box (above) but above the author box?

Which part should I amend the code?

Thank you so much for your assistance.

---

Website | Facebook | Twitter | Google+ | Editorial Sumo

[Brad Dalton]

The name of the function and a unique i.d:

//* Register newsletter widget area
genesis_register_sidebar( array(
    'id'        => 'custom',
    'name'      => __( 'New Widget', 'custom-theme' ),
    'description'   => __( 'This is the new widget section.', 'custom-theme' ),
) );
 
//* Add the newsletter widget after the post content
add_action( 'genesis_entry_footer', 'custom_widget_box', 8 );
function custom_widget_box() {
    if ( is_singular( 'post' ) )
    genesis_widget_area( 'custom', array(
        'before' => '<div id="custom">',
    ) );
}

---

Tutorials for StudioPress Themes.

[Jenny]

Yay thank you for this. I finally got my related posts widget fixed *hugs*

[Brad Dalton]

No worries Jenny.

---

Tutorials for StudioPress Themes.

[Reginald]

Hey Brad,

Thanks for that! One question (another). How to style the custom one?

The newsletter one is:
/*
Newsletter
------------------------------------------------------------ */

#newsletter {
background-color: #222;
color: #fff;
line-height: 1.5;
padding: 32px;
padding: 2rem;
text-align: center;
}

#newsletter p {
margin-bottom: 24px;
margin-bottom: 1.5rem;
}

#newsletter input {
width: 50%;
}

I can't just change #newsletter to #custom right?

Sorry if my question is a little misleading 🙂

---

Website | Facebook | Twitter | Google+ | Editorial Sumo

[Brad Dalton]

You can use the same class to style both.

This way you don't need to duplicate the CSS.

Or you can duplicate and modify the CSS and use the new class .

---

Tutorials for StudioPress Themes.

[Reginald]

Hi Brad

Thanks for your quick reply.

So I assume the class is newsletter and custom?

Being said that (assuming it is correct), how can I style them both using the same css?

Is it set as #newsletter #custom ?

Again, I might sound stupid so, please bear with me 🙂 Haha!

---

Website | Facebook | Twitter | Google+ | Editorial Sumo

[Brad Dalton]

The CSS is already included in the style sheet for the newsletter selector so you can use it in your custom widget.

No need to add any more CSS.

Change this:

<div id="custom"

To this in the code above

<div id="newsletter"

So here's the code now:

//* Register newsletter widget area
genesis_register_sidebar( array(
    'id'        => 'custom',
    'name'      => __( 'New Widget', 'custom-theme' ),
    'description'   => __( 'This is the new widget section.', 'custom-theme' ),
) );
  
//* Add the newsletter widget after the post content
add_action( 'genesis_entry_footer', 'custom_widget_box', 8 );
function custom_widget_box() {
    if ( is_singular( 'post' ) )
    genesis_widget_area( 'custom', array(
        'before' => '<div id="newsletter">',
    ) );
}

---

Tutorials for StudioPress Themes.

[Reginald]

Hey mate!

Thanks for that.

Looks good. If I want to place it after post meta,

I just change this:

add_action( 'genesis_entry_footer', 'custom_widget_box', 8 );

to

add_action( 'genesis_entry_footer', 'custom_widget_box', 15 );

right?

---

Website | Facebook | Twitter | Google+ | Editorial Sumo

[Brad Dalton]

Spot on.

---

Tutorials for StudioPress Themes.

[[email protected]]

@Reginald: Thank you for posting this coding issue as I was experiencing the very exact problem.

@Brad: You are awesome at what you do and very timely and prompt I might add. Thank you for the problem solving response(s).

[Brad Dalton]

You're welcome Arnold.

---

Tutorials for StudioPress Themes.

[kdmpublishing]

@braddalton, thank you for posting this fix. I was wondering why the code worked on my other sites that have themes that are not upgraded for html 5 and why it wouldn't work on my site with the Epik Theme which is upgraded. Tried to add in the code a bunch of times, and couldn't figure out why it didn't work. I will keep both copies of the code depending on the studio press theme I have.

Thanks again

[Brad Dalton]

@kdmpublishing Please send me a copy of your theme files and i'll test it. I do own that theme but maybe the new version is slightly different. [email protected]

---

Tutorials for StudioPress Themes.

[kdmpublishing]

Once I added in the updated code that you provided for the functions.php it worked fine. I set it up on my main site that uses the epik theme (v1.3) (see an example here http://wpclientsatisfaction.com/tips-plugin-developers/) and it worked. Now when I originally tried with the code on Brian's page, it didn't work on the Epik updated version.

Brian's code did however, work on the site that I use the Fabricated theme since that is not updated for html 5 (see example here http://quickstartminisites.com/home-decorating-niche-minisite/)

If you still need me to send you the functions file for Epik, sure just let me know.

Donesia Muhammad (kdmpublishing)

[Author]

Posts