[WP 플러그인] 카테고리 출력 플러그인 : list category posts

원하는 포스트나 페이지에 카테고리 내용/리스트를 출력해주는 플러그인이다.

list category posts
https://wordpress.org/plugins/list-category-posts/

원하는 기능과 간결한 구조라서 지금까지 써본것중 가장 용이하게 잘 쓴 플러그인.
(물론 더 좋은것이 있겠지만 개인적으로 여태 워드프레스 개발했던 나날을 비교했을때..)

템플릿 지원하여 페이지 디자인 반영시 원하는데로 변경 가능.
다양한 shortcode 기능 제공.

[반응형 웹 개발 팁] 화면 사이즈에 따라 이미지가 동일 비율로 사이즈 변경되게 하는 방법

CSS 속성을 다음과 같이 부여한다. (필요에 따라 속성 가감. 볼드체 부분은 필수)

.your_background_class_name {
    width: 100%;    height:auto;    top: 0px;
    left: 0px;
    z-index: -1;
    position: absolute;
}

출처 : http://stackoverflow.com/questions/22556250/make-background-image-responsive

[반응형 웹 개발 팁] Fullscreen backgrounds with centered content

반응형 웹 제작시, 화면사이즈별로 페이지내 삽입된 이미지가 무조건 가운데 정렬되게끔 동작되게 하는 방법이다.

HTML, CSS 및 jQuery 코드의 추가가 필요하다.

(하단의 출처 http://www.minimit.com/articles/solutions-tutorials/fullscreen-backgrounds-with-centered-content 링크는 추가로 오버랩되는 텍스트가 있지만 여기서는 텍스트 제외 이미지만 하기로...)

HTML 섹션

<div class="background" style="background-image:url('이미지경로');border:0px;width:100%;height:301px;" data-img-width="1920" data-img-height="301" align="center"></div>

CSS 섹션

/* background setup */
.background {
    background-repeat:no-repeat;
    /* custom background-position */
    background-position:50% 50%;
    /* ie8- graceful degradation */
    background-position:50% 50%9 !important;
}

jQuery 섹션 (직접 적용해보았을때는 js에러가 나서 CSS부분만 남겨두었는데 잘 동작하였다. )

/* resize background images */function backgroundResize(){    var windowH = $(window).height();    $(".background-map").each(function(i){        var path = $(this);        // variables        var contW = path.width();        var contH = path.height();        var imgW = path.attr("data-img-width");        var imgH = path.attr("data-img-height");        var ratio = imgW / imgH;        // overflowing difference        var diff = parseFloat(path.attr("data-diff"));        diff = diff ? diff : 0;        // remaining height to have fullscreen image only on parallax        var remainingH = 0;        if(path.hasClass("parallax")){            var maxH = contH > windowH ? contH : windowH;            remainingH = windowH - contH;        }        // set img values depending on cont        imgH = contH + remainingH + diff;        imgW = imgH * ratio;        // fix when too large        if(contW > imgW){            imgW = contW;            imgH = imgW / ratio;        }        //        path.data("resized-imgW", imgW);        path.data("resized-imgH", imgH);        path.css("background-size", imgW + "px " + imgH + "px");    });}backgroundResize();

* 출처 : http://www.minimit.com/articles/solutions-tutorials/fullscreen-backgrounds-with-centered-content

[WP 플러그인] Media Library Assistant : 워드프레스 미디어 라이브러리 관리

Media Library Assistant : 워드프레스 미디어 라이브러리 관리 플러그인
https://wordpress.org/plugins/media-library-assistant/


현재 개발중인 워드프레스 사이트는 오픈 이후 운영시점에서 고려될 사항이 있었는데,
바로 업로드 해놓은 특정 이미지 몇가지를 따로 관리할 이슈였다.

포스팅을 위한 이미지 외에 지정 썸네일 같은거는 향후 포스팅시에도 지속적으로 써야하기 때문에 그런 이미지들만 따로 카테고리 지정해두어서 운영시에 유용하게 활용하도록 하였다.

비슷한 기능을 하는 다른 플러그인도 있었지만, 관리자>미디어 메뉴 접근 외,
직접 포스팅시 선택하는 미디어 선택창에서는 원하는 카테고리만 소팅해서 볼수 있는 컴포넌트가 없어서 패스.

Media Library Assistant 플러그인은 그밖에 여타 다양한 기능을 지원한다.

The Media Library Assistant was inspired by our work on this site. As you can see, we have hundreds of images and download files to manage and several custom taxonomies such as products, artisans, stories and Fair Trade Organizations to keep them organized.

http://fairtradejudaica.org/media-library-assistant-a-wordpress-plugin/

The Assistant allows us to see where our images and downloads appear in the site as featured images or are inserted in page and post bodies. We can quickly find attachments in a particular category or tag as we add pages and posts to the site. We can re-assign attachments to a different author and change meta data such as the attachment name/slug.

[WP 팁] Tablepress에서 페이지네이션을 넘버로 바꾸는 방법

대표적 테이블 출력 및 관리 플러그인인 Tablepress를 워드프레스에 적용하여 사용시,

하단에 출력되는 페이지네이션이 Previous, Next 버튼만 노출되어있는데

이 페이지네이션을 번호도 나오게끔 추가하는 방법이다.


/wp-content/plugins/tablepress/controllers/controller-frontend.php 를 연다.


302번째(업데이트 되면서 변할 수 있음) 줄의 아래 소스 코드에서

if ( $js_options['datatables_paginate'] ) {
    $parameters['pagingType'] = '"pagingType":"simple"';

simple -> simple_numbers 으로 변경하여 저장.

min.js를 js로 변환해주는 툴 : jsbeautifier

아래 링크로 이동하면 확인가능.

페이지 입력폼에 붙여넣기 하여 변환한다.

http://jsbeautifier.org/

[WP 플러그인] 워드프레스에서 미디어 파일 첨부시, 한글문자를 영어 등으로 변환해주는 플러그인

워드프레스에서 미디어 파일 첨부시, 한글명으로 된 파일을 업로드 하면
실패할때가 있고 때에 따라(타 플러그인 또는 테마 연동시 등등) 페이지에 출력이 되지않는 경우가 있다.


1. 한글문자를 해시코드 형식으로 바꿔 저장하는 플러그인
http://082net.com/2012/1024/%EC%9B%8C%EB%93%9C%ED%94%84%EB%A0%88%EC%8A%A4%EC%97%90%EC%84%9C-%ED%95%9C%EA%B8%80-%EC%9D%B4%EB%A6%84-%ED%8C%8C%EC%9D%BC-%EC%97%85%EB%A1%9C%EB%93%9C/

2. 초성,중성,종성을 영문으로 변환하여 업로드 하는 플러그인
http://ssamture.net/archives/1862


3. 한글명 파일을 제대로 업로드 할수 있게 해주는 플러그인
http://mytory.net/archives/3309/

[WP 플러그인] 워드프레스 관리자 페이지에서 DB 테이블을 직접 관리할수 있는 plugin

Database Browser

http://www.makeuseof.com/tag/working-custom-database-tables-wordpress/

[WP 팁] 워드프레스 특정 포스트ID를 통해 카테고리 값 얻는 방법

워드프레스에서 특정 포스트에 해당하는 카테고리 정보를 얻는 방법.

<?php
$category = get_the_category( $custompost );
echo $category[0]->cat_name;
?>

카테고리 ID를 얻고싶다면

$category[0]->cat_ID; 으로 지정한다.


* 참고 https://wordpress.org/support/topic/get-category-name-by-post-id

[php 팁] 정규식을 이용한 이미지 링크 추출

http://seobangnim.digimoon.net/zbxe/?mid=PHP&listStyle=webzine&page=3&sort_index=readed_count&order_type=desc&document_srl=65576

참고.

[WP 팁] 워드프레스 루트 도메인 연결

만일 wp라는 폴더에 워드프레스 설치를 하였으나,
실제 워드프레스 사이트 도메인을 wp제외 루트 접속으로 변경하고 싶다면

1. 루트 위치에 index.php를 생성하고 아래과 같이 설정한다.

<?php
/**
 * Front to the WordPress application. This file doesn't do anything, but loads
 * wp-blog-header.php which does and tells WordPress to load the theme.
 *
 * @package WordPress
 */
/**
 * Tells WordPress to load the WordPress theme and output it.
 *
 * @var bool
 */
define('WP_USE_THEMES', true);

/** Loads the WordPress Environment and Template */
require( dirname( __FILE__ ) . '/wp/wp-blog-header.php' );

      ?>

2. 워드프레스 관리자 페이지 > 설정 > 사이트주소(URL)에

wp 폴더 제외 원하는 도메인을 써준다.

참고 : 워드프레스 codex 설명 - http://codex.wordpress.org/Giving_WordPress_Its_Own_Directory

[WP 팁] 워드프레스 해당 포스트 페이지 에서 지정된 카테고리 가운데 가장 최상위 카테고리 추출

바로 상단의 카테고리는 category_parent로 가져올수 있으나,

가장 최상단의 카테고리는 아래와 같은 코드를 이용하여 추출한다.

$parentscategory ="";
foreach((get_the_category()) as $category) {
if ($category->category_parent == 0) {
$parentscategory .= $category->cat_ID .' , ';
}
}
$rootcategory_id = substr($parentscategory,0,-2);

참고 : http://www.wpbeginner.com/wp-themes/how-to-display-only-parent-category-in-your-wordpress-post-loop/

를 이용하여 재가공.

[WP 팁] 워드프레스 포스트 페이지의 해당 피쳐드 이미지 / 썸네일 주소만 추출하는 방법

get_the_post_thumbnail 함수는 썸네일 이미지 태그까지 먹힌걸로 가져오는데

여기서 이미지 경로만 추출하는 방법.



*워드프레스 포스트 피쳐드 이미지의 썸네일 주소만 추출하는 방법

$image_attributes = wp_get_attachment_image_src( get_post_thumbnail_id(포스트id), 이미지사이즈);
$lcp_thumbnail = $image_attributes[0];

출처 : https://wordpress.org/support/topic/get_the_post_thumbnail-i-only-want-the-url

에서 참고 하여 약간 가공.