본문 바로가기

뚝딱뚝딱웹공장32

모바일과 컴퓨터(데스크탑)에서 각각 동작하는 CSS .daerew { background: #EEE; text-align: justify; } @media only screen and (max-width: 767px) { /* 모바일에서 작동 */ .daerew { padding: 0 3rem 5rem 3rem; } } @media all and (min-width:767px) { /* 데스크 탑에서 작동 */ .daerew { padding: 0 7rem 5rem 7rem; } } 오래 전에는 홈페이지를 만들 때 모니터 크기가 다르고 브라우저가 다른 것을 고려해야 했다면,이제는 모바일을 고려해야 하고 오히려 모바일 중심으로 만드는 것이 대세기 때문에 미디어쿼리가 필수적이다. 2024. 5. 23.

반응형 웹 CSS 미디어쿼리 @media all and (max-width: 1024px){ //브라우저 창 width가 1024px보다 작아지는 순간부터 적용 //태블릿}@media all and (max-width: 768px){ //브라우저 창 width가 768px보다 작아지는 순간부터 적용 //모바일}@media all and (min-width: 768px){ //브라우저 창 width가 768px보다 커지는 순간부터 적용 //태블릿}@media all and (min-width: 1024px){ //브라우저 창 width가 1024px보다 커지는 순간부터 적용 //데스크탑} .box{ width: 1000px; height: 800px; background-color: red;}@media all and(max-wid.. 2024. 4. 29.

Rhymix → Rhymix 마이그레이션 툴 제로보드4에서 운영했던 여러 홈페이지들이 소실되고, 오류나고 폐쇄 시키고.... 제로보드5를 잠시 맛만 본 후 XE로 직장 홈페이지를 만들어 10년(?) 가까이 운영했다. XE 조차도 업데이트 지원이 끊기면서 Rhymix가 등장했지만, 이제 웹제작에서 손을 땐 지 너무 오래고 본업도 바쁜 관계로 관심을 가지지 않았었다. 어느 한가한 날에 '라이믹스'를 살펴보다 기존 XE 폴더 위에 덮어 씌우면 된다는 말에 NAS에 설치 해놓았던 저장용 사이트에 테스트를 하다가 복구할 수 없는 지경에 사이트 하나를 날려 먹었다. PHP 버전이나 백엔드에 대해 완전 무지했던 탓에 서버 환경은 고려하지 않은 나의 잘못이겠지... 그리고 한참의 시간이 흐른 후 어느날 직장에서 운영하던 나스가 맛탱이가 가면서 홈페이지가 망가지기.. 2023. 8. 6.

반응형 웹페이지 드롭 칼럼 1 동해물과 백두산이 마르고 닳도록 하느님이 보우하사 우리나라 만세. 무궁화 삼천리 화려강산 대한 사람, 대한으로 길이 보전하세 2 남산 위에 저 소나무, 철갑을 두른 듯 바람서리 불변함은 우리 기상일세. 무궁화 삼천리 화려강산 대한 사람, 대한으로 길이 보전하세 3 가을 하늘 공활한데 높고 구름 없이 밝은 달은 우리 가슴 일편단심일세. 무궁화 삼천리 화려강산 대한 사람, 대한으로 길이 보전하세 2021. 4. 2.

서버 이전 후 이미지 깨짐 현상 / 경로 일괄 변경 서버를 이전하거나 도메인을 변경하고 나면 기존 홈페이지에 있던 이미지들이 엑스박스로 뜨는 경우가 많다. 서버 이전이나 도메인 변경이 있으면 절대경로는 바뀌기 때문에 이미지 경로도 함께 바뀌는 현상이다. AAA.com 에서 BBB.com 으로 홈페이지를 옮기면 기존 이미지 주소가 AAA.com/img/sajin.jpg 로 남아 있기 때문에 발생하는 현상이다. 게시물의 경우 한 수많은 게시물을 일일이 변경해주기 어려우니 phpMyadmin에서 일괄적으로 변경할 수 있다. 물로 불의의 사태를 방지하기 위해 작업 전에 DB를 백업하시라.... UPDATE xe_documents SET content = REPLACE(content, '이전 도메인', '새 도메인'); 예제) UPDATE taekwondo_doc.. 2019. 6. 21.

티스토리 사이트맵 - 네이버 웹마스터도구 등록용 2019. 2. 26.

XE 마이그레이션으로 데이터 이전 시 게시물 누락 해결법 2001년경 처음 만든 동아리 홈페이지는 2012년까지 10년도 넘게 많은 리뉴얼을 거쳤다. 제로보드4로 시작하여 XE로 전환까지 시키며 꾸준히 관리했다. 시간이 흘러 나는 졸업을 했고 후배들의 무관심과 SNS의 발달로 홈페이지는 찬밥신세를 면치 못하였다. 졸업도 했고 일하느라 바쁜 와중에도 후배들을 위해 홈페이지를 꾸준히 운영해 주었지만, 찾는 이 없는 홈페이지는 용량의 압박으로 유지비만 들어가니 더는 운영할 의지도 필요도 없었다. 그렇게 몇 년이 흐르는 사이 나는 NAS에 눈을 뜨게 되었고 NAS에 홈페이지를 복구해 두었다. 언제든 볼 수 있고 언제든 다시 백업할 수 있으니 말이다. 그렇게 NAS를 꽤 오래 운영하며 나름대로 노하우가 생겼고 NAS가 2개로 늘어나면서 공간의 여유와 기술(?)도 생겼다.. 2019. 1. 28.

Synologe NAS에서 홈페이지 운영 시 크롬에서 보안경고 없애기 Synology NAS에 XE를 설치하고 홈페이지를 만들고 도메인을 연결시켰다. 어느부턴가 크롬에서 홈페이지 주소로 접속하면 주소창에 "▲ 주의 요함 | Https://www.daerew.com"이런 식으로 빨간색 표시가 주소 앞에 나타났다. 심지어 페이지가 뜨지 않고 "연결이 비공개로 설정되어 있지 않습니다."라는 경고 페이지로 들어가기도 했다. 이 문제를 해결하기 위해 알아보니 SSL 공인 인증과 관련된 문제인 것 같았다. 꽤나 오래 홈페이지를 만져왔지만 SSL은 들어만 봤지 뭐가뭔지 알 수 가 없었다. 불편한체로 그냥 지낼까 싶다가도 계속해서 눈에 거슬리고 방문자들이 들어오다가 경고페이지 때문에 돌아갈 것 같아 폭풍검색으로 해결책을 모색했다. 답은 의외로 간단했다. NAS 설정에서 손쉽게 해결할 수.. 2019. 1. 21.

Synology NAS에 도메인 연결하기 본업에 바빠 다른 것에 신경 쓸 겨를이 없다 보니 웹 생태계가 많이 바뀌어 뭐 하나 하려 해도 공부하고 폭풍검색을 해야 한다. ㅜ.ㅜ 사실 이것은 내가 하는 방식이 맞는지 확신이 서지 않는다. 다만, 나는 잘 사용하고 있기에 정보를 찾아 헤매는 하이에나에게는 꿀팁일 수도 있기에 나름 정리해 보았다. 물어봐도 잘 모르니 안 된다고 물어보기 없기! 시놀로지 NAS에 XpressEngine을 설치하고 이것은 개인이 가지고 있는 도메인(aaa.com)과 연결하는 방법이다. 예전에는 제법 절차가 복잡해서 엄두를 못 내고 있다가... DSM이 업데이트되면서 쉽게 설정할 수 있도록 바뀌었나 보다. 시놀로지 포럼카페에 있는 글을 보고 참조했다. https://cafe.naver.com/synologynas/73464 .. 2018. 9. 15.

XE 기본 카운터의 방문자 / 페이지뷰 출력하고 수정하기 전체 방문자수 출력하기 : {number_format($total_counter->unique_visitor)}오늘 방문자수 출력하기 : {number_format($today_counter->unique_visitor)}어제 방문자수 출력하기 : {number_format($yesterday_counter->unique_visitor)} 전체 페이지뷰 출력하기 : {number_format($total_counter->pageview)}오늘 페이지뷰 출력하기 : {number_format($today_counter->pageview)}어제 페이지뷰 출력하기 : {number_format($yesterday_counter->pageview)} "제로카운터"에서는 최고방문자와 최고페이지뷰 기능도 있었는데 .. 2012. 1. 2.

XE 소스 수정 없이 카테고리 자동 선택하기 보통 게시물이 하나 둘이면 문제 없겠지만, 다수의 게시물을 등록할 경우 일일이 카테고리를 선택하는 것은 여간 번거로운 일이 아니다. 소스를 수정을 통해 기본 카테고리를 지정해 주는 방법도 있지만, 이 또한 특정 카테고리만 지정을 해 놓은 것이니 불편할 수 있다. 이럴 때 소스 수정도 필요없이 원할 때 원하는 카테고리에 카테고리 선택없이 등록할 수 있는 벙법! ▲ 게시물 등록에 앞서 카테고리를 먼저 선택한다.▼ 카테고리를 먼저 선택하고 게시물 등록을 선택하면 카테고리가 선택된 상태에서 글을 등록할 수 있다. 2012. 1. 2.

rewrite rule 예외처리하기 RewriteCond $1 !^(daerew\.php|image|css|daerew\.txt) 위 구문은 daerew.php, daerew.txt, image폴더, css폴더 다음 라인에서 나오는 rewrite rule에서 예외하라는 의미이다. 2012. 1. 2.

XE 이미지 좌측 정렬시 내용이 적으면 아래부분 올라오는 문제 해결법 XE에서는 위 그림과 같이 이미지를 좌측으로 정렬하면 내용 아래에 있어야 할 첨부파일 부분이 올라오는 현상이 있다. html 작성으로 태그로 커버할 수 있지만 매번 그렇게 하는 것이 번거롭다면 스킨파일을 약간 손 보면 된다. 위의 문제는 div + css 조합으로 스킨이 만들어지다보니 생기는 문제인 것 같다. 스킨파일의 view_document.html 파일을 열어 102 라인 쯤의 {$oDocument->getContent()} 를 찾아 아래와 같이 소스를 삽입하면 된다. {$oDocument->getContent()} 여기에서는 view_document.html 파일에 직접 스타일을 적용했지만, css와 따로 분리해서 넣어도 된다. css 에 클래스를 만들어 넣고 이 부분만 넣어도 된다. 게시물별로 .. 2012. 1. 2.

대류커뮤니티 v4에 사용된 계정 및 DB현황 출력 파일 다운로드 첨부된 파일을 다운받아 압축을 풀고 에디터로 열어 자신의 환경에 맞게 수정해야 한다. $host="localhost"; // 호스트명.$user_name=""; // 자신의 계정 아이디를 적으시면 됩니다.$db_name=""; // 자신의 MySQL DB 아이디를 적으세요. $db_password=""; // 자신의 DB의 패스워드 입니다. 그리고 트래픽 사용량을 출력하기 위해 아래의 부분을 찾아 자신의 홈페이지 주소를 입력한다. 'http://' 부터 모두 입력해야 합니다. $throttle = "자신의 홈페이지주소/throttle-me/"; 트래픽 사용량을 확인하기 위해서는 계정에 'throttle-me'가 설치되어 있어야 한다. 비누넷 웹호스팅을 이용하시는 분들은 그냥 사용하면 되고 .. 2010. 3. 29.

대류의 에러페이지 소스 / 변수 실제 활용 법 웹페이지 URL 을 잘못 입력하였을 경우 404error 페이지가 뜬다. 트래픽을 초과하면 503 에러가 뜬다. 대부분의 개인 사이트에서는 그다지 필요성을 못 느끼기 때문에 에러페이지를 따로 만들어 놓지 않고 사용하는데.... 시간 날 때 만들어 두면 조금 보기 좋을 것이다. 여기서 소개하는 내용은 그걸 만들자는 것이 아니라 비교적 페이지를 효율적(?)으로 구성하는 방법을 소개한다. 내가 현재 사용하고 있는 소스 그대로를 올려본다. 나름 웹표준에 맞춰 코딩하였다. 이 소스를 공개하는 것은 에러페이지를 만드는데 도움을 주고자함이 아니라 변수를 활용하는 방법을 실전에 사용하는 간단한 예제로 보여주기 위함이다. 일단 나는 에러페이지를 4개 만들어 두었다. 403 - 무단링크 되었을 경우 출력하는 에러메시지40.. 2007. 3. 13.

갤러리 안경 배너 강00 교수님 홈페이지에 삽입하기 위해 만들었던 배너 2007. 1. 21.

웹에서 인증을 받고 페이지 들어가기 인증이 필요한 문서나 게시판등에 적용하기 편리한 소스로 아이디와 비번을 아는 사람만 접근이 가능토록 하는 것이다. 브라우져를 닫으면 소실이 되고 열고 있는 동안은 인증이 된다. 아래의 소스를 php 파일로 만들어 연결시켜주면 끝! 2006. 2. 11.

원하는 날에, 원하는 곳에, 원하는 이미지 띄우기 미리 입력해 둔 내용(이미지)를 원하는 날짜가 되면 자동으로 출력해주는 소스로 다양한 용도로 응용할 수 있는데 여기서는 국경일에 태극기 이미지를 띄우는 예제로 설명한다. 2005. 7. 27.

홈페이지 title 을 가볍게 하자. 개인 홈페이지들을 둘러보면 좀 더 역동적이고 화려한 효과를 위해 자바스크립트 등 다양한 효과를 쓰게 된다. 자바스크립트가 아니더라도 갖가지 아이콘과 문자로 꾸미기는 경우가 많다. 대표적인 것으로 브라우저 상단에 나타나는 타이틀을 움직이게 하거나 특수문자를 삽입하는 것이다. "대류커뮤니티에 오신 것을 환영합니다." 와 같은 타이틀 말이다. 요즘은 일반인들도 웬만큼은 브라우저의 주요기능들을 잘 활용한다. 가장 많이 활용되는 것 중 하나가 '즐겨찾기'일 것이다. 주소창에 나타나는 URL 앞에 아이콘이 있는데 그것을 드래그로 '즐겨찾기'에 가져다 놓으면 추가가 된다. 드래그로 즐겨찾기에 추가하게 되면 태그 안의 내용이 그대로 저장된다. title이 길다면 한눈에 확인하기가 쉽지 않다. 방문자를 고려한다면 tit.. 2005. 7. 27.

홈페이지 제작 시 경로 지정 효율성 높이기 간단한 팁인데 모르시는 사람들이 많다. 이미지를 출력하거나 링크 할 때 경로를 보통 아래와 같이 할 것이다. 이런 경우 만약 경로가 수정되거나 하면 Ctrl+H(바꾸기) 등으로 일괄 수정해야 하는데 변경해야 하는 페이지 수가 많을 경우 은근히 귀찮은 작업이다. 제로보드 외부로그인이나 최근 게시물을 사용할 때 페이지 상단에 이 구문을 이용하여 경로를 자동으로 인식하는데 이런 방식으로 경로를 지정해주고 이용하면 된다. 나는 아래와 같이 설정해 두고 사용한다. 그리고 적용할 땐 아래와 같은 형식으로 이용할 수 있다. 2005. 7. 27.

이전 1 2 다음

티스토리툴바