Account options
My AccountMy OrdersSupport
Connect with us
  1. Repeater 생성 및 .grid 부여
  2. Repeater > Div 생성 및 .grid-item 부여
  3. Repeater > Div > (Sorting Target Element) 에 원하는 class 지정
  4. Repeater > Div > Code Block 생성 및 PHP 코드 입력

[PHP]

<?php
	$categories = get_the_category(get_the_ID());

	foreach( $categories as $category ) {
     
      echo "<span class='category'>$category->slug</span>";

  }
?>

위 코드를 실행하면 Code Block의 텍스트가 각각의 Category Slug로 표시되는 것을 확인할 수 있습니다.

5. 페이지 맨 상위에 Code Block 생성 및 Javascript 코드 입력

jQuery(document).ready( function() {
  
  var $grid = jQuery('.grid').isotope({
    itemSelector: '.grid-item',
    layoutMode: 'fitRows',
    getSortData: {
     title: '.title',
     date: '.date'
    }
  })
  
  jQuery('.category').each( function() {
    
    jQuery(this).closest('.grid-item').addClass(jQuery(this).text().toLowerCase());
    jQuery(this).remove();
    
  })
  
  jQuery('[data-filter]').click( function(e) {
    
    e.preventDefault();
    
    $grid.isotope({ filter: jQuery(this).data('filter') })
    
  })
  
  jQuery('[data-sortby]').click( function(e) {
    
    e.preventDefault();
    
    $grid.isotope({ sortBy: jQuery(this).data('sortby') })
    
  })
  
})

6. 또, PHP 코드란에 아래의 스크립트를 입력

<script src="https://unpkg.com/isotope-layout@3/dist/isotope.pkgd.min.js"></script>

7. 버튼을 생성하고 각각의 클래스에 대한 Attribute 속성을 다음과 같이 변경

8. 버튼을 생성하고 정렬순에 대해서 정의하고자 할 때는 Attribute 의 속성을 name > data-sortby 한 다음 위 3번에서 지정한 .classname을 value값으로 지정함.

9. Isotope 의 Layout Modes에 대해사는 아래 링크를 참고할 것

https://isotope.metafizzy.co/layout-modes.html

이미지의 링크주소중 $upload$/ 부분을 실제 사이트 주소 경로로 변경하여 줍니다.

wp-config.php 파일이 쓰기 불가능하다는 오류가 발생했을 경우 대처방법 :

sudo chmod 664 /opt/bitnami/apps/wordpress/htdocs/wp-config.php

를 실행한 후 아파치를 재시작 해줍니다.

sudo /opt/bitnami/ctlscript.sh restart apache

기능을 연결할 요소(예를 들면 button)를 선택하고 Advanced Option의 Javascript 값에 아래의 코드를 입력해 줍니다.

jQuery('#%%ELEMENT_ID%%').off('click');
jQuery('#%%ELEMENT_ID%%').click(function() {
window.print();
});

해당 버튼의 URL 값은 #을 입력해 주도록 합니다.

권한을 변경해 주는데 chmod +w로 했더니 해결되지 않아서 chmod 664로 해결했습니다.

sudo chmod 664 /opt/bitnami/apps/wordpress/htdocs/wp-config.php

sudo /opt/bitnami/ctlscript.sh restart apache

https://community.bitnami.com/t/wordpress-wp-config-to-writable/52734