Dev Blog

스크립트 & 소스코드 공유

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

총 110건의 글

그누보드 메일이 발송되지 않을 때 - SMTP 설정 방법

그누보드에서 메일이 정상적으로 발송되지 않을 때 네이버 SMTP로 보내는 설정 방법이다. /lib/mailer.lib.php에서 G5_SMTP 관련 부분을 주석 처리하고, $mail->IsSMTP(), SMTPSecure = "ssl", Host = smtp.naver.com, Port = 465, 네이버 계정의 Username과 Password를 직접 입력한다. 네이버 메일의 POP3/IMAP 설정 안내에서 값을 확인할 수 있다.

닷X 무료 호스팅과 네이버 SMTP를 기준으로 테스트한 것입니다.
우선 /lib/mailer.lib.php 파일을 여신 후에

/*
if (defined('G5_SMTP') && G5_SMTP) {
$mail->IsSMTP(); // telling the class to use SMTP
$mail->Host = G5_SMTP; // SMTP server
if(defined('G5_SMTP_PORT') && G5_SMTP_PORT)
$mail->Port = G5_SMTP_PORT;
}
*/

이렇게 된 부분이 있습니다.
주석으로 막으셔도 되고 위에 써 있는 상수(config.php)를 직접 수정하셔도 됩니다.
계정 정보를 입력해야 하고 ssl, auth 이런 것들 때문에 저는 주석으로 막고 이 파일을 그냥 수정했습니다.

아래 부분을 주석으로 막은 바로 밑에 붙여 넣으시면 됩니다.

$mail->IsSMTP();
$mail->SMTPDebug = 2;
$mail->SMTPSecure = "ssl";
$mail->SMTPAuth = true;
$mail->Host = "smtp.naver.com";
$mail->Port = 465;
$mail->Username = "naver id";
$mail->Password = "naver password";

//여기에서 수정하셔야 할 것은

$mail->Host = "smtp.naver.com";
$mail->Port = 465;
$mail->Username = "naver id";
$mail->Password = "naver password";

이 네 가집니다.

위 값은 SMTP를 제공해 주는 메일 계정에 보면 다 나옵니다.
네이버를 기준으로 하였으니 네이버 메일로 접속하신 후 좌측 하단에 보면 '외부메일 가져오기'라고 된 부분이 있습니다.
클릭하신 후에 POP3/IMAP 설정을 들어가세요.
그러면 가장 하단에 '메일 프로그램 환경 설정 안내' 부분이 있습니다.
여기에 있는 정보를 그대로 위 네 가지에 넣어 주시면 됩니다.

그리고 나서 실행해 보세요.

혹시 몰라 mailer.lib.php 파일 첨부합니다.

mailer("테스트", "보내는 사람", "받는 사람", "대출 문의", "내용입니다.");
실제로 위 함수를 실행할 때 보내는 사람 메일 주소는 smtp 계정에서 사용하는 메일 주소를 넣으셔야 합니다.
예를 들어서 나는 개인정보보호를 위한 이메일주소 노출방지 으로 해야만 발송이 된다는 겁니다.

CSS 애니메이션 예제 - 요소 움직임·전환 효과

CSS 애니메이션으로 요소를 부드럽게 움직이고 전환 효과를 주는 예제를 보여주는 CodePen 데모다. @keyframes로 위치·크기·색상 등의 변화를 정의하고 transition을 함께 사용해 자연스러운 모션을 구현한다. 버튼·배너·배경 등에 바로 적용할 수 있는 스타일이며 duration과 easing 조절 방법도 함께 확인할 수 있다.

See the Pen Untitled by H J (@H-J-the-typescripter) on CodePen.

배경에 따라 글자 색이 자동으로 변하는 텍스트 효과

배경 이미지에 따라 글자 색이 자동으로 적응하는 효과를 CSS로 구현한 CodePen 예제다. mix-blend-mode와 background-clip을 활용해 밝은 배경과 어두운 배경 모두에서 글자가 또렷하게 보이도록 하며, 배경 위에 겹쳐진 텍스트의 가독성을 높이는 기법이다.

See the Pen Untitled by H J (@H-J-the-typescripter) on CodePen.

스크롤에 따라 배경이 움직이는 시차(Parallax) 효과

스크롤 위치에 따라 배경 요소가 서로 다른 속도로 움직이는 시차(Parallax) 스크롤 효과를 보여주는 CodePen 예제다. CSS background-attachment: fixed를 이용하거나 JavaScript 스크롤 이벤트로 요소의 transform을 조절해 깊이감 있는 화면을 연출한다.

See the Pen Untitled by H J (@H-J-the-typescripter) on CodePen.

CSS로 텍스트가 가로로 흐르는 롤링(스크롤) 효과 만들기

텍스트가 가로 방향으로 흐르는 롤링 효과를 CSS로 구현한 CodePen 예제다. @keyframes에서 요소를 왼쪽으로 translateX 이동시키고 infinite 애니메이션을 적용해, 공지사항이나 배너 문구가 화면을 가로질러 반복적으로 흐르도록 만든다. 속도 조절과 일시정지도 CSS로 처리할 수 있다.

See the Pen Untitled by H J (@H-J-the-typescripter) on CodePen.



Let's create something great together.

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