케이보드 퍼스트뉴스피트 스킨 커스터마이징

2. 상세 내용

퍼스트뉴스피드를 커스텀하여 아바타 노출되게 수정하였습니다.

그런데 지금까지 노출이 잘 되다 갑자기 코드 오류가 뜨더라고요. 아바타는 안보이고 그 자리에 <img src="data:image/svg+xml,%3Csvg xmlns= 문구가 뜨네요.

위치는 알겠는데 어떻게 수정을 해야 할지 정상적으로 작동 할지 감이 잡히지를 안네요.

https://imgur.com/a/NLmWpAv 

이미지는 정상 노출되는 이미지와 오류 이미지, 코드 이미지 스크린샷입니다.

아래 코드는 list.php 에 오류 코드입니다.

어디가 코딩이 잘못된건지 봐주시면 감사하겠습니다.

3. 확인 가능한 상세 페이지 주소

https://www.koalaa.kr/community-main-page/vietnam-news/viet-nam-news-doc/?uid=382&mod=document

4. 수정한 코드 내역 (있다면)

<link rel="stylesheet" href="https://unpkg.com/swiper/swiper-bundle.css" />

<link rel="stylesheet" href="https://unpkg.com/swiper/swiper-bundle.min.css" />

<script src="https://unpkg.com/swiper/swiper-bundle.js"></script>

<script src="https://unpkg.com/swiper/swiper-bundle.min.js"></script>

<script type="text/javascript" src="https://code.jquery.com/jquery-3.2.0.min.js" ></script>

<script>

function swiperOn() {

var target = event.target;

if(target.parentNode.style.margin == '0px auto'){

var swiper_style = target.parentNode.parentNode.parentNode.parentNode.parentNode.children[3].style;

}

else{

var swiper_style = target.parentNode.parentNode.parentNode.parentNode.children[3].style;

}

//console.log(swiper_style.display);

swiper_style.display = swiper_style.display.replace('none', 'block');

if(window.innerWidth > 430){

swiper_style.height = swiper_style.height.replace('auto', window.innerHeight + 'px');

swiper_style.top = swiper_style.top.replace('auto', document.getElementById('header_meta').offsetHeight + document.getElementById('header_main').offsetHeight - 1 + 'px');

}

if(window.innerWidth <= 430){

swiper_style.height = swiper_style.height.replace('auto', window.innerHeight + 'px');

}

}

function swiperOff() {

var target = event.target;

var swiper_style = target.parentNode.style;

swiper_style.display = swiper_style.display.replace('block', 'none');

}

function contentmorebtn() {

var target = event.target;

console.log(target.parentNode.children);

target.parentNode.children[0].style = '';

target.setAttribute('class','contentclosebtn');

target.parentNode.children[2].setAttribute('class','contentmorebtn');

}

function contentclosebtn() {

var target = event.target;

target.parentNode.children[0].style = 'max-height: 76px; display: block; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis;';

target.setAttribute('class','contentclosebtn');

target.parentNode.children[1].setAttribute('class','contentmorebtn');

}

</script>

<style>

/*더 보기 기능 관련 css*/

.contentclosebtn { display:none; }

.mediaclosebtn { display:none; }

/*댓글 플러그인의 sort 정렬 영역 감추는 css 코드*/

.comments-sort { display:none; }

.comments-field field-image1 { display:none; }

.comments-field field-file1 { display:none; }

/* 댓글 새창에서 보기 관련 css */

li.kboard-comments-item .comments-list .kboard-comments-item .rereply { display:block !important; }

li.kboard-comments-item .comments-list .comments-list { overflow: visible; }

li.kboard-comments-item .comments-list { padding-right:0px; }

/*사진 영역 및 슬라이드 기능 관련 css*/

/*.image-area img { max-width:49%;/*500px;*/ width: 100%; }*/

.kboard-play-video-container video { max-width:49%;/*500px;*/ width: 100%; }

.offbtn { border-radius: 50%; width: 28px; height: 28px; font-size: 24px; line-height: 30px; font-weight: bold; background: white; text-align: center; cursor: pointer; }

.swiper-button-prev, .swiper-button-next { width: 40px; height: 70px; /*box-shadow: 0px 0px 3px 3px white;*/ color: white; }

.swiper-pagination-bullet { background: #a8a8a8; /*box-shadow: 0px 0px 0px 1px black;*/ opacity: 1; }

.swiper-pagination-bullet-active { opacity: 1; background: #000000 !important; /*background: var(--swiper-pagination-color,var(--swiper-theme-color)) !important;*/ }

.swiper-button-prev:after, .swiper-button-next:after { text-shadow: 0px 0px 7px black; }

.mobile { display:none; }

@media all and (min-width:1440px){

.swiper-button-prev { margin-left: 27%; }

.swiper-button-next { margin-right: 27%; }

.pc .kboard-media-wrap .image-area .pc-img { width: 500px; height:500px; }

}

@media all and (min-width:771px) and (max-width:1439px){

.swiper-button-prev { margin-left: 16%; }

.swiper-button-next { margin-right: 16%; }

.pc .kboard-media-wrap .image-area .pc-img { width: 436px; height:436px; }

}

@media all and (min-width:431px) and (max-width:770px){

.pc .kboard-media-wrap .image-area .pc-img { width: 309px; height:309px; }

}

@media all and (min-width:431px){

.kboard-media-wrap.swiper-container { width: 100%; position: fixed; left: 0; background: #2f2f2ff0; }

.swiper-pagination { position:relative; bottom: 50% !important; transform: translateY(140px); }

.swiper-slide img { max-width: 500px; max-height: 500px; /*width: 100%;*/ position: absolute; top: 60px; left: 50%; transform: translateX(-50%); }

.swiper-slide video { max-width: 500px; max-height: 500px; /*width: 100%;*/ position: absolute; top: 60px; left: 50%; transform: translateX(-50%); }

.swiper-pagination-bullet { background:#a8a8a8; opacity:1; }

.swiper-pagination-bullet-active { background: #000000 !important }

}

@media all and (max-width:430px){

[id*=av_section_] .container { width: 100% !important; max-width: 100% !important; }

#kboard-koalaa-news-feed-list .kboard-list .kboard-first-news-feed-item .kboard-item-info { border-bottom: 0; }

#kboard-koalaa-news-feed-list .kboard-list .kboard-first-news-feed-item .kboard-comments-area { border-bottom: 0; }

#kboard-koalaa-news-feed-list .kboard-list .kboard-first-news-feed-item { overflow: visible; border-right: 0; border-left: 0; border: none; }

.kboard-comments-area {border:none;}

.swiper-pagination { position: initial; }

.swiper-button-prev, .swiper-button-next { display:none; }

.kboard-play-video-container, .image-area { margin-bottom:0px !important; }

.kboard-play-video-container video, .image-area img { margin-bottom:10px; max-width: none; width: 100%; }

.kboard-media-wrap .image-area .mobile-img { width: 100%; min-height: 430px; height:auto; }

/* 댓글 새창에서 보기 관련 css */

/*.kboard-comments-default .popup .kboard-comments-form, .popup .comments-list { padding-right:15px; }*/

/*.kboard-media-wrap.swiper-container { top: 0; margin-top: 0px !important; }

.swiper-slide img { top: 20%; }

.offbtn { top: 15%; right:1%; }

.swiper-pagination.swiper-pagination-bullets { bottom: 30%; }*/

.pc {display:none;}

.mobile { display: block; }

}

@media all and (max-width:375px){

.kboard-media-wrap .image-area .mobile-img { width: 100%; height: 375px; }

}

@media all and (max-width:320px){

.kboard-media-wrap .image-area .mobile-img { width: 100%; height: 320px; }

}

</style>

<div id="kboard-koalaa-news-feed-origin-list2">

<?php if($board->isWriter() && kboard_builder_mod() == 'list'):?>

<!-- 버튼 시작 -->

<div class="top-new-button-wrap">

<a href="<?php echo $url->getContentEditor()?>" class="top-new-button" title="<?php echo __('New', 'kboard')?>"><?php //echo __(' ', 'kboard')?>

<img src="https://www.koalaa.kr/wp-content/uploads/2022/07/add_board_icon_f.svg" data-src="https://www.koalaa.kr/wp-content/uploads/2022/07/add_board_icon_f.svg" class=" new_write_icon2">

</a>

</div>

<!-- 버튼 끝 -->

<?php endif?>

<div class="kboard-list-header">

<!-- <div id="slide-icon">

<img src="https://www.koalaa.kr/wp-content/uploads/2022/07/slide-icon.svg" data-src="https://www.koalaa.kr/wp-content/uploads/2022/07/slide-icon.svg" class=" slide-icon-img">

</div> -->

<!-- 카테고리 시작 -->

<?php

if($board->use_category == 'yes'){

if($board->isTreeCategoryActive()){

$category_type = 'tree-select';

}

else{

$category_type = 'default';

}

$category_type = apply_filters('kboard_skin_category_type', $category_type, $board, $boardBuilder);

echo $skin->load($board->skin, "list-category-{$category_type}.php", $vars);

}

?>

<!-- 카테고리 끝 -->

<!--<div class="kboard-sort">

<form id="kboard-sort-form-<?php echo $board->id?>" method="get" action="<?php echo $url->toString()?>">

<?php echo $url->set('pageid', '1')->set('category1', '')->set('category2', '')->set('target', '')->set('keyword', '')->set('mod', 'list')->set('kboard_list_sort_remember', $board->id)->toInput()?>

<select name="kboard_list_sort" onchange="jQuery('#kboard-sort-form-<?php echo $board->id?>').submit();">

<option value="newest"<?php if($list->getSorting() == 'newest'):?> selected<?php endif?>><?php echo __('Newest', 'kboard')?></option>

<option value="best"<?php if($list->getSorting() == 'best'):?> selected<?php endif?>><?php echo __('Best', 'kboard')?></option>

<option value="viewed"<?php if($list->getSorting() == 'viewed'):?> selected<?php endif?>><?php echo __('Viewed', 'kboard')?></option>

<option value="updated"<?php if($list->getSorting() == 'updated'):?> selected<?php endif?>><?php echo __('Updated', 'kboard')?></option>

</select>

</form>

</div>-->

</div>

<!-- 리스트 시작 -->

<div class="kboard-list">

<?php while($content = $list->hasNextNotice()):?>

<div class="kboard-first-news-feed-item kboard-list-notice">

<div class="kboard-item-info-2">

<div class="kboard-list-user">

<div class="avatar">

<?php if(get_avatar($content->member_uid, 40, '', $content->member_display)):?>

<?php echo get_avatar($content->member_uid, 40, '', $content->member_display)?>

<?php else:?>

<?php if($content->option->profileimg):?>

<?php if(strpos($content->option->profileimg, 'img src') !== false):?>

<?php echo $content->option->profileimg?>

<?php else:?>

<img src="<?php echo $content->option->profileimg?>" alt="<?php echo apply_filters('kboard_user_display', $content->member_display, $content->member_uid, $content->member_display, 'kboard', $boardBuilder)?>" style="width:40px">

<?php endif?>

<?php else:?>

<img src="/img/default-avatar.png" style="width:40px;">

<?php endif?>

<?php endif?>

</div>

<div class="kboard-list-display">

<?php echo apply_filters('kboard_user_display', $content->member_display, $content->member_uid, $content->member_display, 'kboard', $boardBuilder)?>

</div>

</div>

<div class="kboard-list-date"><?php echo $content->getDate()?></div>

</div>

<div>

<span class="title_txt"> <?php echo $content->title?></span>

</div>

<div class="kboard-list-description">

<div class="kboard-list-content">

<div class="content-view" <?php $length = mb_strlen($content->content, 'utf-8'); if($length > 90):?>style="max-height: 76px; display: block; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis;"<?php endif?>>

<?php echo $content->getDocumentOptionsHTML()?>

<?php echo kboard_first_news_feed_content($board, $boardBuilder, $content)?>

</div>

<?php $length = mb_strlen($content->content, 'utf-8'); if($length > 90):?>

<span class="contentmorebtn" style="color:#a8a8a8; cursor: pointer;margin:0px 0px 0px 4px;" onclick="contentmorebtn();">Xem thêm</span>

<span class="contentclosebtn" style="color:#a8a8a8; cursor: pointer;margin:0px 0px 0px 4px;" onclick="contentclosebtn();">Ẩn bớt</span>

<?php endif?>

</div>

<!--사진 출력 영역 시작-->

<?php if($content->isAttached()):?>

<div class="pc">

<div class="kboard-media-wrap" style="width:100%; margin-top: 20px;">

<?php if(count((array)$content->attach) > 0): $i=0;?>

<?php foreach($content->attach as $key=>$attach): $extension = strtolower(pathinfo($attach[0], PATHINFO_EXTENSION));?>

<?php if(in_array($extension, array('mp4','avi','mov'))):?>

<?php if($i == 0 || $i%2 == 0):?><div class="image-area" style="display: flex;"><?php endif?>

<?php if($content->option->filenumber == 2):?><center style="margin: 0 auto;"><?php endif?>

<?php echo '<video src="'.site_url($attach[0]).'" class="pc-img" controls type="video/mp4" style="margin: 2px;"></video>'?>

<?php if($content->option->filenumber == 2):?></center><?php endif?>

<?php if($i%2 == 1 || $content->option->filenumber == 2):?></div><?php endif?>

<?php else: $download[$key] = $attach; endif?>

<?php if(in_array($extension, array('gif','jpg','jpeg','png'))):?>

<?php if($i == 0 || $i%2 == 0):?><div class="image-area" style="display: flex;"><?php endif?>

<?php if($content->option->filenumber == 2):?><center style="margin: 0 auto;"><?php endif?>

<div class="pc-img" style="cursor: pointer; background-image: url(<?php echo site_url($attach[0])?>); background-size: cover; background-position: center; background-repeat: no-repeat; margin: 2px;" onclick="swiperOn();"></div>

<?php if($content->option->filenumber == 2):?></center><?php endif?>

<?php if($i%2 == 1 || $content->option->filenumber == 2):?></div><?php endif?>

<?php else: $download[$key] = $attach; endif?>

<?php $i++;?>

<?php endforeach?>

<?php if($content->option->filenumber > 2 && $i%2 == 1):?></div><?php endif?>

<?php endif?>

</div>

</div>

<div class="mobile">

<div class="kboard-media-wrap swiper-container" style="width:100%; height:auto;">

<?php if(count((array)$content->attach) > 0): $i=0;?>

<div class="image-area swiper-wrapper" style="margin-bottom:20px;">

<?php foreach($content->attach as $key=>$attach): $extension = strtolower(pathinfo($attach[0], PATHINFO_EXTENSION));?>

<?php if(in_array($extension, array('mp4','avi','mov'))):?>

<div class="swiper-slide">

<?php echo '<video src="'.site_url($attach[0]).'#t=0.1" preload="metadata" class="mobile-img" controls type="video/mp4"></video>'?>

</div>

<?php else: $download[$key] = $attach; endif?>

<?php if(in_array($extension, array('gif','jpg','jpeg','png'))):?>

<div class="swiper-slide">

<div class="mobile-img" style="cursor: pointer; background-image: url(<?php echo site_url($attach[0])?>); background-size: cover; background-position: center; background-repeat: no-repeat;"></div>

</div>

<?php else: $download[$key] = $attach; endif?>

<?php $i++;?>

<?php endforeach?>

</div>

<div class="swiper-pagination"></div>

<div class="swiper-button-next"></div>

<div class="swiper-button-prev"></div>

<?php endif?>

</div>

</div>

<div class="kboard-media-wrap swiper-container" id="swiper" style="display:none; width:100%; height:auto; top:auto;">

<div class="offbtn" style="position: absolute; top: 10px; left: 50%; transform: translateX(-50%); z-index: 99999;" onclick="swiperOff();">X</div>

<?php if(count((array)$content->attach) > 0): $i=0;?>

<div class="image-area swiper-wrapper" style="margin-bottom:20px;">

<?php foreach($content->attach as $key=>$attach): $extension = strtolower(pathinfo($attach[0], PATHINFO_EXTENSION));?>

<?php if(in_array($extension, array('mp4','avi','mov'))):?>

<div class="swiper-slide"><?php echo '<video src="'.site_url($attach[0]).'#t=0.1" preload="metadata" class="mobile-img" controls type="video/mp4"></video>'?></div>

<?php else: $download[$key] = $attach; endif?>

<?php if(in_array($extension, array('gif','jpg','jpeg','png'))):?>

<div class="swiper-slide"><img src="<?php echo site_url($attach[0])?>" alt="<?php echo $attach[1]?>"></div>

<?php else: $download[$key] = $attach; endif?>

<?php $i++;?>

<?php endforeach?>

</div>

<div class="swiper-pagination"></div>

<div class="swiper-button-next"></div>

<div class="swiper-button-prev"></div>

<?php endif?>

</div>

<?php endif?>

<!--사진 출력 영역 끝-->

<div class="kboard-list-action">

<div class="left">

<button type="button" class="kboard-button-action kboard-button-like" onclick="kboard_document_like(this)" data-uid="<?php echo $content->uid?>" title="<?php echo __('Like', 'kboard')?>"><i class="far fa-heart"></i> <span class="kboard-document-like-count"><?php echo intval($content->like)?></span></button>

</div>

<?php if($content->isEditor() || $board->permission_write=='all'):?>

<div class="right">

<a href="<?php echo $url->getContentEditor($content->uid)?>" class="kboard-button-action" title="<?php echo __('Edit', 'kboard')?>"><img src="/img/SVG/edit_icon.svg" style="width:14px;"><!--<i class="fas fa-eraser"></i>--></a>

<a href="<?php echo $url->getContentRemove($content->uid)?>" class="kboard-button-action" title="<?php echo __('Delete', 'kboard')?>" onclick="return confirm('<?php echo __('Are you sure you want to delete?', 'kboard')?>');"><img src="/img/SVG/delete_icon.svg" style="width:14px;"><!--<i class="fas fa-trash"></i>--></a>

</div>

<?php endif?>

</div>

</div>

<?php if($content->visibleComments()):?>

<div class="kboard-comments-area"><?php echo $board->buildComment($content->uid)?></div>

<?php endif?>

</div>

<?php endwhile?>

<?php while($content = $list->hasNext()):?>

<div class="kboard-first-news-feed-item kboard-list-item">

<?php endif?>

</div>

<div class="kboard-list-display">

<?php echo apply_filters('kboard_user_display', $content->member_display, $content->member_uid, $content->member_display, 'kboard', $boardBuilder)?>

</div>

</div>

<div class="doc-right"><img src="https://www.koalaa.kr/wp-content/uploads/2022/07/view_cnt_icon.svg" style="width:19px; margin:2px 0;" data-src="https://www.koalaa.kr/wp-content/uploads/2022/07/view_cnt_icon.svg" class="v-cunt-icons-doc">

<div class="view_cnt"><?php echo $content->view?></div>

<div class="kboard-list-date"><?php echo date('d-m-Y', strtotime($content->date))?></div>

<div class="kboard-list-category">

<?php if($content->category1):?>

<span class="kboard-info-value"><?php echo $content->category1?></span>

<?php endif?>

<?php if($content->category2):?>

<span class="kboard-info-value"><?php echo $content->category2?></span>

<?php endif?>

<?php if($content->option->tree_category_1):?>

<?php for($i=1; $i<=$content->getTreeCategoryDepth(); $i++):?>

<span class="kboard-info-value">#<?php echo $content->option->{'tree_category_'.$i}?></span>

<?php endfor?>

<?php endif?>

</div>

</div>

<div id="title_air">

<span class="title_txt"> <?php echo $content->title?></span>

</div>

<!--사진 출력 영역 시작-->

<?php if($content->isAttached()):?>

<div class="pc">

<div class="kboard-media-wrap" style="width:100%; margin-top: 20px;">

<?php if(count((array)$content->attach) > 0): $i=0;?>

<?php foreach($content->attach as $key=>$attach): $extension = strtolower(pathinfo($attach[0], PATHINFO_EXTENSION));?>

<?php if(in_array($extension, array('mp4','avi','mov'))):?>

<?php if($i == 0 || $i%2 == 0):?><div class="image-area" style="display: flex;"><?php endif?>

<?php if($content->option->filenumber == 2):?><center style="margin: 0 auto;"><?php endif?>

<?php echo '<video src="'.site_url($attach[0]).'" class="pc-img" controls type="video/mp4" style="margin: 2px;"></video>'?>

<?php if($content->option->filenumber == 2):?></center><?php endif?>

<?php if($i%2 == 1 || $content->option->filenumber == 2):?></div><?php endif?>

<?php else: $download[$key] = $attach; endif?>

<?php if(in_array($extension, array('gif','jpg','jpeg','png'))):?>

<?php if($i == 0 || $i%2 == 0):?><div class="image-area" style="display: flex;"><?php endif?>

<?php if($content->option->filenumber == 2):?><center class="center" style="margin: 0 auto;"><?php endif?>

<div class="pc-img" style="cursor: pointer; background-image: url(<?php echo site_url($attach[0])?>); background-size: cover; background-position: center; background-repeat: no-repeat; margin: 2px;" onclick="swiperOn();"></div>

<?php if($content->option->filenumber == 2):?></center><?php endif?>

<?php if($i%2 == 1 || $content->option->filenumber == 2):?></div><?php endif?>

<?php else: $download[$key] = $attach; endif?>

<?php $i++;?>

<?php endforeach?>

<?php if($content->option->filenumber > 2 && $i%2 == 1):?></div><?php endif?>

<?php endif?>

</div>

</div>

<div class="mobile">

<div class="kboard-media-wrap swiper-container" style="width:100%; height:auto;">

<?php if(count((array)$content->attach) > 0): $i=0;?>

<div class="image-area swiper-wrapper" style="margin-bottom:20px;">

<?php foreach($content->attach as $key=>$attach): $extension = strtolower(pathinfo($attach[0], PATHINFO_EXTENSION));?>

<?php if(in_array($extension, array('mp4','avi','mov'))):?>

<div class="swiper-slide">

<?php echo '<video src="'.site_url($attach[0]).'#t=0.1" preload="metadata" class="mobile-img" controls type="video/mp4"></video>'?>

</div>

<?php else: $download[$key] = $attach; endif?>

<?php if(in_array($extension, array('gif','jpg','jpeg','png'))):?>

<div class="swiper-slide">

<div class="mobile-img" style="cursor: pointer; background-image: url(<?php echo site_url($attach[0])?>); background-size: cover; background-position: center; background-repeat: no-repeat;"></div>

</div>

<?php else: $download[$key] = $attach; endif?>

<?php $i++;?>

<?php endforeach?>

</div>

<div class="swiper-pagination"></div>

<div class="swiper-button-next"></div>

<div class="swiper-button-prev"></div>

<?php endif?>

</div>

</div>

<div class="kboard-media-wrap swiper-container" id="swiper" style="display:none; width:100%; height:auto; top:auto;">

<div class="offbtn" style="position: absolute; top: 10px; left: 50%; transform: translateX(-50%); z-index: 99999;" onclick="swiperOff();">X</div>

<?php if(count((array)$content->attach) > 0): $i=0;?>

<div class="image-area swiper-wrapper" style="margin-bottom:20px;">

<?php foreach($content->attach as $key=>$attach): $extension = strtolower(pathinfo($attach[0], PATHINFO_EXTENSION));?>

<?php if(in_array($extension, array('mp4','avi','mov'))):?>

<div class="swiper-slide"><?php echo '<video src="'.site_url($attach[0]).'#t=0.1" preload="metadata" class="mobile-img" controls type="video/mp4"></video>'?></div>

<?php else: $download[$key] = $attach; endif?>

<?php if(in_array($extension, array('gif','jpg','jpeg','png'))):?>

<div class="swiper-slide"><img src="<?php echo site_url($attach[0])?>" alt="<?php echo $attach[1]?>"></div>

<?php else: $download[$key] = $attach; endif?>

<?php $i++;?>

<?php endforeach?>

</div>

<div class="swiper-pagination"></div>

<div class="swiper-button-next"></div>

<div class="swiper-button-prev"></div>

<?php endif?>

</div>

<?php endif?>

<!--사진 출력 영역 끝-->

<div class="kboard-list-description">

<div class="kboard-list-content">

<div class="content-view" <?php $length = mb_strlen($content->content, 'utf-8'); if($length > 90):?>style="max-height: 76px; display: block; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; width:98%; margin:0 auto;"<?php endif?>>

<?php echo $content->getDocumentOptionsHTML()?>

<?php echo kboard_first_news_feed_content($board, $boardBuilder, $content)?>

</div>

<?php $length = mb_strlen($content->content, 'utf-8'); if($length > 90):?>

<span class="contentmorebtn" style="color:#a8a8a8; cursor: pointer; margin:0px 0px 0px 4px;" onclick="contentmorebtn();">Xem thêm</span>

<span class="contentclosebtn" style="color:#a8a8a8; cursor: pointer; margin:0px 0px 0px 4px;" onclick="contentclosebtn();">Ẩn bớt</span>

<?php endif?>

</div>

<div class="kboard-list-action-list">

<div class="like-lift">

<button type="button" class="kboard-button-action kboard-button-like" onclick="kboard_document_like(this)" data-uid="<?php echo $content->uid?>" title="<?php echo __('Like', 'kboard')?>"><i class="far fa-heart" style="margin: 0 ;"></i> </botton>

<img src="https://www.koalaa.kr/wp-content/uploads/2022/07/comment_cnt_icon.svg" style="width:20px; margin: 0px 0px -2px 5px;" data-src="https://www.koalaa.kr/wp-content/uploads/2022/07/comment_cnt_icon.svg" class=" c-cunt-icons">

</div>

<?php if($content->isEditor() || $board->permission_write=='all'):?>

<div class="right">

<a href="<?php echo $url->getContentEditor($content->uid)?>" class="kboard-button-action" title="<?php echo __('Edit', 'kboard')?>"><img src="/img/SVG/edit_icon.svg" style="width:14px; margin: 0 14px 4px 0;"><!--<i class="fas fa-eraser"></i>--></a>

<a href="<?php echo $url->getContentRemove($content->uid)?>" class="kboard-button-action" title="<?php echo __('Delete', 'kboard')?>" onclick="return confirm('<?php echo __('Are you sure you want to delete?', 'kboard')?>');">

<img src="/img/SVG/delete_icon.svg" style="width:14px;margin: 0 7px 4px 0;"><!--<i class="fas fa-trash"></i>--></a>

</div>

<?php endif?>

</div>

<div id="like-count-air">

<span class="kboard-document-like-count"><b><?php echo intval($content->like)?> </b>lượt thích </span></button>

</div>

</div>

<?php if($content->visibleComments()):?>

<div class="kboard-comments-area"><?php echo $board->buildComment($content->uid)?></div>

<?php endif?>

<div id="space-line" style="height:8px; background:#c7c7c730; width: calc(100% + 30px);position: absolute; margin: 25px 0 0 -15px;"> </div>

</div>

<?php endwhile?>

</div>

<!-- 리스트 끝 -->

<div class="kboard-control">

<input type="hidden" id="kboard-first-news-feed-page-id" value="<?php echo kboard_pageid()?>">

<input type="hidden" id="kboard-first-news-feed-query-string" value="<?php echo kboard_first_news_feed_query_strings()?>">

<input type="hidden" id="kboard-first-news-feed-category1" value="<?php echo kboard_category1()?>">

<input type="hidden" id="kboard-first-news-feed-category2" value="<?php echo kboard_category2()?>">

<input type="hidden" id="kboard-first-news-feed-sort" value="<?php echo $list->getSorting()?>">

<button class="kboard-first-news-feed-button" onclick="return kboard_first_news_feed_more_view()" title="더보기">Xem thêm</button>

</div>

<?php if($board->contribution()):?>

<div class="kboard-first-news-feed-poweredby">

<a href="https://www.cosmosfarm.com/products/kboard" onclick="window.open(this.href);return false;" title="<?php echo __('KBoard is the best community software available for WordPress', 'kboard')?>">Powered by KBoard</a>

</div>

<?php endif?>

</div>

<div id="footer-spaece" style="height: 10px;">

</div>

<?php wp_enqueue_script('kboard-first-news-feed-list', "{$skin_path}/list.js", array(), KBOARD_VERSION, true)?>

<script>

var swiper = new Swiper('.swiper-container', {

pagination: {

el: '.swiper-pagination',

},

navigation: {

nextEl: '.swiper-button-next',

prevEl: '.swiper-button-prev',

},

observer: true,

observeParents: true,

});

</script>