How to Create Download Box Using Plugin Meta Box

Posted on February 15th, 2018, 790 viewed

Meta box wordpress – the discussion this time is meta box, previously I have discussed it also how to create meta box in wordpress and in this tutorial I will explain how to make download box on wordpress theme and you can also display download box in custom post type or regular post, it’s up to you.

This tutorial wordpress meta box is a request from my friend that is Sultan, who want to make a meta box download to be installed on his blog. if you happen to also need this tutorial, you can give thank the sultan for request this tutorial. you can also request tutorial, theme and ask around code here Out of Topic.

Making articles while listening to songs is fun.. make you relax and enjoy, you can also listen to my favorite song on My fav music.

See Also :Kaskus Emoticons WordPress Plugins
How to Install Font Awesome 5
How to Install Anti Adblock with Blockadblock

Good news too, I get a wordpress theme that is still raw made by my friend, which I will continue and share on the blog. let’s just say this is a collaboration 🙂 i hope you really like the upcoming theme.

Important!! you must have wordpress meta box plugin made in metabox.io in your theme.
Download Plugin Meta Box How to Install Plugin WordPress

How To Install Meta Box in Theme

Here we will practice how to create download boxes with 720p and 480p quality as an example of this tutorial.
1. Log in to your WordPress Dashboard.
2. Go to Appearance > Editor
3. Select functions.php
4. Copy the code below and paste at the end of the line functions.php.

/*
 * Function Download Box
 * @yuuktihemes
 *
 */
function yuukithemes_downloadbox( $meta_boxes ) {
  $prefix = '';

  $meta_boxes[] = array(
    'id' => 'downloadbox',
    'title' => esc_html__( 'Download Box', 'yuukithemes' ),
    'post_types' => array( 'post' ),
    'context' => 'after_editor',
    'priority' => 'default',
    'autosave' => true,
    'fields' => array(
      array(
        'id' => $prefix . '720p_link1',
        'type' => 'text',
        'name' => esc_html__( '[720P] Link 1', 'yuukithemes' ),
        'before' => '<h4 style="text-transform:uppercase;margin:15px 0;border-left:5px solid #3498DB;padding-left:5px;">Quality - 720P</h4>',
        'size' => 90,
      ),
      array(
        'id' => $prefix . '720p_link2',
        'type' => 'text',
        'name' => esc_html__( '[720P] Link 2', 'yuukithemes' ),
        'size' => 90,
      ),
      array(
        'id' => $prefix . '720p_link3',
        'type' => 'text',
        'name' => esc_html__( '[720P] Link 3', 'yuukithemes' ),
        'size' => 90,
      ),
      array(
        'id' => $prefix . '720p_link4',
        'type' => 'text',
        'name' => esc_html__( '[720P] Link 4', 'yuukithemes' ),
        'size' => 90,
      ),
      array(
        'id' => $prefix . '480p_link1',
        'type' => 'text',
        'name' => esc_html__( '[480P] Link 1', 'yuukithemes' ),
        'before' => '<h4 style="text-transform:uppercase;margin:15px 0;border-left:5px solid #3498DB;padding-left:5px;">Quality - 480P</h4>',
        'size' => 90,
      ),
      array(
        'id' => $prefix . '480p_link2',
        'type' => 'text',
        'name' => esc_html__( '[480P] Link 2', 'yuukithemes' ),
        'size' => 90,
      ),
      array(
        'id' => $prefix . '480p_link3',
        'type' => 'text',
        'name' => esc_html__( '[480P] Link 3', 'yuukithemes' ),
        'size' => 90,
      ),
      array(
        'id' => $prefix . '480p_link4',
        'type' => 'text',
        'name' => esc_html__( '[480P] Link 4', 'yuukithemes' ),
        'size' => 90,
      ),
    ),
  );

  return $meta_boxes;
}
add_filter( 'rwmb_meta_boxes', 'yuukithemes_downloadbox' );
meta box
5. Click Update File

How to display Meta Box on page

After you install the meta box function then the next step is to bring up the meta box in the blog page.
1. Still in the editor, select single.php
2. Copy the code below and paste the code right under the code <?php echo the_content(); ?>

<?php 
    /* 
     * Yuukithemes - Download Box
     * @yuukithemes.com
     *
     */
    $name1 = 'Elsfile';
    $name2 = 'Google Drive';
    $name3 = 'Zippyshare';
    $name4 = 'Mirror';
    $hd1 = get_post_meta(get_the_ID(), '720p_link1', true);
    $hd2 = get_post_meta(get_the_ID(), '720p_link2', true);
    $hd3 = get_post_meta(get_the_ID(), '720p_link3', true);
    $hd4 = get_post_meta(get_the_ID(), '720p_link4', true);
    $pahe1 = get_post_meta(get_the_ID(), '480p_link1', true);
    $pahe2 = get_post_meta(get_the_ID(), '480p_link2', true);
    $pahe3 = get_post_meta(get_the_ID(), '480p_link3', true);
    $pahe4 = get_post_meta(get_the_ID(), '480p_link4', true);
    echo '<div class="download_area">';
      if(!empty($hd1) || !empty($hd2) || !empty($hd3) || !empty($hd4)){
      echo '<div class="download_item">
        <strong>'.get_bloginfo('name').' - '.get_the_title().' [720P]</strong>
        <div>';
          echo (!empty($hd1)) ? '<a href="'.$hd1.'" target="_blank">'.$name1.'</a> || ' : '<del>'.$name1.'</del> || ';
          echo (!empty($hd2)) ? '<a href="'.$hd2.'" target="_blank">'.$name2.'</a> || ' : '<del>'.$name2.'</del> || ';
          echo (!empty($hd3)) ? '<a href="'.$hd3.'" target="_blank">'.$name3.'</a> || ' : '<del>'.$name3.'</del> || ';
          echo (!empty($hd4)) ? '<a href="'.$hd4.'" target="_blank">'.$name4.'</a>' : '<del>'.$name4.'</del>';
      echo '</div>
      </div>';
      }
      if(!empty($pahe1) || !empty($pahe2) || !empty($pahe3) || !empty($pahe4)){
      echo '<div class="download_item">
        <strong>'.get_bloginfo('name').' - '.get_the_title().' [480P]</strong>
        <div>';
          echo (!empty($pahe1)) ? '<a href="'.$pahe1.'" target="_blank">'.$name1.'</a> || ' : '<del>'.$name1.'</del> || ';
          echo (!empty($pahe2)) ? '<a href="'.$pahe2.'" target="_blank">'.$name2.'</a> || ' : '<del>'.$name2.'</del> || ';
          echo (!empty($pahe3)) ? '<a href="'.$pahe3.'" target="_blank">'.$name3.'</a> || ' : '<del>'.$name3.'</del> || ';
          echo (!empty($pahe4)) ? '<a href="'.$pahe4.'" target="_blank">'.$name4.'</a>' : '<del>'.$name4.'</del>';
      echo '</div>
      </div>';
      }
    echo '<div style="clear:both;display:block;"></div></div>';
    ?>
meta box
3. Click Update File

Add Style Download Box

1. Entered into style.css
2. Copy the code below and paste the code at the end of the line style.css

/* Yuukithemes - DownloadBox */
.download_area{padding:15px 10px;margin:10px auto;background:#f0f2f5;font-family:'Roboto','Open Sans',Arial,Sans-serif;}
.download_item strong{background:#5ba1d0;border:1px solid #5ba1d0;display:block;padding:7px 10px;color:#fff;font-weight:400;font-size:13px;}
.download_item{margin-bottom:10px;}
.download_item div{background:#fff;padding:7px 8px;color:#d8d8d8;font-size:12px;border:1px solid #dbdfe2;border-top:0;}
.download_item del,.download_item a{padding:0 7px;font-size:13px;color:#0176C9;}
.download_item a:hover{text-decoration:underline;}
.download_item del{color:#cc1f1f;}
meta box
3. Click Update File

RESULT
meta boxmeta box

Source Code Download Box

I also provide some source code for download box with certain quality. here I provide three options,
1. Download box that has the quality 1080, 720P, 480P, 360P
2. Download box that has the quality 1080, 720P, 480P
3. Download box that has the quality 720P and 480P

Download Box 1080, 720P, 480P, 360P

/*
 * Function Download Box
 * @yuuktihemes
 *
 */
function yuukithemes_downloadbox( $meta_boxes ) {
  $prefix = '';

  $meta_boxes[] = array(
    'id' => 'downloadbox',
    'title' => esc_html__( 'Download Box', 'yuukithemes' ),
    'post_types' => array( 'post' ),
    'context' => 'after_editor',
    'priority' => 'default',
    'autosave' => true,
    'fields' => array(
      array(
        'id' => $prefix . '1080p_link1',
        'type' => 'text',
        'name' => esc_html__( '[1080p] Link 1', 'yuukithemes' ),
        'before' => '<h4 style="text-transform:uppercase;margin:15px 0;border-left:5px solid #3498DB;padding-left:5px;">Quality - 1080P</h4>',
        'size' => 90,
      ),
      array(
        'id' => $prefix . '1080p_link2',
        'type' => 'text',
        'name' => esc_html__( '[1080p] Link 2', 'yuukithemes' ),
        'size' => 90,
      ),
      array(
        'id' => $prefix . '1080p_link3',
        'type' => 'text',
        'name' => esc_html__( '[1080p] Link 3', 'yuukithemes' ),
        'size' => 90,
      ),
      array(
        'id' => $prefix . '1080p_link4',
        'type' => 'text',
        'name' => esc_html__( '[1080p] Link 4', 'yuukithemes' ),
        'size' => 90,
      ),
      array(
        'id' => $prefix . '720p_link1',
        'type' => 'text',
        'name' => esc_html__( '[720P] Link 1', 'yuukithemes' ),
        'before' => '<h4 style="text-transform:uppercase;margin:15px 0;border-left:5px solid #3498DB;padding-left:5px;">Quality - 720P</h4>',
        'size' => 90,
      ),
      array(
        'id' => $prefix . '720p_link2',
        'type' => 'text',
        'name' => esc_html__( '[720P] Link 2', 'yuukithemes' ),
        'size' => 90,
      ),
      array(
        'id' => $prefix . '720p_link3',
        'type' => 'text',
        'name' => esc_html__( '[720P] Link 3', 'yuukithemes' ),
        'size' => 90,
      ),
      array(
        'id' => $prefix . '720p_link4',
        'type' => 'text',
        'name' => esc_html__( '[720P] Link 4', 'yuukithemes' ),
        'size' => 90,
      ),
      array(
        'id' => $prefix . '480p_link1',
        'type' => 'text',
        'name' => esc_html__( '[480P] Link 1', 'yuukithemes' ),
        'before' => '<h4 style="text-transform:uppercase;margin:15px 0;border-left:5px solid #3498DB;padding-left:5px;">Quality - 480P</h4>',
        'size' => 90,
      ),
      array(
        'id' => $prefix . '480p_link2',
        'type' => 'text',
        'name' => esc_html__( '[480P] Link 2', 'yuukithemes' ),
        'size' => 90,
      ),
      array(
        'id' => $prefix . '480p_link3',
        'type' => 'text',
        'name' => esc_html__( '[480P] Link 3', 'yuukithemes' ),
        'size' => 90,
      ),
      array(
        'id' => $prefix . '480p_link4',
        'type' => 'text',
        'name' => esc_html__( '[480P] Link 4', 'yuukithemes' ),
        'size' => 90,
      ),
      array(
        'id' => $prefix . '360p_link1',
        'type' => 'text',
        'name' => esc_html__( '[360P] Link 1', 'yuukithemes' ),
        'before' => '<h4 style="text-transform:uppercase;margin:15px 0;border-left:5px solid #3498DB;padding-left:5px;">Quality - 360P</h4>',
        'size' => 90,
      ),
      array(
        'id' => $prefix . '360p_link2',
        'type' => 'text',
        'name' => esc_html__( '[360P] Link 2', 'yuukithemes' ),
        'size' => 90,
      ),
      array(
        'id' => $prefix . '360p_link3',
        'type' => 'text',
        'name' => esc_html__( '[360P] Link 3', 'yuukithemes' ),
        'size' => 90,
      ),
      array(
        'id' => $prefix . '360p_link4',
        'type' => 'text',
        'name' => esc_html__( '[360P] Link 4', 'yuukithemes' ),
        'size' => 90,
      ),
    ),
  );

  return $meta_boxes;
}
add_filter( 'rwmb_meta_boxes', 'yuukithemes_downloadbox' );
    

    <?php 
    /* 
     * Yuukithemes - Download Box
     * @yuukithemes.com
     *
     */
    $name1 = 'Elsfile';
    $name2 = 'Google Drive';
    $name3 = 'Zippyshare';
    $name4 = 'Mirror';
    $ultr1 = get_post_meta(get_the_ID(), '1080p_link1', true);
    $ultr2 = get_post_meta(get_the_ID(), '1080p_link2', true);
    $ultr3 = get_post_meta(get_the_ID(), '1080p_link3', true);
    $ultr4 = get_post_meta(get_the_ID(), '1080p_link4', true);
    $hd1 = get_post_meta(get_the_ID(), '720p_link1', true);
    $hd2 = get_post_meta(get_the_ID(), '720p_link2', true);
    $hd3 = get_post_meta(get_the_ID(), '720p_link3', true);
    $hd4 = get_post_meta(get_the_ID(), '720p_link4', true);
    $pahe1 = get_post_meta(get_the_ID(), '480p_link1', true);
    $pahe2 = get_post_meta(get_the_ID(), '480p_link2', true);
    $pahe3 = get_post_meta(get_the_ID(), '480p_link3', true);
    $pahe4 = get_post_meta(get_the_ID(), '480p_link4', true);   
    $mini1 = get_post_meta(get_the_ID(), '360p_link1', true);
    $mini2 = get_post_meta(get_the_ID(), '360p_link2', true);
    $mini3 = get_post_meta(get_the_ID(), '360p_link3', true);
    $mini4 = get_post_meta(get_the_ID(), '360p_link4', true);
    echo '<div class="download_area">';
      if(!empty($ultr1) || !empty($ultr2) || !empty($ultr3) || !empty($ultr4)){
      echo '<div class="download_item">
        <strong>'.get_bloginfo('name').' - '.get_the_title().' [1080P]</strong>
        <div>';
          echo (!empty($ultr1)) ? '<a href="'.$ultr1.'" target="_blank">'.$name1.'</a> || ' : '<del>'.$name1.'</del> || ';
          echo (!empty($ultr2)) ? '<a href="'.$ultr2.'" target="_blank">'.$name2.'</a> || ' : '<del>'.$name2.'</del> || ';
          echo (!empty($ultr3)) ? '<a href="'.$ultr3.'" target="_blank">'.$name3.'</a> || ' : '<del>'.$name3.'</del> || ';
          echo (!empty($ultr4)) ? '<a href="'.$ultr4.'" target="_blank">'.$name4.'</a>' : '<del>'.$name4.'</del>';
      echo '</div>
      </div>';
      }
      if(!empty($hd1) || !empty($hd2) || !empty($hd3) || !empty($hd4)){
      echo '<div class="download_item">
        <strong>'.get_bloginfo('name').' - '.get_the_title().' [720P]</strong>
        <div>';
          echo (!empty($hd1)) ? '<a href="'.$hd1.'" target="_blank">'.$name1.'</a> || ' : '<del>'.$name1.'</del> || ';
          echo (!empty($hd2)) ? '<a href="'.$hd2.'" target="_blank">'.$name2.'</a> || ' : '<del>'.$name2.'</del> || ';
          echo (!empty($hd3)) ? '<a href="'.$hd3.'" target="_blank">'.$name3.'</a> || ' : '<del>'.$name3.'</del> || ';
          echo (!empty($hd4)) ? '<a href="'.$hd4.'" target="_blank">'.$name4.'</a>' : '<del>'.$name4.'</del>';
      echo '</div>
      </div>';
      }
      if(!empty($pahe1) || !empty($pahe2) || !empty($pahe3) || !empty($pahe4)){
      echo '<div class="download_item">
        <strong>'.get_bloginfo('name').' - '.get_the_title().' [480P]</strong>
        <div>';
          echo (!empty($pahe1)) ? '<a href="'.$pahe1.'" target="_blank">'.$name1.'</a> || ' : '<del>'.$name1.'</del> || ';
          echo (!empty($pahe2)) ? '<a href="'.$pahe2.'" target="_blank">'.$name2.'</a> || ' : '<del>'.$name2.'</del> || ';
          echo (!empty($pahe3)) ? '<a href="'.$pahe3.'" target="_blank">'.$name3.'</a> || ' : '<del>'.$name3.'</del> || ';
          echo (!empty($pahe4)) ? '<a href="'.$pahe4.'" target="_blank">'.$name4.'</a>' : '<del>'.$name4.'</del>';
      echo '</div>
      </div>';
      }
      if(!empty($mini1) || !empty($mini2) || !empty($mini3) || !empty($mini4)){
      echo '<div class="download_item">
        <strong>'.get_bloginfo('name').' - '.get_the_title().' [360P]</strong>
        <div>';
          echo (!empty($mini1)) ? '<a href="'.$mini1.'" target="_blank">'.$name1.'</a> || ' : '<del>'.$name1.'</del> || ';
          echo (!empty($mini2)) ? '<a href="'.$mini2.'" target="_blank">'.$name2.'</a> || ' : '<del>'.$name2.'</del> || ';
          echo (!empty($mini3)) ? '<a href="'.$mini3.'" target="_blank">'.$name3.'</a> || ' : '<del>'.$name3.'</del> || ';
          echo (!empty($mini4)) ? '<a href="'.$mini4.'" target="_blank">'.$name4.'</a>' : '<del>'.$name4.'</del>';
      echo '</div>
      </div>';
      }
    echo '<div style="clear:both;display:block;"></div></div>';
    ?>
    

Result
meta boxmeta box

Download Box 1080, 720P, 480P

/*
 * Function Download Box
 * @yuuktihemes
 *
 */
function yuukithemes_downloadbox( $meta_boxes ) {
  $prefix = '';

  $meta_boxes[] = array(
    'id' => 'downloadbox',
    'title' => esc_html__( 'Download Box', 'yuukithemes' ),
    'post_types' => array( 'post' ),
    'context' => 'after_editor',
    'priority' => 'default',
    'autosave' => true,
    'fields' => array(
      array(
        'id' => $prefix . '1080p_link1',
        'type' => 'text',
        'name' => esc_html__( '[1080p] Link 1', 'yuukithemes' ),
        'before' => '<h4 style="text-transform:uppercase;margin:15px 0;border-left:5px solid #3498DB;padding-left:5px;">Quality - 1080P</h4>',
        'size' => 90,
      ),
      array(
        'id' => $prefix . '1080p_link2',
        'type' => 'text',
        'name' => esc_html__( '[1080p] Link 2', 'yuukithemes' ),
        'size' => 90,
      ),
      array(
        'id' => $prefix . '1080p_link3',
        'type' => 'text',
        'name' => esc_html__( '[1080p] Link 3', 'yuukithemes' ),
        'size' => 90,
      ),
      array(
        'id' => $prefix . '1080p_link4',
        'type' => 'text',
        'name' => esc_html__( '[1080p] Link 4', 'yuukithemes' ),
        'size' => 90,
      ),
      array(
        'id' => $prefix . '720p_link1',
        'type' => 'text',
        'name' => esc_html__( '[720P] Link 1', 'yuukithemes' ),
        'before' => '<h4 style="text-transform:uppercase;margin:15px 0;border-left:5px solid #3498DB;padding-left:5px;">Quality - 720P</h4>',
        'size' => 90,
      ),
      array(
        'id' => $prefix . '720p_link2',
        'type' => 'text',
        'name' => esc_html__( '[720P] Link 2', 'yuukithemes' ),
        'size' => 90,
      ),
      array(
        'id' => $prefix . '720p_link3',
        'type' => 'text',
        'name' => esc_html__( '[720P] Link 3', 'yuukithemes' ),
        'size' => 90,
      ),
      array(
        'id' => $prefix . '720p_link4',
        'type' => 'text',
        'name' => esc_html__( '[720P] Link 4', 'yuukithemes' ),
        'size' => 90,
      ),
      array(
        'id' => $prefix . '480p_link1',
        'type' => 'text',
        'name' => esc_html__( '[480P] Link 1', 'yuukithemes' ),
        'before' => '<h4 style="text-transform:uppercase;margin:15px 0;border-left:5px solid #3498DB;padding-left:5px;">Quality - 480P</h4>',
        'size' => 90,
      ),
      array(
        'id' => $prefix . '480p_link2',
        'type' => 'text',
        'name' => esc_html__( '[480P] Link 2', 'yuukithemes' ),
        'size' => 90,
      ),
      array(
        'id' => $prefix . '480p_link3',
        'type' => 'text',
        'name' => esc_html__( '[480P] Link 3', 'yuukithemes' ),
        'size' => 90,
      ),
      array(
        'id' => $prefix . '480p_link4',
        'type' => 'text',
        'name' => esc_html__( '[480P] Link 4', 'yuukithemes' ),
        'size' => 90,
      ),
    ),
  );

  return $meta_boxes;
}
add_filter( 'rwmb_meta_boxes', 'yuukithemes_downloadbox' );
    

<?php 
    /* 
     * Yuukithemes - Download Box
     * @yuukithemes.com
     *
     */
    $name1 = 'Elsfile';
    $name2 = 'Google Drive';
    $name3 = 'Zippyshare';
    $name4 = 'Mirror';
    $ultr1 = get_post_meta(get_the_ID(), '1080p_link1', true);
    $ultr2 = get_post_meta(get_the_ID(), '1080p_link2', true);
    $ultr3 = get_post_meta(get_the_ID(), '1080p_link3', true);
    $ultr4 = get_post_meta(get_the_ID(), '1080p_link4', true);
    $hd1 = get_post_meta(get_the_ID(), '720p_link1', true);
    $hd2 = get_post_meta(get_the_ID(), '720p_link2', true);
    $hd3 = get_post_meta(get_the_ID(), '720p_link3', true);
    $hd4 = get_post_meta(get_the_ID(), '720p_link4', true);
    $pahe1 = get_post_meta(get_the_ID(), '480p_link1', true);
    $pahe2 = get_post_meta(get_the_ID(), '480p_link2', true);
    $pahe3 = get_post_meta(get_the_ID(), '480p_link3', true);
    $pahe4 = get_post_meta(get_the_ID(), '480p_link4', true);
    echo '<div class="download_area">';
      if(!empty($ultr1) || !empty($ultr2) || !empty($ultr3) || !empty($ultr4)){
      echo '<div class="download_item">
        <strong>'.get_bloginfo('name').' - '.get_the_title().' [1080P]</strong>
        <div>';
          echo (!empty($ultr1)) ? '<a href="'.$ultr1.'" target="_blank">'.$name1.'</a> || ' : '<del>'.$name1.'</del> || ';
          echo (!empty($ultr2)) ? '<a href="'.$ultr2.'" target="_blank">'.$name2.'</a> || ' : '<del>'.$name2.'</del> || ';
          echo (!empty($ultr3)) ? '<a href="'.$ultr3.'" target="_blank">'.$name3.'</a> || ' : '<del>'.$name3.'</del> || ';
          echo (!empty($ultr4)) ? '<a href="'.$ultr4.'" target="_blank">'.$name4.'</a>' : '<del>'.$name4.'</del>';
      echo '</div>
      </div>';
      }
      if(!empty($hd1) || !empty($hd2) || !empty($hd3) || !empty($hd4)){
      echo '<div class="download_item">
        <strong>'.get_bloginfo('name').' - '.get_the_title().' [720P]</strong>
        <div>';
          echo (!empty($hd1)) ? '<a href="'.$hd1.'" target="_blank">'.$name1.'</a> || ' : '<del>'.$name1.'</del> || ';
          echo (!empty($hd2)) ? '<a href="'.$hd2.'" target="_blank">'.$name2.'</a> || ' : '<del>'.$name2.'</del> || ';
          echo (!empty($hd3)) ? '<a href="'.$hd3.'" target="_blank">'.$name3.'</a> || ' : '<del>'.$name3.'</del> || ';
          echo (!empty($hd4)) ? '<a href="'.$hd4.'" target="_blank">'.$name4.'</a>' : '<del>'.$name4.'</del>';
      echo '</div>
      </div>';
      }
      if(!empty($pahe1) || !empty($pahe2) || !empty($pahe3) || !empty($pahe4)){
      echo '<div class="download_item">
        <strong>'.get_bloginfo('name').' - '.get_the_title().' [480P]</strong>
        <div>';
          echo (!empty($pahe1)) ? '<a href="'.$pahe1.'" target="_blank">'.$name1.'</a> || ' : '<del>'.$name1.'</del> || ';
          echo (!empty($pahe2)) ? '<a href="'.$pahe2.'" target="_blank">'.$name2.'</a> || ' : '<del>'.$name2.'</del> || ';
          echo (!empty($pahe3)) ? '<a href="'.$pahe3.'" target="_blank">'.$name3.'</a> || ' : '<del>'.$name3.'</del> || ';
          echo (!empty($pahe4)) ? '<a href="'.$pahe4.'" target="_blank">'.$name4.'</a>' : '<del>'.$name4.'</del>';
      echo '</div>
      </div>';
      }
    echo '<div style="clear:both;display:block;"></div></div>';
    ?>
    

Result
meta boxmeta box

Download Box 720P and 480P

/*
 * Function Download Box
 * @yuuktihemes
 *
 */

function yuukithemes_downloadbox( $meta_boxes ) {
  $prefix = '';

  $meta_boxes[] = array(
    'id' => 'downloadbox',
    'title' => esc_html__( 'Download Box', 'yuukithemes' ),
    'post_types' => array( 'post' ),
    'context' => 'after_editor',
    'priority' => 'default',
    'autosave' => true,
    'fields' => array(
      array(
        'id' => $prefix . '720p_link1',
        'type' => 'text',
        'name' => esc_html__( '[720P] Link 1', 'yuukithemes' ),
        'before' => '<h4 style="text-transform:uppercase;margin:15px 0;border-left:5px solid #3498DB;padding-left:5px;">Quality - 720P</h4>',
        'size' => 90,
      ),
      array(
        'id' => $prefix . '720p_link2',
        'type' => 'text',
        'name' => esc_html__( '[720P] Link 2', 'yuukithemes' ),
        'size' => 90,
      ),
      array(
        'id' => $prefix . '720p_link3',
        'type' => 'text',
        'name' => esc_html__( '[720P] Link 3', 'yuukithemes' ),
        'size' => 90,
      ),
      array(
        'id' => $prefix . '720p_link4',
        'type' => 'text',
        'name' => esc_html__( '[720P] Link 4', 'yuukithemes' ),
        'size' => 90,
      ),
      array(
        'id' => $prefix . '480p_link1',
        'type' => 'text',
        'name' => esc_html__( '[480P] Link 1', 'yuukithemes' ),
        'before' => '<h4 style="text-transform:uppercase;margin:15px 0;border-left:5px solid #3498DB;padding-left:5px;">Quality - 480P</h4>',
        'size' => 90,
      ),
      array(
        'id' => $prefix . '480p_link2',
        'type' => 'text',
        'name' => esc_html__( '[480P] Link 2', 'yuukithemes' ),
        'size' => 90,
      ),
      array(
        'id' => $prefix . '480p_link3',
        'type' => 'text',
        'name' => esc_html__( '[480P] Link 3', 'yuukithemes' ),
        'size' => 90,
      ),
      array(
        'id' => $prefix . '480p_link4',
        'type' => 'text',
        'name' => esc_html__( '[480P] Link 4', 'yuukithemes' ),
        'size' => 90,
      ),
    ),
  );

  return $meta_boxes;
}
add_filter( 'rwmb_meta_boxes', 'yuukithemes_downloadbox' );
    

<?php 
    /* 
     * Yuukithemes - Download Box
     * @yuukithemes.com
     *
     */
    $name1 = 'Elsfile';
    $name2 = 'Google Drive';
    $name3 = 'Zippyshare';
    $name4 = 'Mirror';
    $hd1 = get_post_meta(get_the_ID(), '720p_link1', true);
    $hd2 = get_post_meta(get_the_ID(), '720p_link2', true);
    $hd3 = get_post_meta(get_the_ID(), '720p_link3', true);
    $hd4 = get_post_meta(get_the_ID(), '720p_link4', true);
    $pahe1 = get_post_meta(get_the_ID(), '480p_link1', true);
    $pahe2 = get_post_meta(get_the_ID(), '480p_link2', true);
    $pahe3 = get_post_meta(get_the_ID(), '480p_link3', true);
    $pahe4 = get_post_meta(get_the_ID(), '480p_link4', true);
    echo '<div class="download_area">';
      if(!empty($hd1) || !empty($hd2) || !empty($hd3) || !empty($hd4)){
      echo '<div class="download_item">
        <strong>'.get_bloginfo('name').' - '.get_the_title().' [720P]</strong>
        <div>';
          echo (!empty($hd1)) ? '<a href="'.$hd1.'" target="_blank">'.$name1.'</a> || ' : '<del>'.$name1.'</del> || ';
          echo (!empty($hd2)) ? '<a href="'.$hd2.'" target="_blank">'.$name2.'</a> || ' : '<del>'.$name2.'</del> || ';
          echo (!empty($hd3)) ? '<a href="'.$hd3.'" target="_blank">'.$name3.'</a> || ' : '<del>'.$name3.'</del> || ';
          echo (!empty($hd4)) ? '<a href="'.$hd4.'" target="_blank">'.$name4.'</a>' : '<del>'.$name4.'</del>';
      echo '</div>
      </div>';
      }
      if(!empty($pahe1) || !empty($pahe2) || !empty($pahe3) || !empty($pahe4)){
      echo '<div class="download_item">
        <strong>'.get_bloginfo('name').' - '.get_the_title().' [480P]</strong>
        <div>';
          echo (!empty($pahe1)) ? '<a href="'.$pahe1.'" target="_blank">'.$name1.'</a> || ' : '<del>'.$name1.'</del> || ';
          echo (!empty($pahe2)) ? '<a href="'.$pahe2.'" target="_blank">'.$name2.'</a> || ' : '<del>'.$name2.'</del> || ';
          echo (!empty($pahe3)) ? '<a href="'.$pahe3.'" target="_blank">'.$name3.'</a> || ' : '<del>'.$name3.'</del> || ';
          echo (!empty($pahe4)) ? '<a href="'.$pahe4.'" target="_blank">'.$name4.'</a>' : '<del>'.$name4.'</del>';
      echo '</div>
      </div>';
      }
    echo '<div style="clear:both;display:block;"></div></div>';
    ?>
    

Result
meta boxmeta box

Good luck.
and if you think this tutorial is still less please comment, I am very happy when you correct my work result.

Reference
I made this article not alone, I also glanced at some references to add my insight in making this article.
– https://translate.google.com
– https://metabox.io/online-generator/
– http://yuukithemes.com/music/
– http://tinypng.com/

Related Post

Please wait....
Disqus comment box is being loaded