• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar

WP SITES

2551

Original Genesis Tutorials & 6000+ Guaranteed Code

Snippets

  • Support
  • Newsletter
  • Register
  • Videos
  • Log in

Add Widget On Page Inside Content Area

To display a widget on a page, you could install a plugin which creates a shortcode.

Or you could simply add a few extra lines of PHP to your code that creates your widget.

This tutorial provides 2 code snippets you can use to add a new widget area within the body of your content area.

  1. The 1st snippet works with Genesis
  2. The 2nd snippet works with any theme

This example show you the widget text between the 1st and 2nd paragraphs in a post.

Widget Within Body of Content

The PHP simply creates a new widget with a shortcode.

Add the PHP code to your functions file and the shortcode to your text editor.

Genesis Widget Area Shortcode

genesis_register_sidebar( array(
    'id' => 'wpsites-widget',
    'name' => __( 'Custom Widget', 'genesis' ),
    'description' => __( 'Custom Widget Area', 'childtheme' ),
) );

add_shortcode( 'wpsites_widget', 'add_genesis_widget_area' );
function add_genesis_widget_area() {
    ob_start();
    genesis_widget_area( 'wpsites-widget', array(
    'before' => '<div class="wpsites-widget widget-area">',
    'after'  => '</div>',
    ) );
    $wpsiteswidget = ob_get_contents();
    ob_end_clean();
    return $wpsiteswidget;

}

// Add this short code anywhere in your editor
[wpsites_widget]

Any Themes Widget Area Shortcode

register_sidebar( array(
    'id' => 'wpsites-widget',
    'name' => __( 'Custom Widget', 'wpsites' ),
    'description' => __( 'Custom Widget Area', 'wpsites' ),
    'before_widget' => '<div>',
    'after_widget' => '</div>',
) );

add_shortcode( 'wpsites_widget', 'wpsites_shortcode_widget_area' );
/**
 * @author    Brad Dalton
 * @link   https://wp.me/p1lTu0-eJI
 */
function wpsites_shortcode_widget_area() {
    ob_start();
    dynamic_sidebar( 'wpsites-widget', array(
    'before' => '<div class="wpsites-widget widget-area">',
    'after'  => '</div>',
    ) );
    $wpsiteswidget = ob_get_contents();
    ob_end_clean();
    return $wpsiteswidget;

}
// Add this short code anywhere in your editor
[wpsites_widget]

Related Tutorials

  • How To Add A Email Opt In Form In The Content Area of a Page
  • Display Ads After Specific Paragraph on Single Posts
  • Add Social Icons Widget to Nav Menu – 2 Different Examples

The Content

Primary Sidebar

How it works :

I write tutorials for you which include the custom code you need for a flat $49.99 fee. You get 1 tutorial request as well as access to all 2500+ existing tutorials for 1 month.

  • Premium Members Only
  • Access Premium Tutorials
  • Support