I am currently working on this website which uses a Wordpress theme designed by one Themeforest author. As can be seen via the link and the following screenshot from the same page, the theme's Portfolio (Custom Post Type) utilises 8 columns for textual and any other data -- with 4 other other columns to its right used in rendering a meta-box.
My issue is largely with the blank space under the meta-box. The page's design is such that while only a portion of those 4 columns are used for the box, the rest of that space beneath it goes unused.
I am looking to amend this design; I'd like to fit in other plugins (a Newsletter sign up box, for instance) below the meta-box in the space bordered in Orange and am unsure on what would be the best way to go about it.
The theme author is also unresponsive which rules out asking them about the same. The code used in the design of the pictured portion of the page is as follows --
<div class="large-12 medium-12 columns">
<h2 class="portfolio-detail-title"><?php the_title(); ?></h2>
</div>
<div class="portfolio-detail-left large-8 medium-8 columns">
<div class="portfolio-detail-text">
<?php while ( have_posts() ) : the_post(); ?>
<?php the_content(); ?>
<?php endwhile; // end of the loop. ?>
</div>
</div>
<div class="portfolio-detail-right large-4 medium-4 columns ">
<div class="portfolio-detail-inner">
<div class="portfolio-detail">
<div class="portfolio-detail-content"><i class="fa fa-tag"></i> <span><?php the_terms( get_the_ID(), 'portfolio_categories' ); ?></span></div>
<div class="portfolio-detail-content"><i class="fa fa-user"></i> <span><?php echo esc_attr( $portfolio_client ) ?></span></div>
<div class="portfolio-detail-content"><i class="fa fa-home"></i> <span><?php echo esc_attr( $portfolio_location ) ?></span></div>
<div class="portfolio-detail-content"><i class="fa fa-bookmark-o"></i> <span><?php echo esc_attr( $portfolio_skills ) ?></span></div>
<div class="portfolio-detail-content"><i class="fa fa-cogs gears"></i> <span><?php echo esc_attr( $portfolio_rates ) ?></span></div>
<div class="portfolio-detail-url"><i class="fa fa-chain"></i> <a href="<?php echo esc_url( $portfolio_url ) ?>"><span><?php echo esc_url( $portfolio_url ) ?></span></a></div>
<div class="portfolio-detail-content"><i class="fa fa-facebook"></i> <span><?php echo '<a href="esc_attr( $portfolio_rates )"></a>' ?></span></div>
</div>
</div>
</div>
</div>
Is there any plausible way to render that blank space usable?
Thank you.