Like slider
-
Hello i need to create section where is 2 person
2 square orange its active person with descripton
grey its second person
How i can do it maybe plugin or smthactual code
I create custom post type:/** * Register team Post Type. * * @since 1.0.0 * @return null. */ function team_register_post_type() { register_post_type('team', array( 'labels' => array( 'name' => __('Team', 'muse' ), 'singular_name' => __('Team', 'muse' ), 'all_items' => __( 'Wszystkie'), ), 'public' => false, 'show_ui' => true, 'menu_position' => 15, 'menu_icon' => 'dashicons-groups', 'has_archive' => false, 'supports' => array( 'title', 'editor', 'thumbnail', 'page-attributes' ), 'rewrite' => false, 'publicly_queryable' => false, 'show_in_nav_menus' => false, 'exclude_from_search' => true, 'query_var' => false, 'can_export' => false, ) ); } /** * Disable "show post" message * * @since 1.0.0 * @return null. */ function team_messages($messages) { $messages['team'] = array( 0 => '', 1 => __('team updated.', 'muse'), 6 => __('team published.', 'muse'), 7 => __('team saved.', 'muse') ); return $messages; } /** * Add team "position meta-box" * * @since 1.0.0 * @return null. */ function team_position_box() { add_meta_box( 'team_position_box', __( 'position', 'muse' ), 'team_position_box_content', 'team', 'normal', 'default' ); } /** * Build content for "position meta-box" * * @since 1.0.0 * @return null. */ function team_position_box_content($post) { wp_nonce_field( plugin_basename( __FILE__ ), 'team_position_box_content_nonce' ); $meta = get_post_meta($post->ID, '_position_name', true); echo '<table class="form-table">'; echo '<tr>'; echo '<th><label for="position_name">'.__('Enter position', 'muse').'</label></th>'; echo '<td><input type="text" id="position_name" name="position_name" value="'.$meta.'"/><td>'; echo '</table>'; } /** * Update meta box for "position meta-box" * * @since 1.0.0 * @return null. */ function team_position_box_save($post_id) { if (defined('DOING_AUTOSAVE') && DOING_AUTOSAVE) return; if (!isset($_POST['team_position_box_content_nonce']) OR !wp_verify_nonce($_POST['team_position_box_content_nonce'], plugin_basename( __FILE__ ) ) ) return; if ( 'page' == $_POST['post_type'] ) { if ( !current_user_can( 'edit_page', $post_id ) ) return; } else { if ( !current_user_can( 'edit_post', $post_id ) ) return; } $position_name = $_POST['position_name']; update_post_meta( $post_id, '_position_name', $position_name ); } ////// /** * Add team "id_name meta-box" * * @since 1.0.0 * @return null. */ function team_id_box() { add_meta_box( 'team_id_box', __( 'ID', 'muse' ), 'team_id_box_content', 'team', 'normal', 'default' ); } /** * Build content for "position meta-box" * * @since 1.0.0 * @return null. */ function team_id_box_content($post) { wp_nonce_field( plugin_basename( __FILE__ ), 'team_id_box_content_nonce' ); $meta = get_post_meta($post->ID, '_id_name', true); echo '<table class="form-table">'; echo '<tr>'; echo '<th><label for="id_name">'.__('Enter ID', 'muse').'</label></th>'; echo '<td><input type="text" id="id_name" name="id_name" value="'.$meta.'"/><td>'; echo '</table>'; } /** * Update meta box for "position meta-box" * * @since 1.0.0 * @return null. */ function team_id_box_save($post_id) { if (defined('DOING_AUTOSAVE') && DOING_AUTOSAVE) return; if (!isset($_POST['team_id_box_content_nonce']) OR !wp_verify_nonce($_POST['team_id_box_content_nonce'], plugin_basename( __FILE__ ) ) ) return; if ( 'page' == $_POST['post_type'] ) { if ( !current_user_can( 'edit_page', $post_id ) ) return; } else { if ( !current_user_can( 'edit_post', $post_id ) ) return; } $id_name = $_POST['id_name']; update_post_meta( $post_id, '_id_name', $id_name ); } /** * Actions and filters. */ add_action('init', 'team_register_post_type'); add_filter('post_updated_messages', 'team_messages'); add_action('add_meta_boxes', 'team_position_box'); add_action('save_post', 'team_position_box_save' ); add_action('add_meta_boxes', 'team_id_box'); add_action('save_post', 'team_id_box_save' );and page template:
$team = new WP_query( array( 'post_type' => 'team', 'order' => 'ASC', 'orderby' => 'menu_order', 'posts_per_page' => -1 ) ); $i = 1; $photo_array = array(); ?> <?php if ($team->have_posts()) : ?> <?php while ($team->have_posts()) : $team->the_post() ?> <?php $photo_array[$i] = wp_get_attachment_url( get_post_thumbnail_id($post->ID) );; $i++; ?> <?php endwhile; ?> <?php endif; ?> <div class="row"> <div class="col-xs-12 col-sm-7 "> <div class="slider"> <div class="large"> <img class="kasia_l img-responsive" src="<?php print_r($photo_array[1]);?>" /> <img class="ryszard_l img-responsive" src="<?php print_r($photo_array[2]);?>" /> <div class="small"> <img class="ryszard_s img_small img-responsive" src="<?php print_r($photo_array[2]);?>" /> <img class="kasia_s img_small img-responsive" src="<?php print_r($photo_array[1]);?>" /> </div> </div> </div> </div> <div class="col-xs-12 col-sm-5"> <?php if ($team->have_posts()) : ?> <?php while ($team->have_posts()) : $team->the_post() ?> <?php $ID = get_post_meta(get_the_ID(), '_id_name', true)?> <div id="<?php echo $ID ?>"> <div class="title"> <h3><?php the_title() ?> <span>CEO</span></h3> <?php $position = get_post_meta(get_the_ID(), '_position_name', true)?> <span><?php echo $position ?></span> </div> <p> <?php the_content() ?> </p> </div> <?php endwhile; ?> <?php endif; ?> </div> </div>js:
//slider swap function slider(){ $('.kasia_s').bind('click', function(event){ event.preventDefault(); $('.kasia_l').fadeIn(); $('.ryszard_l').hide(); $('.kasia_s').hide(); $('.ryszard_s').fadeIn(); $('#kasia').fadeIn(); $('#ryszard').hide(); }); $('.ryszard_s').bind('click', function(event){ event.preventDefault(); $('.ryszard_l').fadeIn(); $('.kasia_l').hide(); $('.kasia_s').fadeIn(); $('.ryszard_s').hide(); $('#ryszard').fadeIn(); $('#kasia').hide(); }); }maybe u know how to to this easier and better
- The topic ‘Like slider’ is closed to new replies.