😃Giảng viên (Cố vấn) psuedukr.mycafe24.com (ok)

<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css">

dev-custom.js

$(function () {
  for (var i = 1; i < 9; i++) {
    $(".ourtalent__row .ourtalent__col:nth-child(" + i + ") .fadein").addClass("fadein" + i);
    (function (i) {
      if (i % 2 == 0) {
        var times = 5000;
      } else {
        var times = 8000;
      }
      setInterval(function () {
        $('.fadein' + i + ' .ourtalent__img').first().hide().next('.ourtalent__img').fadeIn(1000).end().appendTo('.fadein' + i);
      }, times)
    })(i);
  }
  $('.ourtalent__img').click(function (e) {
    var id = $(this).data('id');
    var retVal = confirm("You want to continue ...");
    if (retVal != true) {
      return false;
    }
    $.ajax({
      type: 'POST',
      url: frontend_ajax_object.ajaxurl,
      data: {
        action: 'func_knowledge_popup',
        id
      },
      success: function (result) {
        var result = JSON.parse(result);
        var { getResponid } = result;
        var results = result.result;
        let { image, description, name, position } = results;
        if (result.status == 'success') {
          var html = '';
          html += '<div class="modal fade" id="exampleModal" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">';
          html += '<div class="modal-dialog">';
          html += '<div class="modal-content">';
          html += '<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>';
          html += '<div class="modal-body__content">';
          html += '<div class="modal-body__img">';
          html += '<img src="' + image + '" alt="Thumbnail">';
          html += '</div>';
          html += '<div class="modal-body__meta">';
          html += '<div class="modal-body__title">';
          html += name;
          html += '</div>';
          html += '<div class="modal-body__position">';
          html += position;
          html += '</div>';
          html += '<div class="modal-body__des">';
          html += description;
          html += '</div>';
          html += '</div>';
          html += '</div>';
          html += '</div>';
          html += '</div>';
          html += '</div>';
          $('#knowledge-append').html(html);
          jQuery('#exampleModal').modal('show');
          $('.close').click(function () {
            $('body').removeClass('modal-open');
            $('.modal-backdrop').remove();
          });
          $('.modal-backdrop').click(function () {
            $('.modal-backdrop').remove();
          });
        }
      }
    });
  });
});

Bootstrap v4.1.3 (https://getbootstrap.com/)

functions.php

function child_enqueue_styles()
{
  wp_enqueue_style('astra-child-theme-css', get_stylesheet_directory_uri() . '/style.css', array('astra-theme-css'), CHILD_THEME_ASTRA_CHILD_VERSION, 'all');
  wp_enqueue_style('dev-custom-style', get_stylesheet_directory_uri() . '/assets/css/dev-custom.css', array(), '0.1.0', 'all');
  wp_enqueue_script('bootstrapjs', get_stylesheet_directory_uri() . '/assets/js/bootstrap.min.js', array('jquery-core'), '1.0.1', 'true');
  wp_enqueue_script('dev-custom-script', get_stylesheet_directory_uri() . '/assets/js/dev-custom.js', array('jquery-core'), '1.0.1', 'true');
  wp_localize_script(
    'dev-custom-script',
    'frontend_ajax_object',
    array(
      'ajaxurl'   => admin_url('admin-ajax.php'),
      'ajaxnonce' => wp_create_nonce('ajaxnonce'),
    )
  );
}
add_action('wp_enqueue_scripts', 'child_enqueue_styles', 15);
/**
 * !Our Talent
 */
add_shortcode('ourtalent', 'wpb_demo_shortcode_teen');
function wpb_demo_shortcode_teen()
{
  ob_start();
  // $repeats = get_field('repeat');
  $repeats = array (
    0 => 
    array (
      'image' => 'https://psuedukr.mycafe24.com/wp-content/uploads/2024/03/teachear-1.png',
      'position' => '선생님',
      'description' => '학교/전공 : NYU / Psychology / BA 강의과목 : SAT, Essay, English',
      'name' => 'Julie Jeong',
    ),
    1 => 
    array (
      'image' => 'https://psuedukr.mycafe24.com/wp-content/uploads/2024/03/teachear-2.png',
      'position' => '선생님',
      'description' => '학교/전공 : BU / Communication / MA 강의과목 : SAT, Essay, English',
      'name' => '하승희 (Liz)',
    ),
    2 => 
    array (
      'image' => 'https://psuedukr.mycafe24.com/wp-content/uploads/2024/03/teachear-3.png',
      'position' => '선생님',
      'description' => '학교/전공 : BC / Mathmatics / Statistics / MA 강의과목 : SAT, Mathmatics ',
      'name' => '임주영',
    ),
    3 => 
    array (
      'image' => 'https://psuedukr.mycafe24.com/wp-content/uploads/2024/03/teachear-4.png',
      'position' => '선생님',
      'description' => '학교/전공 : NYU / Dramatic / Literature / BA 강의과목 : SAT, Essay, English',
      'name' => '데이빗 오',
    ),
    4 => 
    array (
      'image' => 'https://psuedukr.mycafe24.com/wp-content/uploads/2024/03/teachear-5.png',
      'position' => '선생님',
      'description' => '학교/전공 : UBC / Mathmatics / BS 강의과목 : SAT, Mathmatics',
      'name' => '조정민',
    ),
    5 => 
    array (
      'image' => 'https://psuedukr.mycafe24.com/wp-content/uploads/2024/03/teachear-6.png',
      'position' => '선생님',
      'description' => '학교/전공 : 연세대학교 / 생명공학 / MS 강의과목 : SAT, Mathmatics, Statistics',
      'name' => '조하나',
    ),
    6 => 
    array (
      'image' => 'https://psuedukr.mycafe24.com/wp-content/uploads/2024/03/teachear-7.png',
      'position' => '선생님',
      'description' => '학교/전공 : UBC/ Civil Engineering / BS 강의과목 : Physics, Chemistry, Math',
      'name' => '이청하',
    ),
    7 => 
    array (
      'image' => 'https://psuedukr.mycafe24.com/wp-content/uploads/2024/03/teachear-9.png',
      'position' => '선생님',
      'description' => '학교/전공 : 연세대학교 / 생화학 / MS 강의과목 : Chemistry, Biology, Organic Chem',
      'name' => '이지현',
    ),
    8 => 
    array (
      'image' => 'https://psuedukr.mycafe24.com/wp-content/uploads/2024/03/teachear-4.png',
      'position' => '선생님',
      'description' => '학교/전공 : 카이스트 / MS 강의과목 : Physics, Chemistry, Mathmatics',
      'name' => '홍성혁',
    ),
    9 => 
    array (
      'image' => 'https://psuedukr.mycafe24.com/wp-content/uploads/2024/03/teachear-10.png',
      'position' => '선생님',
      'description' => '학교/전공 : 한국외국어대 / 통번역 / MA 강의과목 : SAT, TOEFL',
      'name' => '변세영',
    ),
    10 => 
    array (
      'image' => 'https://psuedukr.mycafe24.com/wp-content/uploads/2024/03/teachear-4.png',
      'position' => '선생님',
      'description' => '학교/전공 : 연세대학교 / 경제학과 / BA 강의과목 : Economics, Business',
      'name' => '김영진',
    ),
    11 => 
    array (
      'image' => 'https://psuedukr.mycafe24.com/wp-content/uploads/2024/03/teachear-4.png',
      'position' => '선생님',
      'description' => '학교/전공 : Ruguts U / Business / BA 강의과목 : Economics, Business ',
      'name' => '김성재',
    ),
    12 => 
    array (
      'image' => 'https://psuedukr.mycafe24.com/wp-content/uploads/2024/03/teachear-4.png',
      'position' => '선생님',
      'description' => '학교/전공 : UC Berkeley / Computer E / BS 강의과목 : Mathmatics, Computer S',
      'name' => '장재원',
    ),
    13 => 
    array (
      'image' => 'https://psuedukr.mycafe24.com/wp-content/uploads/2024/03/teachear-14.png',
      'position' => '선생님',
      'description' => '학교/전공 : 한국외대 / 역사학 박사 강의과목 : US History, World History',
      'name' => '심재선',
    ),
    14 => 
    array (
      'image' => 'https://psuedukr.mycafe24.com/wp-content/uploads/2024/03/teachear-4.png',
      'position' => '선생님',
      'description' => '학교/전공 : LES (런던정경대) / Political Science / MA 강의과목 : TOEFL, Politics, History',
      'name' => '김지만',
    ),
    15 => 
    array (
      'image' => 'https://psuedukr.mycafe24.com/wp-content/uploads/2024/03/teachear-5.png',
      'position' => '선생님',
      'description' => '학교/전공 : U of Sheffield / Economics / BS 강의과목 : IB, Business ',
      'name' => '박세인',
    ),
    16 => 
    array (
      'image' => 'https://psuedukr.mycafe24.com/wp-content/uploads/2024/03/teachear-17.png',
      'position' => '선생님',
      'description' => '학교/전공 : 한국외대 / 통변역대학원 / 석사 강의과목 : Korean / Spanish / French',
      'name' => '임주희',
    ),
    17 => 
    array (
      'image' => 'https://psuedukr.mycafe24.com/wp-content/uploads/2024/03/teachear-5.png',
      'position' => '선생님',
      'description' => '학교/전공 : U of Wisconsin / Doctor of Dentistry 강의과목 : Biology, Mathmatics',
      'name' => '이미지',
    ),
    18 => 
    array (
      'image' => 'https://psuedukr.mycafe24.com/wp-content/uploads/2024/03/teachear-5.png',
      'position' => '선생님',
      'description' => '학교/전공 : Medical Doctor / in Europe 강의과목 : Biology, Chemistry, Organic Chem',
      'name' => '김예진',
    ),
    19 => 
    array (
      'image' => 'https://psuedukr.mycafe24.com/wp-content/uploads/2024/03/teachear-5.png',
      'position' => '선생님',
      'description' => '학교/전공 : 홍콩과기대 / 경영학 / BS 강의과목 : IB Business',
      'name' => '고남원',
    ),
    20 => 
    array (
      'image' => 'https://psuedukr.mycafe24.com/wp-content/uploads/2024/03/teachear-5.png',
      'position' => '선생님',
      'description' => '학교/전공 : UBC / Biology / BS 강의과목 : Biology, Mathmatics',
      'name' => '고유진',
    ),
    21 => 
    array (
      'image' => 'https://psuedukr.mycafe24.com/wp-content/uploads/2024/03/teachear-5.png',
      'position' => '선생님',
      'description' => '학교/전공 : 고려대학교 / 교육학석사 / 전,고대입학사정관 강의과목 : 수시면접, 논술',
      'name' => '아이비',
    ),
    22 => 
    array (
      'image' => 'https://psuedukr.mycafe24.com/wp-content/uploads/2024/03/teachear-4.png',
      'position' => '선생님',
      'description' => '학교/전공 : 연세대 / 법학부 / 석사 강의과목 : 수시면접, 논술',
      'name' => '김형수',
    ),
  );
  $keys = array_keys($repeats);
  shuffle($keys);
  $shuffledArray = array();
  foreach ($keys as $key) {
    $shuffledArray[$key] = $repeats[$key];
  }
  $count = count($shuffledArray);
?>
  <div class="container ourtalent">
    <div class="row ourtalent__row">
      <div class="ourtalent__col col-sm-3">
        <div class="fadein">
          <?php
          $i = 1;
          foreach ($shuffledArray as $key => $shuffledA) :
            echo '<div class="ourtalent__img" data-id="' . $key . '"><img src="' . $shuffledA["image"] . '" alt="Amit Sachdeva" /><span class="name">' . $shuffledA["name"] . '</span></div>';
            if ($i % 3 == 0 && $count != $i) {
              echo '</div></div><div class="ourtalent__col col-sm-3"><div class="fadein">';
            }
            $i++;
          endforeach;
          ?>
        </div>
      </div>
    </div>
  <?php
  $data = ob_get_contents();
  ob_end_clean();
  return $data;
}
add_action('wp_ajax_func_knowledge_popup', 'func_knowledge_popup');
add_action("wp_ajax_nopriv_func_knowledge_popup", "func_knowledge_popup");
function func_knowledge_popup()
{
  if ($_POST['id']) {
    $repeats = get_field('repeat', 1648);
    $id = $_POST['id'];
    $result = $repeats[$id];
    echo wp_json_encode([
      'status' => 'success',
      'result' => $result,
      'getResponid' => $id
    ]);
  }
  wp_die();
}
/**
 * Our Talent!
 */

page-1648.php

<?php
/**
 * The template for displaying all pages.
 *
 * This is the template that displays all pages by default.
 * Please note that this is the WordPress construct of pages
 * and that other 'pages' on your WordPress site may use a
 * different template.
 *
 * @link https://codex.wordpress.org/Template_Hierarchy
 *
 * @package Astra
 * @since 1.0.0
 */
if ( ! defined( 'ABSPATH' ) ) {
	exit; // Exit if accessed directly.
}
get_header(); 
?>
<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css">
<?php if ( astra_page_layout() == 'left-sidebar' ) : ?>
	<?php get_sidebar(); ?>
<?php endif ?>
	<div id="primary" <?php astra_primary_class(); ?>>
		<?php astra_primary_content_top(); ?>
		<?php astra_content_page_loop(); ?>
		<?php astra_primary_content_bottom(); ?>
	</div><!-- #primary -->
<?php if ( astra_page_layout() == 'right-sidebar' ) : ?>
	<?php get_sidebar(); ?>
<?php endif ?>
<?php get_footer('1648'); ?>

footer-1648.php

<?php
/**
 * The template for displaying the footer.
 *
 * Contains the closing of the #content div and all content after.
 *
 * @link https://developer.wordpress.org/themes/basics/template-files/#template-partials
 *
 * @package Astra
 * @since 1.0.0
 */
if ( ! defined( 'ABSPATH' ) ) {
	exit; // Exit if accessed directly.
}
?>
<?php astra_content_bottom(); ?>
	</div> <!-- ast-container -->
	</div><!-- #content -->
<?php 
	astra_content_after();
	astra_footer_before();
	astra_footer();
	astra_footer_after(); 
?>
	</div><!-- #page -->
<?php 
	astra_body_bottom();    
	wp_footer(); 
?>
<?php echo do_shortcode("[ourtalent]");?>
<div id="knowledge-append"></div>
	</body>
</html>

/** 
* !.ourtalent 
*/
.ourtalent {
  margin-top: 50px;
}
.ourtalent__row {
  row-gap: 1.6rem;
  img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    min-height: 250px;
    max-height: 100%;
  }
}
.fadein {
  height: 100%;
  .ourtalent__img {
    .name {
      font-weight: 700;
      text-align: center;
      display: block;
    }
    &:nth-child(2) {
      display: none;
    }
    &:nth-child(3) {
      display: none;
    }
  }
}
.modal-body__top {
  img {
    width: 100%;
    max-height: 350px;
    object-fit: contain;
  }
}
.modal-body__title {
  color: #00225d;
  font-weight: 700;
}
.modal-body__position {
  color: #000;
  font-weight: 500;
  border-top: 1px solid #00225d;
  border-bottom: 1px solid #00225d;
  padding-bottom: 5px;
}
.modal-body__des {
  color: #000000;
  font-weight: 400;
}
#knowledge-append {
  .close {
    position: absolute;
    right: 10px;
    top: 0px;
    z-index: 2;
    color: #00225d;
    opacity: 1;
    padding: 0;
    border: none;
    font-weight: 700;
    font-size: 20px;
    background-color: #fff;
  }
  .modal {
    top: 10%;
  }
}
.modal-body__content {
  display: flex;
  align-items: center;
  padding: 10px;
}
.modal-body__img {
  min-width: 150px;
  width: 150px;
  margin-right: 10px;
}
/** 
* .ourtalent!
*/

if( function_exists('acf_add_local_field_group') ):
acf_add_local_field_group(array(
	'key' => 'group_6503b84dda840',
	'title' => 'Our Talent',
	'fields' => array(
		array(
			'key' => 'field_6503b93c7fb2c',
			'label' => 'Repeat',
			'name' => 'repeat',
			'type' => 'repeater',
			'instructions' => '',
			'required' => 0,
			'conditional_logic' => 0,
			'wrapper' => array(
				'width' => '',
				'class' => '',
				'id' => '',
			),
			'collapsed' => '',
			'min' => 0,
			'max' => 0,
			'layout' => 'table',
			'button_label' => '',
			'sub_fields' => array(
				array(
					'key' => 'field_6503b8b8ff21c',
					'label' => 'Image',
					'name' => 'image',
					'type' => 'image',
					'instructions' => '',
					'required' => 1,
					'conditional_logic' => 0,
					'wrapper' => array(
						'width' => '',
						'class' => '',
						'id' => '',
					),
					'return_format' => 'url',
					'preview_size' => 'full',
					'library' => 'all',
					'min_width' => '',
					'min_height' => '',
					'min_size' => '',
					'max_width' => '',
					'max_height' => '',
					'max_size' => '',
					'mime_types' => '',
				),
				array(
					'key' => 'field_6505873b4f06b',
					'label' => 'Position',
					'name' => 'position',
					'type' => 'text',
					'instructions' => '',
					'required' => 0,
					'conditional_logic' => 0,
					'wrapper' => array(
						'width' => '',
						'class' => '',
						'id' => '',
					),
					'default_value' => '선생님',
					'placeholder' => '',
					'prepend' => '',
					'append' => '',
					'maxlength' => '',
				),
				array(
					'key' => 'field_6503b8ebff21d',
					'label' => 'Description',
					'name' => 'description',
					'type' => 'text',
					'instructions' => '',
					'required' => 1,
					'conditional_logic' => 0,
					'wrapper' => array(
						'width' => '',
						'class' => '',
						'id' => '',
					),
					'default_value' => 'Lorem Ipsum is simply dummy text',
					'placeholder' => '',
					'prepend' => '',
					'append' => '',
					'maxlength' => '',
				),
				array(
					'key' => 'field_6504eed4f6dde',
					'label' => 'Name',
					'name' => 'name',
					'type' => 'text',
					'instructions' => '',
					'required' => 1,
					'conditional_logic' => 0,
					'wrapper' => array(
						'width' => '',
						'class' => '',
						'id' => '',
					),
					'default_value' => 'Julie Jeong',
					'placeholder' => '',
					'prepend' => '',
					'append' => '',
					'maxlength' => '',
				),
			),
		),
	),
	'location' => array(
		array(
			array(
				'param' => 'page',
				'operator' => '==',
				'value' => '1648',
			),
		),
	),
	'menu_order' => 0,
	'position' => 'normal',
	'style' => 'default',
	'label_placement' => 'top',
	'instruction_placement' => 'label',
	'hide_on_screen' => '',
	'active' => true,
	'description' => '',
	'show_in_rest' => 0,
));
endif;		

4KB

acf-export-2026-03-31.json

Open