Support » Plugin: Meta Box - WordPress Custom Fields Framework » New images displaying twice on site but not in CMS

  • Resolved wagg_matt

    (@wagg_matt)


    I have couple of issues. I have created a custom post type that includes a slider (Hero slider image) that contains group of type image_advanced. I’ve used a group as I am using one image for mobile and one image for desktop.

    I cannot seem to delete the last image, despite how many times I delete it, it reappears. When adding a new image group and saving, the new images added are not in the CMS but they are on the front end of the site, not once but twice. This is being displayed here: http://www.unveiluk.com/

    Below is the code for the custom post type:

    
    <?php
    /*
     * Create a custom post type to create homepage sections
    **/
    
    	function create_homepage_section() {
    	  register_post_type( 'homepage_sections',
          array(
            'labels' => array(
                'name' => 'Homepage Sections',
                'singular_name' => 'Homepage Section',
                'add_new' => '',
                'add_new_item' => '',
                'edit' => 'Edit Homepage Sections',
                'edit_item' => 'Edit Homepage Sections',
                'new_item' => '',
                'view_item' => 'View Homepage Sections',
                'search_items' => '',
              ),
    
            'public' => true,
            'menu_position' => 10,
            'supports' => array( 'title', 'page-attributes' ),
            'taxonomies' => array( '' ),
            'menu_icon' => 'dashicons-admin-post',
            'has_archive' => false
          )
    	  );
    	}
    
    	add_action('init', 'create_homepage_section');
    
    /**
     * Add meta box items for homepage sections
     */
    add_filter( 'rwmb_meta_boxes', 'homepage_section_register_meta_boxes' );
    function homepage_section_register_meta_boxes($meta_boxes) {
    	$prefix = 'unveil_';
    
    	// about meta box
    	$meta_boxes[] = array(
    		'id' => 'homepage-sections',
    		'title' => 'Homepage Sections',
    		'post_types' => array(
    			'homepage_sections'
    			),
    		'context' => 'normal',
    		'priority' => 'high',
    		'autosave' => true,
    		'fields' => array(
    			array(
    				'name' => 'Header',
    				'id' => $prefix . 'header',
    				'type' => 'heading',
    				'desc' => 'add content for the homepage header',
    				),
    			array(
    				'name' => 'Hero slider image',
    				'id' => $prefix . 'hero-slider-image',
    				'type' => 'group',
    				// 'max_file_uploads' => 4,
    				// 'desc' => 'add the background image',
    				'clone' => true,
    				'sort_clone' => true,
    				'fields' => array(
    					array(
    						'name' => 'image',
    						'id' => $prefix . 'background-image',
    						'type' => 'image_advanced',
    						'max_file_uploads' => 1,
    						),
    					array(
    						'name' => 'Mobile image',
    						'id' => $prefix . 'mobile-background-image',
    						'type' => 'image_advanced',
    						'max_file_uploads' => 1,
    						),
    					),
    				),
    			array(
    				'name' => 'Strapline',
    				'id' => $prefix . 'strapline',
    				'type' => 'textarea',
    				'desc' => 'add the heading section strapline',
    				),
    			array(
    				'name' => 'About us',
    				'id' => $prefix . 'about-us',
    				'type' => 'heading',
    				'desc' => 'add content to the about us section',
    				),
    			array(
    				'name' => 'About Title',
    				'id' => $prefix . 'about-title',
    				'type' => 'text',
    				'desc' => 'add the about us section title',
    				),
    			array(
    				'name' => 'Body copy',
    				'id' => $prefix . 'body-copy',
    				'type' => 'wysiwyg',
    				'raw' => false,
    				'options' => array(
    					'media_buttons' => false,
    					'textarea_rows' => 4,
    					),
    				'desc' => 'add the about us section copy here',
    				),
    			array(
    				'name' => 'Gallery',
    				'id' => $prefix . 'gallery',
    				'type' => 'heading',
    				),
    			array(
    				'name' => 'Gallery Title',
    				'id' => $prefix . 'gallery-title',
    				'type' => 'text',
    				'desc' => 'add the gallery section title',
    				),
    			array(
    				'name' => 'Artist',
    				'id' => $prefix . 'artist',
    				'type' => 'heading',
    				),
    			array(
    				'name' => 'Artist Title',
    				'id' => $prefix . 'artist-title',
    				'type' => 'text',
    				'desc' => 'add the artist section title',
    				),
    			array(
    				'name' => 'Contact',
    				'id' => $prefix . 'contact',
    				'type' => 'heading',
    				),
    			array(
    				'name' => 'Contact Title',
    				'id' => $prefix . 'contact-title',
    				'type' => 'text',
    				'desc' => 'add the contact section title',
    				),
    			array(
    				'name' => 'Contact copy',
    				'id' => $prefix . 'contact-copy',
    				'type' => 'wysiwyg',
    				'raw' => false,
    				'options' => array(
    					'media_buttons' => false,
    					'textarea_rows' => 4,
    					),
    				'desc' => 'add the contact section copy here',
    				),
    			),
    		);
    	return $meta_boxes;
    }
    
    /**
     * Saves the custom meta input
     */
    function homepage_section_register_meta_save( $post_id ) {
     
        // Checks save status
        $is_autosave = wp_is_post_autosave( $post_id );
        $is_revision = wp_is_post_revision( $post_id );
        $is_valid_nonce = ( isset( $_POST[ 'homepage_section_register_nonce' ] ) && wp_verify_nonce( $_POST[ 'homepage_section_register_nonce' ], basename( __FILE__ ) ) ) ? 'true' : 'false';
     
        // Exits script depending on save status
        if ( $is_autosave || $is_revision || !$is_valid_nonce ) {
            return;
        }
     
        // Checks for input and sanitizes/saves if needed
        if( isset( $_POST[ 'meta-text' ] ) ) {
            update_post_meta( $post_id, 'meta-text', sanitize_text_field( $_POST[ 'meta-text' ] ) );
        }
     
    }
    add_action( 'save_post', 'homepage_section_register_meta_save' );
    

    and now, here is the template that is printing the slider images:

    
    <section id="home" class="hero-section">
      <div class="hero-section__slider-hook">
        <ul class="hero-section__slider">
          <?php 
            $sliderImages = rwmb_meta('unveil_hero-slider-image');
            if (!empty($sliderImages)) {
              foreach ($sliderImages as $index => $sliderImage) :
                $slide_number = $index + 1;
                $images = isset( $sliderImage['unveil_background-image'] ) ? $sliderImage['unveil_background-image'] : array();
    
                foreach ($images as $image) :
                  
                  $bgImage = isset($image['unveil_background-image']) ? reset( $image['unveil_background-image'] ) : '';
                  $bgSizes = wp_get_attachment_image_sizes($bgImage, 'homepage-header');
          ?>
          <li class="hero-section__image"><figure class="fullScreenImg slide<?php print $slide_number; ?>"></figure></li>
          <?php 
                endforeach;
                $slide_number++;
              endforeach;
            };
          ?>
        </ul>
      </div>
      <h1 class="hero-section__title"><?php print rwmb_meta('unveil_strapline'); ?></h1>
      <button id="hero-section__arrow-slide"><span class="fa fa-angle-down"></span></button>
    </section>
    

    I am uncertain if I have misused the plugin or my logic is less than logical! Could anyone please shed a bit of light onto this? Thanks so much in advance

Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Contributor Manny Fleurmond

    (@funkatronic)

    You don’t need that second for loop, because you only need one image; the first one. use this instead:

    <section id="home" class="hero-section">
      <div class="hero-section__slider-hook">
        <ul class="hero-section__slider">
          <?php 
            $sliderImages = rwmb_meta('unveil_hero-slider-image');
            if (!empty($sliderImages)) {
              foreach ($sliderImages as $index => $sliderImage) :
                $slide_number = $index + 1;
                $images = isset( $sliderImage['unveil_background-image'] ) ? $sliderImage['unveil_background-image'] : array();
    
                $bgImage = isset( $images ) ? reset( $images ) : '';
                $bgSizes = wp_get_attachment_image_sizes( $bgImage, 'homepage-header');
          ?>
          <li class="hero-section__image"><figure class="fullScreenImg slide<?php print $slide_number; ?>"></figure></li>
          <?php 
                $slide_number++;
              endforeach;
            };
          ?>
        </ul>
      </div>
      <h1 class="hero-section__title"><?php print rwmb_meta('unveil_strapline'); ?></h1>
      <button id="hero-section__arrow-slide"><span class="fa fa-angle-down"></span></button>
    </section>
    Thread Starter wagg_matt

    (@wagg_matt)

    Thanks Manny, much appreciated

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘New images displaying twice on site but not in CMS’ is closed to new replies.