Dev Blog

스크립트 & 소스코드 공유

실무에서 유용하게 쓰는 스크립트와 코드 조각을 블로그 게시판으로 저장하고 공유합니다.

총 110건의 글

그누보드 전체 회원 정보를 엑셀로 저장하는 PHP 소스

그누보드에서 전체 회원 정보를 엑셀 파일로 저장하는 PHP 소스다. _common.php 파일이 있는 경로(예: /adm/)에 파일을 만들고 소스를 붙여넣으면 되며, 관리자 모드로 접속해야 다운로드가 가능하다. 2019년 1월 15일 업데이트로 탈퇴한 회원은 목록에서 제외되도록 수정되었다.

  • '_common.php'파일 있는 경로(예. /adm/)에 파일하나 만들고 아래 소스 복붙하시면 됩니다.

(관리자모드에서 진입해야 다운로드 가능)

[update]

190115 : 탈퇴인원 제외

<?php
include_once("./_common.php");
include_once(G5_LIB_PATH.'/PHPExcel.php');

if (!$is_admin =="super")
alert_close("최고 관리자 영역 입니다.");

function column_char($i) { return chr( 65 + $i ); }

$headers = array('번호', 'ID', '이름', '닉네임', '레벨', '포인트', '가입일', 'Email', '홈페이지', '성별', '생일', '전화', '휴대폰', '메일링', '정보공개', '최근로그인', '주소');
$widths  = array(18, 15, 15, 15, 15, 15, 15, 50, 20, 20, 20, 20, 20, 20, 20, 20, 100);
$header_bgcolor = 'FFABCDEF';
$last_char = column_char(count($headers) - 1);

$sql    = " select * from g5_member where mb_leave_date = '' order by mb_datetime desc ";
$result = sql_query($sql);
for($i=1; $row=sql_fetch_array($result); $i++) {

if ($row['mb_sex'] =="M") { $mb_sex ="남자"; } else if ($row['mb_sex'] =="F"){ $mb_sex ="여자"; }
if ($row['mb_mailling'] =="1") { $mb_mailling ="받음"; } else if ($row['mb_mailling'] =="0"){ $mb_mailling ="안받음"; }
if ($row['mb_open'] =="1") { $mb_open  ="공개"; } else if ($row['mb_open'] =="0"){ $mb_open ="비공개"; }
$rows[] =
array(
$i,
$row[mb_id],
$row[mb_name],
$row[mb_nick],
$row[mb_level],
$row[mb_point],
$row[mb_datetime],
$row[mb_email],
$row[mb_homepage],
$mb_sex,
$row[mb_birth],
$row[mb_tel],
$row[mb_hp],
$mb_mailling,
$mb_open,
$row[mb_today_login],
print_address($row['mb_addr1'], $row['mb_addr2'], $row['mb_addr3'], $row['mb_zip1'])
);
}

$data = array_merge(array($headers), $rows);

$excel = new PHPExcel();
$excel->setActiveSheetIndex(0)->getStyle( "A1:${last_char}1" )->getFill()->setFillType(PHPExcel_Style_Fill::FILL_SOLID)->getStartColor()->setARGB($header_bgcolor);
$excel->setActiveSheetIndex(0)->getStyle( "A:$last_char" )->getAlignment()->setVertical(PHPExcel_Style_Alignment::VERTICAL_CENTER)->setWrapText(true);
foreach($widths as $i => $w) $excel->setActiveSheetIndex(0)->getColumnDimension( column_char($i) )->setWidth($w);
$excel->getActiveSheet()->fromArray($data,NULL,'A1');

header("Content-Type: application/octet-stream");
header("Content-Disposition: attachment; filename=\"members-".date("ymd", time()).".xls\"");
header("Cache-Control: max-age=0");

$writer = PHPExcel_IOFactory::createWriter($excel, 'Excel5');
$writer->save('php://output');
?>

유튜브 영상을 웹페이지 배경으로 사용하는 CSS 기법

유튜브 동영상을 웹페이지 전체 배경으로 사용하는 HTML/CSS 기법이다. video-background 컨테이너와 video-foreground 안의 iframe을 화면에 꽉 차게 배치하고 z-index를 낮춰 콘텐츠 뒤에 깔리게 한다. 화면 비율에 따라 16:9, 9:16 미디어 쿼리로 확대 영역을 조정하는 전체 CSS와 HTML 예제 코드를 제공한다.

* {
  box-sizing: border-box;
}

.video-background {
  background: #000;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -99;
}

.video-foreground,
.video-background iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

#vidtop-content {
  top: 0;
  color: #fff;
}

.vid-info {
  position: absolute;
  top: 0;
  right: 0;
  width: 33%;
  background: rgba(0, 0, 0, 0.3);
  color: #fff;
  padding: 1rem;
  font-family: Avenir, Helvetica, sans-serif;
}

.vid-info h1 {
  font-size: 2rem;
  font-weight: 700;
  margin-top: 0;
  line-height: 1.2;
}

.vid-info a {
  display: block;
  color: #fff;
  text-decoration: none;
  background: rgba(0, 0, 0, 0.5);
  transition: .6s background;
  border-bottom: none;
  margin: 1rem auto;
  text-align: center;
}

@media (min-aspect-ratio: 16/9) {
  .video-foreground {
    height: 300%;
    top: -100%;
  }
}

@media (max-aspect-ratio: 16/9) {
  .video-foreground {
    width: 300%;
    left: -100%;
  }
}

@media all and (max-width: 600px) {
  .vid-info {
    width: 50%;
    padding: .5rem;
  }

  .vid-info h1 {
    margin-bottom: .2rem;
  }
}

@media all and (max-width: 500px) {
  .vid-info .acronym {
    display: none;
  }
}
<div class="video-background">
  <div class="video-foreground">
    <iframe class="ww" src="https://www.youtube-nocookie.com/embed/n0AY4ebPy4w?autoplay=1&loop=1&controls=0&vq=hd720"
      frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"
      allowfullscreen></iframe>
  </div>
</div>
<div id="vidtop-content">
  <div class="vid-info">
    <h1>YouTube</h1>
    <p>Good!</p>
  </div>
</div>

CSS 선택자(Selector) 참조 매뉴얼

CSS 선택자를 정리한 참조 매뉴얼이다. 클래스·ID·요소 선택자, 속성 선택자([target], [attr^=], [attr$=], [attr*=] 등), 가상 클래스(:hover, :focus, :first-child, :before, :after 등)와 CSS 버전별 지원 범위, 그리고 조합 선택자(후손·자식·인접 형제)를 예시와 함께 표로 정리했다.

选择器 例子 例子描述 CSS
.class .intro 选择 class="intro" 的所有元素。 1
#id #firstname 选择 id="firstname" 的所有元素。 1
* * 选择所有元素。 2
element p 选择所有 <p> 元素。 1
element,element div,p 选择所有 <div> 元素和所有 <p> 元素。 1
element element div p 选择 <div> 元素内部的所有 <p> 元素。 1
element>element div>p 选择父元素为 <div> 元素的所有 <p> 元素。 2
element+element div+p 选择紧接在 <div> 元素之后的所有 <p> 元素。 2
[attribute] [target] 选择带有 target 属性所有元素。 2
[attribute=value] [target=_blank] 选择 target="_blank" 的所有元素。 2
[attribute~=value] [title~=flower] 选择 title 属性包含单词 "flower" 的所有元素。 2
[attribute|=value] [lang|=en] 选择 lang 属性值以 "en" 开头的所有元素。 2
:link a:link 选择所有未被访问的链接。 1
:visited a:visited 选择所有已被访问的链接。 1
:active a:active 选择活动链接。 1
:hover a:hover 选择鼠标指针位于其上的链接。 1
:focus input:focus 选择获得焦点的 input 元素。 2
:first-letter p:first-letter 选择每个 <p> 元素的首字母。 1
:first-line p:first-line 选择每个 <p> 元素的首行。 1
:first-child p:first-child 选择属于父元素的第一个子元素的每个 <p> 元素。 2
:before p:before 在每个 <p> 元素的内容之前插入内容。 2
:after p:after 在每个 <p> 元素的内容之后插入内容。 2
:lang(language) p:lang(it) 选择带有以 "it" 开头的 lang 属性值的每个 <p> 元素。 2
element1~element2 p~ul 选择前面有 <p> 元素的每个 <ul> 元素。 3
[attribute^=value] a[src^="https"] 选择其 src 属性值以 "https" 开头的每个 <a> 元素。 3
[attribute$=value] a[src$=".pdf"] 选择其 src 属性以 ".pdf" 结尾的所有 <a> 元素。 3
[*attribute*=value*] a[src*="abc"] 选择其 src 属性中包含 "abc" 子串的每个 <a> 元素。 3
:first-of-type p:first-of-type 选择属于其父元素的首个 <p> 元素的每个 <p> 元素。 3
:last-of-type p:last-of-type 选择属于其父元素的最后 <p> 元素的每个 <p> 元素。 3
:only-of-type p:only-of-type 选择属于其父元素唯一的 <p> 元素的每个 <p> 元素。 3
:only-child p:only-child 选择属于其父元素的唯一子元素的每个 <p> 元素。 3
:nth-child(n) p:nth-child(2) 选择属于其父元素的第二个子元素的每个 <p> 元素。 3
:nth-last-child(n) p:nth-last-child(2) 同上,从最后一个子元素开始计数。 3
:nth-of-type(n) p:nth-of-type(2) 选择属于其父元素第二个 <p> 元素的每个 <p> 元素。 3
:nth-last-of-type(n) p:nth-last-of-type(2) 同上,但是从最后一个子元素开始计数。 3
:last-child p:last-child 选择属于其父元素最后一个子元素每个 <p> 元素。 3
:root :root 选择文档的根元素。 3
:empty p:empty 选择没有子元素的每个 <p> 元素(包括文本节点)。 3
:target #news:target 选择当前活动的 #news 元素。 3
:enabled input:enabled 选择每个启用的 <input> 元素。 3
:disabled input:disabled 选择每个禁用的 <input> 元素 3
:checked input:checked 选择每个被选中的 <input> 元素。 3
:not(selector) :not(p) 选择非 <p> 元素的每个元素。 3
::selection ::selection 选择被用户选取的元素部分。 3

jQuery로 Ajax 폼 전송하기 (submit 이벤트 가로채기)

jQuery의 submit 이벤트를 가로채 페이지 새로고침 없이 Ajax로 폼을 전송하는 방법이다. event.preventDefault()로 기본 전송을 막고, 서버에 Ajax 사용을 알리는 hidden 필드를 설정한 뒤 폼의 action URL과 serialize() 데이터를 준비한다. 이후 $.get으로 데이터를 보내고 응답받은 HTML 조각을 body에 추가하는 전체 코드를 담고 있다.

//form요소를 찾아서 그의  submit 이벤트를 가로챈다.
  $('form').submit(function (event) {
    //ajax를 사용하여 폼을 전송시키고자 한다(페이지의 새로고침을 막는다)
    event.preventDefault();
    //필요하다면, 유효성 검사 코드를 이부분에 추가하도록 한다.
    // .....
    //이는 ajax 가 사용되었음을 서버측에 알리는 용도이다.
    $('input[name='usingAJAX']', this).val('true');
    //폼에대한 참조를 저장한다.
    var $this = $(this);
    //폼요소의 url을 가로챈다.
    var url = $this.attr('action');
    //전송시킬 폼 데이터를 준비한다.
    var dataToSend = $this.serialize();
    // 서버측처리이후에 실행되어야 할 콜백함수
    var collback = function (dataReseived) {
      //폼을 숨긴다(폼에대한 참조를 $this에 저장해 놓았기에 가능)
      $this.hide();
      //서버로부터 다음과 같은  HTML 조각을 반환 맏을 것이기에 DOM에 이 HTML 조각이 추가된다.
      //&lt;div id='result'&gt;Your favorite food is pizza!
      // Thanks for telling us!&lt;/div&gt;
      $('body').append(dataReseived);
    };
    //수신되는 데이터의 형식(이번예제에서는 html 코드가 수신될 것이라 기대한다)
    var tyhpeOfDataToReceive = 'html';
    //폼을 전송한 후 데이터의 수신을 기다린다.
    $.get(url, dataToSend, collback, tyhpeOfDataToReceive);
  });//.submit() 을 닫는다.

까페24 호스팅에서 PHP 에러 메시지 출력하기

까페24 호스팅에서 PHP 작업 시 에러 메시지가 화면에 표시되지 않아 디버깅이 어려운 문제의 해결책을 정리했다. .htaccess에 php_value error_reporting 22527과 php_flag display_errors on을 추가하고, 코드 상단에 ini_set("display_errors", 1)와 error_reporting(E_ALL ^ E_NOTICE)를 넣거나 set_error_handler 클래스를 활용하는 방법을 설명한다.

[문제점]

최근 까페24호스팅에서 php작업시

화면에 에러메세지가 나오지 않아 디버깅시에 매우 곤란함

[해결책]

.htaccess 내용에 아래추가.

=====================================

php_value error_reporting 22527

php_flag display_errors on

=====================================

  1. 인클루드 시키는 라이브러리 젤첨에

ini_set("display_errors", 1);

error_reporting(E_ALL ^ E_NOTICE);

추가

  1. 넷상에 공개된 set_error_handler 클래스 이용


Let's create something great together.

프로젝트 문의 및 견적 요청은 언제든 환영합니다.