Grid 아이템을 한줄에 두개씩 나오게하기 위해 아래와 같이 CSS 코드를 넣었는데, 어떠한 경우에는 아이템 크기가 넘쳐서 화면을 벗어나는 경우가 생겼다..ec-base-product ul.grid2 {grid-template-columns: repeat(2, 1fr);}  무슨 이유인지는 잘 모르겠으나, 구글링한 결과 아래처럼 바꿔줬더니 해결 가능했다..ec-base-product ul.grid2 {grid-template-columns: repeat(2, minmax(0, 1fr));}     참고 : https://stackoverflow.com/questions/43311943/prevent-content-from-expanding-grid-items

유튜브 영상이나 쇼츠를 유튜브에서 복사한 코드 그대로 가져오는 경우, 반응형이 아니라서 기기에 따라 양옆에 여백이 생기게 된다.  적용전   반영형 영상 1) 먼저 영상 아이프레임 코드를   로 감싸준다.   2) CSS로 iframe이 영상 비율에 맞게 나올 수 있도록 한다..video-container { position:relative; height:0; padding-bottom:56.25%;}.video-container iframe { position:absolute; top:0; left:0; width:100%; height:100%;}     반응형 쇼츠여백없이 꽉차게 보일 수 있도록 하기 위해서는 아래처럼 CSS를 조정하면 된다. 1) 먼저 쇼츠 아이프레임 코드를 로 감..

특정 순서의 CSS를 변경할 때 유용한 nth-child(). 다양하게 활용이 가능하다. 3의 배수인 박스 배경 변경 .box:nth-child(3n){ background:red } 20번째 이후 모든 박스 배경 변경 /* 22번 부터 이후 모든 box 폰트색 변경 */ .box:nth-child(n+20) { background:red } 1번째부터 5번째까지 박스 배경 변경 1번째부터 지정할때는 -n으로 시작하는 것 주의 .box:nth-child(-n+6) { background:red } 15번째부터 20번째까지 박스 배경색 변경 .box:nth-child(n+15):nth-child(-n+20) { background:red } 마지막에서 3번째 박스 변경 .box:nth-last-child(..

audio태그를 이용해서 음악을 넣으면 아래처럼 ... 버튼을 누르면 다운로드, 재생속도를 조절할 수 있는 메뉴가 뜨게 된다. 이 메뉴가 뜨지 않게하려면 태그 사이에 controlsList="noplaybackrate nodownload nofullscreen"을 추가하면 된다. noplaybackrate -> 재생속도 메뉴 안보이게 nodownload -> 다운로드 메뉴 안보이게 nofullscreen -> 영상의 경우 풀스크린 안되게 코드

placeholder 글자색 변경하는 방법은 아주 간단! CSS 파일에 아래 코드를 추가하면 된다. input::placeholder {color:#ccc;} input::-webkit-input-placeholder {color:#ccc;} input:-ms-input-placeholder {color:#ccc;} textarea::placeholder {color:#ccc;} textarea::-webkit-input-placeholder {color:#ccc;} textarea:-ms-input-placeholder {color:#ccc;}

현재 영카트는 입금 전 주문 내역에 대해서만 고객이 취소할 수 있도록 되어있는데, 상품 준비 전까지는 신용카드 결제 완료 후에도 얼마든지 고객이 직접 취소가 가능하도록 기능이 필요해서 아래와 같이 수정하였다.  shop/orderinqueryview.php 파일 수정 전$st_count1++; if($opt['ct_status'] == '주문') $st_count2++;} 수정 후$st_count1++; if($opt['ct_status'] == '주문' || (($opt['ct_status'] == '입금') && ($od['od_settle_case'] == '신용카드'))) $st_count2++;}    mobile/shop/orderinquerycancel.php 수..

onSlideAfter: function (currentSlideNumber, totalSlideQty, currentSlide) { $('.active-slide').removeClass('active-slide'); $('.bxslider>li').eq(currentSlide + 1).addClass('active-slide')},onSliderLoad: function () { $('.bxslider>li').eq(1).addClass('active-slide')},

업데이트중  [오류 1]  Warning: Undefined array key변경전if ($_COOKIE["hd_pops_{$nw['nw_id']}"]) 변경후 if (isset($_COOKIE["hd_pops_{$nw['nw_id']}"]))   [오류 2]  Deprecated: Optional parameter $skin_dir declared before required parameter $bo_table is implicitly treated as a required parameter in /evread/www/lib/latest.lib.php on line 7 변경전function latest($skin_dir, $bo_table, $rows, $subject_len, $cache_time, ..

Uncaught Error: Call to undefined function create_function() 에러는 create_function() 가 php8.x부터는 지원하지 않아 발생하는 오류이다.  create_function 부분을 function을 다르게 정의해서 수정하면 된다. 수정전add_action( 'plugins_loaded', create_function( '', 'global $BBCode; $BBCode = new BBCode();' ) ) 수정 후function my_hacked_function(){ global $BBCode; $BBCode = new BBCode();}add_action( 'plugins_loaded', 'my_hacked_function'); ..

wow.js는 스크롤 시 페이지들의 요소들이 하나씩 애니메이션 효과로 나타날 수 있도록 해주는 라이브러리로 각 요소들마다 옵션값을 넣어 개별적으로 애니메이션 설정할 수 있어서 사용하기 편하다. 설치방법1. 공식 사이트 Github에서 파일 다운로드https://wowjs.uk/ wow.js — Reveal Animations When Scrolling wowjs.uk  2. WOW-master/css/libs/animate.css 파일을 css폴더나 적당한 폴더에 업로드 원하는 페이지에 로드   3. WOW-master/dist/wow.min.js 파일을 js폴더나 적당한 폴더에 업로드 후 원하는 페이지에 로드, 스크립트 추가  스크립트는 아래처럼 설정도 가능하다.var wow = new WOW( { ..

카페24 DB 접속 방법 (phpMyAdmin 설치 없이 HeidiSQL로 연결하기) 카페24 웹호스팅 환경에서 DB 확인이 필요할 때, phpMyAdmin 설치 없이 HeidiSQL을 통해 외부에서 MySQL DB에 접속하는 방법을 정리했습니다. ✅ 왜 HeidiSQL인가?카페24는 기본적으로 phpMyAdmin 같은 DB 관리 툴을 제공하지 않기 때문에, DB를 확인하려면 직접 설치하거나 별도의 클라이언트 프로그램을 사용해야 합니다. HeidiSQL은 윈도우에서 작동하는 무료 DB 접속 툴로, 카페24의 MySQL DB에 외부에서 직접 접속할 수 있게 도와줍니다. 📌 HeidiSQL로 DB 접속하는 방법 1. 카페24 홈페이지 로그인 후, 우측 상단 [나의서비스관리]를 클릭. 2. 서비스사..

보안 SSL 설치후에 http://를 입력해 접속하거나 도메인에 www를 붙여 접속하는 경우 보안이 되지 않은 http로 접속되어진다.이 경우에는 .hyaccess파일 최상단에 아래 세줄을 넣어주면 된다.RewriteEngine OnRewriteCond %{HTTPS} offRewriteRule (.*) https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L] 귀찮으신 분들을 위해 파일 첨부! 다운로드해서 홈페이지 최상단 루트 폴더 안에 넣어주면 된다. [참고 포스팅]예전에 그누보드에서 강제 https로 리다이렉트 하는 방법을 올렸었는데, 위의 방법을 적용하면 다른 부분은 수정하지 않아도 된다.https://hongpage.kr/25 [php] 그누보드 보안 SSL 적용 (..

AWS S3 란?AWS S3는 Amazon Simple Storage Service 약자로 클라우드 기반의 객체 스토리지 서비스이다. 웹사이트에서 사용할 이미지, 영상 문서 등 파일을 저장하거나, 서버 백업 및 로그 보관 등 다양한 파일 저장소로 사용이 가능하다. AWS S3 무료 이용하기신규 AWS 계정에 한해 가입 후 12개월 동안 일정 사용량을 무료(Free Tier)로 제공하며, 무료기간이 끝나거나 무료 한도를 초과하면 요금이 발생한다.[AWS S3 무료 제공 항목]- 5GB의 S3 스탠다드 스토리지- 매월 20,000 GET 요청- 매월 15GB의 데이터 송신(인터넷으로 전송하는 경우) S3 버킷 생성하기1. AWS 신규 회원가입 후, AWS S3 서비스(https://s3.console...

워드나 한글 프로그램이나 일반페이지에 있는 것을 그대로 복사 붙여 사용하면 필요없는 태그들까지 복사하게 된다.이 경우 Visual Studio Code에서 정규표현식으로 쉽게 태그 제거가 가능하다.  정규 표현식 적용 전  태그 제거 방법 1) Ctrl + H를 누른 뒤, 세번째 아이콘(Use Regular Expression)을 클릭한다. 또는 Alt + R 을 누르면 선택이 된다.  2) 위칸에 아래처럼 정규식을 입력해준다. 이 정규식은 정규식에 작성한 태그 외의 태그를 모두 제거하는 정규식이다. |는 '또는'이라 지우면 안되는 태그들을 모두 |로 구분해서 넣어주면 된다. 아래의 경우에는 이미지태그(img), 링크태그(a href, /a), 테이블태그(tr, td, tbody, table, /tr, ..

그누보드 영카트 게시판에서 이모지를 등록하면 물음표로 뜨게 된다. 이 경우 CHARSET을 변경해주어야한다. 1. DB 기본 셋팅 변경 ALTER TABLE `yourDBName`.`yourTableName` CONVERT TO CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci; 2. config.php 파일 변경 기존 define('G5_DB_CHARSET', 'utf8'); 변경 define('G5_DB_CHARSET', 'utf8mb4'); 3. /adm/sql_write.sql 기존 ENGINE=MyISAM DEFAULT CHARSET=utf8; 변경 ENGINE=MyISAM DEFAULT CHARSET=utf8mb4; utf8이라 되어있는 부분을 utf8mb..