Want to display the Save This form directly before or after your recipe card, rather than inside it? As of Hubbub Pro 2.31.0, this is built in. No code needed!

Supported recipe card plugins: WP Recipe Maker, MV Create, and Tasty Recipes.

How to set it up #

1. In your WordPress Admin, go to Hubbub > Save This > Forms.
2. On the form you’d like to use, make sure Auto-insert this form is on.
3. Under Position, check Before the recipe card or After the recipe card. (You can check other positions too. The form is inserted once at each position you choose.)
4. Click Save Changes.

Good to know #

• No recipe card on the post? The form is placed at the bottom of the post instead.
• More than one recipe card? The form goes beside the first recipe card in the post.
• Posts split into multiple pages? The form goes beside the recipe card on the page that has it, and at the bottom of the other pages.
• Want a different form near your recipe card than elsewhere in the post? Create a second form and give it the recipe card position. See How to Create Multiple Save This Forms.
• Want the form inside the recipe card instead? See How to add Save This to a Recipe Card.

---

Using an older version of Hubbub Pro? #

If you can’t update to 2.31.0 yet, you can use one of the PHP snippets below. Once you update, remove the snippet and use the built-in position instead, or you’ll see two forms.

WP Recipe Maker #

Add the following snippet to your site to automatically place the Save This form directly above every WP Recipe Maker recipe card.

add_filter( 'the_content', 'nerdpress_save_form_before_recipe_card' );
function nerdpress_save_form_before_recipe_card( $content ) {
    if ( ! is_singular() ) {
        return $content;
    }

    $save_form = do_shortcode( '[hubbub_save_this]' );

    $content = preg_replace(
        '/(<div[^>]+class="[^"]*wprm-recipe-container[^"]*"[^>]*>)/i',
        $save_form . '$1',
        $content,
        1
    );

    return $content;
}

---

Tasty Recipes #

Add the following snippet to your site to automatically place the Save This form directly above every Tasty Recipes recipe card.

add_filter( 'the_content', 'nerdpress_save_form_before_tasty_recipe_card' );
function nerdpress_save_form_before_tasty_recipe_card( $content ) {
    if ( ! is_singular() ) {
        return $content;
    }

    $save_form = do_shortcode( '[hubbub_save_this]' );

    $content = preg_replace(
        '/(<div[^>]+class="[^"]*tasty-recipes[^"]*"[^>]*>)/i',
        $save_form . '$1',
        $content,
        1
    );

    return $content;
}

---

How to Add the Snippet to Your Site #

The easiest way to add a snippet to your site is with a code snippets plugin. Two popular free options are WPCode and Code Snippets — instructions for both are below.

WPCode #

1. In your WordPress dashboard, go to Code Snippets > + Add Snippet.
2. Choose Add Your Custom Code (New Snippet) and click Use Snippet.
3. Give the snippet a name you’ll recognize, such as Save This Above Recipe Card.
4. Set the Code Type to PHP Snippet.
5. Paste in the snippet for your recipe card plugin.
6. Under Insertion, make sure it is set to Auto Insert and the location is Run Everywhere (or Frontend Only).
7. Toggle the snippet to Active and click Save Snippet.

Code Snippets #

1. In your WordPress dashboard, go to Snippets > Add New.
2. Give the snippet a name you’ll recognize, such as Save This Above Recipe Card.
3. Paste in the snippet for your recipe card plugin.
4. Under Run snippet, select Only run on site front-end.
5. Click Save Changes and Activate.

---

Once activated, visit a post with a recipe card to confirm that the Save This form is appearing in the right spot.

If the Save This form isn’t appearing beside your recipe card, clear all caching on your site and check that your recipe card is from WP Recipe Maker, MV Create, or Tasty Recipes. Still stuck? Reach out to support@morehubbub.com, and we would be more than happy to help!