본 블로그 적용 사용자 정의 PHP & CSS

작성자:

현재는 GeneratePress Child Theme을 생성하여 내 입맛에 맞게 끔 수정·사용 중이다.

본 블로그에 적용한 PHP 및 CSS는 다음과 같으며 현재 적용 중이 테마는 Tiny Framework Child Example 1테마이다.

※ PHP

  • 참고 사이트 [A]: How to Easily Style Tags in WordPress (With Examples) 2
  • 블로그 관리자 메뉴바 > 외모 > 테마 파일 편집기: Tiny Framework Child Example 테마 확인
  • 테마 기능 (functions.php) 선택
  • 마지막 행에 아래 내용 추가 
    /* Tag Collection begins */
function wpb_tags() { 
	$wpbtags =  get_tags();
	$i = 1;
	$length = count($wpbtags);
	foreach ($wpbtags as $tag) { 
		if ($i >= 1 && $i < $length) {
			$string .= '<span class="tagbox"><a class="taglink" href="'. get_tag_link($tag->term_id) .'">'. $tag->name . '</a><span class="tagcount">'. $tag->count .'</span></span>  ' . "\n";
		} else if ($i === $length) {
			$string .= '<span class="tagbox"><a class="taglink" href="'. get_tag_link($tag->term_id) .'">'. $tag->name . '</a><span class="tagcount">'. $tag->count .'</span></span>' . "\n";
		}
		$i += 1;
	} 
	
	return $string;
} 
add_shortcode('wpbtags' , 'wpb_tags' );
/* Tag Collection ends */
  • 적용 결과 확인: ALL TAGS 3

 

※ CSS

  • [A] 일부 참고, 적용 결과 확인: ALL TAGS
  • 블로그 관리자 메뉴바 > 외모 > 추가 CSS 선택
  • 좌측 영역에 아래 내용 입력 
    /* 본인 추가*/
pre {
	line-height: 1.5;
	max-width: 100%;
	margin-top: 10px;
	overflow: auto;
	white-space: pre;
	word-break: break-all;
	font-size: 0.8125rem;
	color: #d14;
	background-color: #f7f7f9;
	border: 1px solid #e1e1e8;
	border-radius: 4px;
	padding: 0.5rem;
}
/* [A] 일부 참고하여 적용한 CSS */
.tagbox { 
	background-color: #eee;
	border: 1px solid #ccc;
	margin: 0px 10px 10px 0px;
	line-height: 230%;
	padding: 2px 0 2px 2px;
}
.taglink  { 
	padding: 2px;
}
.tagbox a, .tagbox a:visited, .tagbox a:active { 
	text-decoration: none;
}
.tagcount { 
	background-color: royalblue;
	color: white;
	position: relative;
	padding: 2px;
}
  • 좌측 상단의 공개 버튼 클릭

조회수: 13

Footnotes

  1. 링크를 클릭하여 방문해보면, 알 수 있다. 2014년 1월 3일 글이라 너무 오래 되었다는 것을. 게다가 계속 버전이 올라가고 있는 WordPress와의 호환성 문제 가능성도 있어서 현재는 사용하지 않고 있다.
  2. 현재는 적용하지 않고 있다.
  3. 현재는 없어진 페이지다.

댓글 남기기