pure-gallery 게시글 레이어 팝업창으로 노출

pure-gallery 스킨 사용 중이며,

썸네일 클릭 시 레이어 팝업창으로 게시글이 보이게 수정하고 싶습니다.

https://www.cosmosfarm.com/threads/document/27554#document-answer-27563

위 링크 참고하여 수정하였는데 스크립트 적용이 안되는거 같아서 문의 드립니다.

아래에 수정한 코드 첨부드립니다.

	<!-- 리스트 시작 -->
	<ul class="kboard-pure-gallery-list">
		<?php while($content = $list->hasNextNotice()):?>
		<li class="kboard-list-item kboard-list-notice<?php if($content->uid == kboard_uid()):?> kboard-list-selected<?php endif?>">
			<a href="<?php echo $url->getDocumentURLWithUID($content->uid)?>#kboard-document">
				<div class="kboard-list-thumbnail">
					<?php if($content->getThumbnail(500, 500)):?>
					<div class="kboard-list-thumbnail-child" style="background-image:url(<?php echo $content->getThumbnail(500, 500)?>)"></div>
					<?php endif?>
					<?php if(isset($content->attach->over_image)):?>
					<div class="kboard-list-thumbnail-over-background"></div>
					<div class="kboard-list-thumbnail-over-image"><img src="<?php echo site_url($content->attach->over_image[0])?>" alt=""></div>
					<?php endif?>
				</div>
				<div class="kboard-list-notice"><span class="kboard-pure-gallery-new-notify"><?php echo __('Notice', 'kboard')?></span></div>
				<div class="kboard-list-title<?php if(kboard_pure_gallery_title_line($board)):?> <?php echo kboard_pure_gallery_title_line($board)?><?php endif?>"><div class="kboard-pure-gallery-cut-strings">
					<?php if($content->secret):?><img src="<?php echo $skin_path?>/images/icon-lock.png" class="kboard-icon-lock" alt="<?php echo __('Secret', 'kboard')?>"><?php endif?>
					<?php echo $content->title?>
				</div></div>
				<div class="kboard-list-user"><?php echo $content->getUserDisplay()?></div>
			</a>
		</li>
		<?php endwhile?>
		<?php while($content = $list->hasNext()):?>
		<li class="kboard-list-item<?php if($content->uid == kboard_uid()):?> kboard-list-selected<?php endif?>">
			<a href="<?php echo $url->getDocumentURLWithUID($content->uid)?>">
				<div class="kboard-list-thumbnail">
					<?php if($content->getThumbnail(500, 500)):?>
					<div class="kboard-list-thumbnail-child" style="background-image:url(<?php echo $content->getThumbnail(500, 500)?>)"></div>
					<?php endif?>
					<?php if(isset($content->attach->over_image)):?>
					<div class="kboard-list-thumbnail-over-background"></div>
					<div class="kboard-list-thumbnail-over-image"><img src="<?php echo site_url($content->attach->over_image[0])?>" alt=""></div>
					<?php endif?>
				</div>
				<div class="kboard-list-new"><?php if($content->isNew()):?><span class="kboard-pure-gallery-new-notify">New</span><?php endif?></div>
				<div class="kboard-list-title<?php if(kboard_pure_gallery_title_line($board)):?> <?php echo kboard_pure_gallery_title_line($board)?><?php endif?>"><div class="kboard-pure-gallery-cut-strings">
					<?php if($content->secret):?><img src="<?php echo $skin_path?>/images/icon-lock.png" class="kboard-icon-lock" alt="<?php echo __('Secret', 'kboard')?>"><?php endif?>
					<?php echo $content->title?>
				</div></div>
				<div class="kboard-list-user"><?php echo $content->getUserDisplay()?></div>
			</a>
		</li>

<div class="kboard-gallery-document content-uid-<?php echo $content->uid?>">
	<div id="kboard-document">
		<div id="kboard-ocean-gallery-document">
			<div class="kboard-document-wrap" itemscope itemtype="http://schema.org/Article">
				<button type="button" onclick="close_pop_up()">닫기</button>
				<div class="kboard-title" itemprop="name">
					<p><?php echo $content->title?></p>
				</div>
			
			<div class="kboard-detail">
				<?php if($content->category1):?>
				<div class="detail-attr detail-category1">
					<div class="detail-name"><?php echo $content->category1?></div>
				</div>
				<?php endif?>
				<?php if($content->category2):?>
				<div class="detail-attr detail-category2">
					<div class="detail-name"><?php echo $content->category2?></div>
				</div>
				<?php endif?>
				<?php if($content->option->tree_category_1):?>
				<?php for($i=1; $i<=$content->getTreeCategoryDepth(); $i++):?>
				<div class="detail-attr detail-tree-category-<?php echo $i?>">
					<div class="detail-name"><?php echo $content->option->{'tree_category_'.$i}?></div>
				</div>
				<?php endfor?>
				<?php endif?>
				<div class="detail-attr detail-writer">
					<div class="detail-name"><?php echo __('Author', 'kboard')?></div>
					<div class="detail-value"><?php echo $content->getUserDisplay()?></div>
				</div>
				<div class="detail-attr detail-date">
					<div class="detail-name"><?php echo __('Date', 'kboard')?></div>
					<div class="detail-value"><?php echo date('Y-m-d H:i', strtotime($content->date))?></div>
				</div>
				<div class="detail-attr detail-view">
					<div class="detail-name"><?php echo __('Views', 'kboard')?></div>
					<div class="detail-value"><?php echo $content->view?></div>
				</div>
			</div>
			
			<div class="kboard-content" itemprop="description">
				<div class="content-view">
					<?php echo $content->getDocumentOptionsHTML()?>
					<?php echo $content->content?>
				</div>
			</div>
			
			<div class="kboard-document-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')?>"><?php echo __('Like', 'kboard')?> <span class="kboard-document-like-count"><?php echo intval($content->like)?></span></button>
					<button type="button" class="kboard-button-action kboard-button-unlike" onclick="kboard_document_unlike(this)" data-uid="<?php echo $content->uid?>" title="<?php echo __('Unlike', 'kboard')?>"><?php echo __('Unlike', 'kboard')?> <span class="kboard-document-unlike-count"><?php echo intval($content->unlike)?></span></button>
				</div>
				<div class="right">
					<button type="button" class="kboard-button-action kboard-button-print" onclick="kboard_document_print('<?php echo $url->getDocumentPrint($content->uid)?>')" title="<?php echo __('Print', 'kboard')?>"><?php echo __('Print', 'kboard')?></button>
				</div>
			</div>
			
			<?php if(isset($content->attach->over_image)) unset($content->attach->over_image);?>
			<?php if($content->isAttached()):?>
			<div class="kboard-attach">
				<?php foreach($content->getAttachmentList() as $key=>$attach):?>
				<button type="button" class="kboard-button-action kboard-button-download" onclick="window.location.href='<?php echo $url->getDownloadURLWithAttach($content->uid, $key)?>'" title="<?php echo sprintf(__('Download %s', 'kboard'), $attach[1])?>"><?php echo $attach[1]?></button>
				<?php endforeach?>
			</div>
			<?php endif?>
		</div>
		
		<?php if($content->visibleComments()):?>
		<div class="kboard-comments-area"><?php echo $board->buildComment($content->uid)?></div>
		<?php endif?>
		
		<div class="kboard-document-navi">
			<div class="kboard-prev-document">
				<?php
				$bottom_content_uid = $content->getPrevUID();
				if($bottom_content_uid):
				$bottom_content = new KBContent();
				$bottom_content->initWithUID($bottom_content_uid);
				?>
				<a href="<?php echo $url->getDocumentURLWithUID($bottom_content_uid)?>">
					<span class="navi-arrow">«</span>
					<span class="navi-document-title kboard-pure-gallery-cut-strings"><?php echo $bottom_content->title?></span>
				</a>
				<?php endif?>
			</div>
			
			<div class="kboard-next-document">
				<?php
				$top_content_uid = $content->getNextUID();
				if($top_content_uid):
				$top_content = new KBContent();
				$top_content->initWithUID($top_content_uid);
				?>
				<a href="<?php echo $url->getDocumentURLWithUID($top_content_uid)?>">
					<span class="navi-document-title kboard-pure-gallery-cut-strings"><?php echo $top_content->title?></span>
					<span class="navi-arrow">»</span>
				</a>
				<?php endif?>
			</div>
		</div>
		
		<div class="kboard-control">
			<div class="left">
				<a href="<?php echo $url->getBoardList()?>" class="kboard-pure-gallery-button-small"><?php echo __('List', 'kboard')?></a>
			</div>
			<?php if($board->isEditor($content->member_uid) || $board->permission_write=='all'):?>
			<div class="right">
				<a href="<?php echo $url->getContentEditor($content->uid)?>" class="kboard-pure-gallery-button-small"><?php echo __('Edit', 'kboard')?></a>
				<a href="<?php echo $url->getContentRemove($content->uid)?>" class="kboard-pure-gallery-button-small" onclick="return confirm('<?php echo __('Are you sure you want to delete?', 'kboard')?>');"><?php echo __('Delete', 'kboard')?></a>
			</div>
			<?php endif?>
		</div>
		
		<?php if($board->contribution() && !$board->meta->always_view_list):?>
		<div class="kboard-pure-gallery-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>
        </div>
		<?php endwhile?>
	</ul>
	<!-- 리스트 끝 -->
	
	<!-- 페이징 시작 -->
	<div class="kboard-pagination">
		<ul class="kboard-pagination-pages">
			<?php echo kboard_pagination($list->page, $list->total, $list->rpp)?>
		</ul>
	</div>
	<!-- 페이징 끝 -->
	
	<?php if($board->contribution()):?>
	<div class="kboard-pure-gallery-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>

<?php wp_enqueue_script('pure-gallery-list', "{$skin_path}/list.js", array(), KBOARD_VERSION, true)?>


<style>
#kboard-pure-gallery-list .kboard-gallery-document { display: none; position: fixed; z-index: 1; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgba(0,0,0,0.4); }
#kboard-pure-gallery-list #kboard-document { margin: 10% auto; padding: 10px; width: 50%; background-color: white; border: 1px solid gray; }
</style>

<script  src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
function kboard_gallery_document(uid){
	jQuery('.kboard-gallery-document').hide();
	jQuery('.content-uid-'+uid).show();
}
function close_pop_up(){
	jQuery('.kboard-gallery-document').hide();
}
</script>

확인 부탁드립니다.

감사합니다. 

좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기
좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기
좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기