How can I create another instance of my custom shortcode

Question

I've created a custom shortcode which takes category slug and number of posts as parameters and creates a loop with WP_Query and outputs the posts from db. But I'm unable to use it more than one time the category slugs are different and also I've mapped the shortcode into visual composer plugin but inside at the frontend the shortcode output is outside visual composer column div.

Here is my shortcode code:

$postBox_1_attr = shortcode_atts(array(
        'kategoria' => 'lajme',
        'nr_postimeve' => 5,
    ),$atts);

    $kategoria = $postBox_1_attr[ 'kategoria' ];
    $nrPostimeve = $postBox_1_attr[ 'nr_postimeve' ];

    $sql = new WP_Query( array( 
        'category_name' => $kategoria,
        'posts_per_page' => 1,
        'post_status' => 'publish'
        ) );


     if ( $sql->have_posts() ) : ?>

    <div class="vc_col-sm-8">
     <div class="box-1">

     <?php while ( $sql->have_posts() ) : $sql->the_post(); ?>
        <div class="headline">
            <?php the_post_thumbnail() ?>

            <a href="<?php the_permalink() ?>">
                <h4> <?php the_title() ?></h4>
                <p> <?php the_excerpt() ?> </p>
            </a>



            <?php
            endwhile;
            wp_reset_postdata();
            endif;
            ?>

        </div> <!-- end featured post -->

        <div class="recentPosts">
        <?php 
            $secondSql = new WP_Query( array( 
            'category_name' => $kategoria,
            'posts_per_page' => $nrPostimeve,
            'post_status' => 'publish',
            'offset' => 1
            ) );

            if ( $secondSql->have_posts() ) : 
            while ( $secondSql->have_posts() ) : $secondSql->the_post(); 
        ?>

            <div class="small-items">

                <div class="thumb">
                    <?php the_post_thumbnail() ?>
                </div>

                <div class="title">
                    <a href="<?php the_permalink() ?>">
                        <h4> <?php the_title() ?></h4>
                    </a>
                </div>

            </div> <!-- end single item -->

    <?php 
         endwhile; 
         wp_reset_postdata();
         endif;
     ?>
          </div> <!-- endSidePosts --> 
     </div> <!-- end BoxLayout -->
     </div>

UPDATE:

I forgot to include at the question that I was loading the shortcode code from a separate .php file

This is the code and function for the shortcode creation at themes functions.php file

function postBoxes_1( $atts ){
    include('post-layouts/post-box-1.php'); /* earlier I had include_once and that was the problem */
}

add_shortcode('postBox1','postBoxes_1');

Now the only problem is that when I use as mapped visual composer shortcode it doesn't output the shortcode inside the column div. With raw shortocode it works perfectly, but I was thinking to make it easier for the website moderators to play with the values from a GUI interface.

Answer 1

Okay here are the solutions for my problems here for the people having the same problem.

1 - First problem was I was unable to get the shortcode to work in multiple instances and that was because I used include_once at the shortcode function instead of include to include the separate php template.

2 - The second problem was that when I mapped my shortcode inside Visual Composer plugin at output the content generated from my shortcode was outside of the column div.

The solution to this is adding this part of code at the shortcode function.

function postBoxes_1( $atts ){
    ob_start();
    include('post-layouts/post-box-1.php');

    return ob_get_clean();
}

add_shortcode('postBox1','postBoxes_1');