wordpress theme page not showing plugin gallery

1
votes

I am new to Wordpress. I am trying to build a theme from scratch. I created the page.php which is the following:

<?php
/**
 * The template for displaying pages
 *
 * This is the template that displays all pages by default.
 * Please note that this is the WordPress construct of pages and that
 * other "pages" on your WordPress site will use a different template.
 *
 * @package nameofpackage
 */

get_header(); ?>



<?php get_footer(); ?>

I also installed the NextGen plugin. I created a new page, and use the "add Gallery" button of NextGen; i ended up with 

[ngg src="galleries" ids="1" display="basic_thumbnail"]

inside the text section of the page (the visual section shows the plugin logo in a box).

When i tried to preview the result i only get the header and the footer with nothing in the middle; the inspector shows no presence of the code related to the gallery.

If i try the same thing with ThemeFifteen it works.

So my question is: is there something i need to include in the function.php that allows my theme to include the output of the plugin in the page? thx

2
wordpresswordpress-theming

2 Answers

2
votes

You're missing the WP loop and the_content(), so its absolutely normal to not see anything between the header and the footer. You need something like this for example:

                <?php while ( have_posts() ) : the_post(); ?>

                    <?php get_template_part( 'loop-templates/content', 'page' );//calling the folder with your loop templates ?>

                    <?php
                    // If comments are open or we have at least one comment, load up the comment template.
                    if ( comments_open() || get_comments_number() ) :

                        comments_template();

                    endif;
                    ?>

                <?php endwhile; // end of the loop. ?>

And inside your loop template something like :

<article <?php post_class(); ?> id="post-<?php the_ID(); ?>">

    <header class="entry-header">

        <?php the_title( '<h1 class="entry-title">', '</h1>' ); ?>

    </header><!-- .entry-header -->

    <?php echo get_the_post_thumbnail( $post->ID, 'large' ); ?>

    <div class="entry-content">

        <?php the_content(); ?>

        <?php
        wp_link_pages( array(
            'before' => '<div class="page-links">' . __( 'Pages:', 'understrap' ),
            'after'  => '</div>',
        ) );
        ?>

    </div><!-- .entry-content -->

    <footer class="entry-footer">

        <?php edit_post_link( __( 'Edit', 'understrap' ), '<span class="edit-link">', '</span>' ); ?>

    </footer><!-- .entry-footer -->

</article><!-- #post-## -->

This is very common way to structure your theme, but please spend some time on beginners tutorials about developing custom themes. It's very easy to get the basic concepts, you'll need couple of hours to get the idea ! This is just an example I want to stress on that, quick and dirty fix of your code would be:

<?php
/**
 * The template for displaying pages
 *
 * This is the template that displays all pages by default.
 * Please note that this is the WordPress construct of pages and that
 * other "pages" on your WordPress site will use a different template.
 *
 * @package nameofpackage
 */
    get_header(); ?>

                    <?php while ( have_posts() ) : the_post(); ?>
                           <?php the_title(); ?>
                           <?php the_content(); ?>
                    <?php endwhile; // end of the loop. ?>

    <?php get_footer(); ?>
-1
votes

What you're looking for is do_shortcode() See the docs

Make sure to echo it as well.

<?php 

get_header();

echo do_shortcode('[ngg src="galleries" ids="1" display="basic_thumbnail"]');

get_footer();

You could also use apply_filters() and pass in the 'the_content' hook. That would render your shortcode with the same hooks/filters as used br the wysiwyg editor in the back-end but ultimately it's just using do_shortcode() behind the scenes.

<?php 

get_header();

echo apply_filters('the_content', '[ngg src="galleries" ids="1" display="basic_thumbnail"]');

get_footer();