방문자가 첫 방문하는 첫 홈 페이지 만들기 이것은 사용자가 웹사이트를 방문했을 때, ① 최근 포스터 5개, 10개 혹은 그 이상을 보여줄 것이냐, ② 잘 꾸며진 홈페이지 하나를 보여줄 것이냐의 문제이다. 그리고 이 글은 ②를 선택할 경우 그 절차에 관한 것이다. 홈페이지와 웹 페이지와 웹 사이트의 차이는 이전 글 참고 2021.04.18 - [pc/인터넷] - 웹페이지, 웹사이트, 홈페이지 차이, 브라우저와 검색엔진의 차이 1. 홈 페이지 만들기 먼저, 가장 상위 페이지 하나를 만들어야 함 페이지 만들기 - 새로 추가 - 홈 - 내용 작성 - 공개하기를 클릭하여 만든다. 2. 전면 페이지 설정 '홈'이라 만든 페이지를 진짜 '홈페이지'로 지정하는 방법 관리자 모드에서 설정을 누르고 읽기 선택 정적인 페이..

워드프레스 지도 삽입, 리스트, 테이블, 애니메이션 삽입하기 1. 지도 삽입 방법 1) 글 쓰기 혹은 페이지 작성 '찾아오시는 길' 등 거의 안 바뀌는 지도는 '글쓰기' 보다 '페이지 쓰기'로 작성하는 것이 낫다. (글쓰기와 페이지 쓰기의 차이점은 이전의 워드프레스 글 참고) (숏코드 삽입 방법은 아래 글 참고) 숏코드 삽입 방법 워드프레스 플러그인 숏코드(shortcodes ultimate) 2) insert shortcode 선택 (워드프레스 고전 편집기 기준) insert shortcode 선택 후 - Google map을 선택한다. 3) 지도 옵션 지정 width : 지도의 넓이 지정(아래 그림) Height : 지도의 높이 지정 responsive: 마우스로 지도를 확대하고 축소하는 기능 Mar..

플러그인 숏코드(shortcodes ultimate) 지난 글에 이은 글입니다. 지난 글 목차: 워드프레스 가입형 설치형 차이, 가입 및 설치 방법 도메인 구입, 웹호스팅, ssl 인증서 워드프레스 관리자, 설정, 글 쓰기, 페이지 쓰기 방법 워드프레스 사이트 맵, 메뉴, 슬러그, 카테고리, 메뉴 워드프레스 사이드바, 위젯, 이미지, 링크 관리 워드프레스 글 쓰기 방법 1. 설치 플러그인 - 새로 추가 -를 클릭 키워드에 shortcodes ultimate를 검색하여 아래 플러그인을 설치한다. 아래 2번째 그림에서 '지금 설치'를 누르면 설치할 수 있다. 설치가 완료되면 활성화 버튼을 누른다. 2. 숏코드 사용 방법 다시 글쓰기를 해 보면 글 편집기 위에 'insert shortcode'가 생긴 것을 확..

워드프레스 글 쓰기 본문은 h2태그부터 사용한다. 왜냐하면 h1(heading 1)은 타이틀에서 사용하기 때문이다. 글이나 조직이나 두목이 2명 있으면 싸운다. 1. html 모드 아래 그림의 우측의 텍스트를 클릭하여 Html 코드를 볼 수 있다. (이 편집기 워드프레스 고전 편집기임, 아래 2의 그림과 모드만 다름. 만일 없으면 플러그인에서 다운로드 가능함) (코드 편집 등은 여기서도 할 수 있지만, 스타일 시트에서 하는 방법이 권장된다.) 2. 비주얼 글 쓰기 보통 글쓰기는 대부분 비주얼 글 쓰기로 한다. 아래 편집기 그림의 비주얼을 선택하면 된다. 아래 그림의 도구 모음 전환 버튼을 누르면 도구가 모두 표시된다. (단축키: shift+alt+Z) 이 편집기의 도구 모음은 티스토리 편집기의 도구 모음..

워드프레스 사이드바 링크, 위젯 관리 지난 글에 이은 글 지난 글 워드프레스 가입형 설치형 차이, 가입 및 설치 방법 워드프레스 설치 - 도메인 구입, 웹호스팅, ssl 인증서 워드프레스 설정, 글 쓰기, 페이지 쓰기 방법 워드프레스 사이트 맵, 메뉴, 슬러그, 카테고리, 메뉴 워드프레스 404: Page Not Found 해결 방법 사이드바 기본 3곳의 위치 좌측: 주 사이바 우측: 콘텐츠 사이드바 하단: 푸터 사이드바 그러나 실제는 플러그인에 따라 아래 그림처럼 사이드바(푸터)의 활용 개수가 많다 위젯을 추가 방법 위 사이드바(푸터)의 모든 곳에 위젯을 설치하고 제거하고 편집할 수 있다. 마우스로 드래그하여 갖다 붙일 수 있다. 마우스로 드래그하여 사이드바의 원하는 위치로 이동할 수 있다. 사이드바,..

워드프레스 사이트 맵, 메뉴, 슬러그, 글 작성, 페이지 작성, 카테고리, 메뉴 지난 글에 이은 글 워드프레스 가입형 설치형 차이 및 설치 방법 워드프레스 설치 - 도메인 구입, 웹호스팅, ssl 인증서 워드프레스 관리자, 설정, 글 쓰기, 페이지 쓰기 방법 1. 사이트맵 구축 순서 사이트맵 전체 구조: 메인 메뉴 → 메뉴 구성 항목 페이지 작성 : 시간 순서와 관계없는 글 → 사이트 소개, 비전, 찾아오시는 길 카테고리 구성 상위 카테고리 하위 카테고리 글 작성 링크 삽입 등 및 전반적인 메뉴 구성 보완 2. 고유 주소 설정 글의 '고유 주소 설정'을 글 이름으로 변경한다. 설정 고유 주소 글 이름 선택 변경사항 저장 3. 슬러그 슬러그란 원래 글, 기사 등의 제목을 쓸 때, 조사나 전치사 등은 빼고 ..

워드프레스 관리자 모드, 워드프레스 설정 지난 글 목록 1. 워드프레스 가입형 설치형 차이, 가입 및 설치 방법 2. 워드프레스 설치 - 도메인 구입, 웹호스팅, ssl 인증서 1. 알림판- 대시보드(notice board) 알림판을 선택하면 사이트 전체에 대한 관리 내용을 한눈에 볼 수 있다. (자동차 계기판, 항공기의 계기판처럼) 우측 상단의 '화면 옵션'을 아래 그림처럼 열어서 화면에 표시할 항목만 남기고 나머지는 체크 해제하여 안 보이게 할 수 있다.(특히 환영 문구 등) 2. 업데이트 자동으로 업데이트된다. 최신 버전이 아닌 경우 아래 재설치 버튼을 눌러 설치하면 된다. 3. 관리자 툴바 우측 상단의 관리자 툴바로 프로필 편집 및 로그아웃이 가능하다. 4. 로그아웃 및 로그인 1) 위 그림의 로..

워드프레스 설치 방법, 도메인 구입 및 웹호스팅 방법, ssl 인증서에 대하여 목차 도메인 구입 웹 호스팅 선택 시 고려 사항 ssl 인증서 호스팅 서비스 신청 (호스팅 환경) 세팅 완료 워드프레스 CMS 설치 ssl 인증서 신청 워드프레스 초기화면 접속 관리자 모드 들어가는 방법 워드프레스 시작 1. 도메인 구입 도메인 구입은 호스팅 케이알에서 구입하여 카페 24나 닷홈 등으로 연결하는 것이 훨씬 저렴하다. 호스팅 케이알의 도메인 비용이 다른 곳의 1/2 수준이다. 이런 내용을 몰라서 돈 낭비할 필요 전혀 없다. 도메인 구입해놓고 나면 자기 도메인은 자기가 주인인데, 권리행사는 비싼 거나 싼 거나 똑같다.(참고로 본인은 1년에 11,000짜리로 싸게 구매해서 10년 치 미리 계산해버린다) 도메인은 다른..

1. 워드프레스란, 워드프레스의 개념 WordPress에서 word란 글을 뜻하고, press는 신문, 언론, 또는’ 발행하다’라는 뜻이다. 그러므로 wordpress란 글을 발행한다는 의미이다. 과거에는 일반 사람이 홈페이지를 만들려고 할 때 전문가에게 의뢰하여 만들었고, 홈페이지의 보수나 업데이트 때마다 비용이 발생했다. 그러나 이제 전문적인 지식이 없어도 웹사이트를 제작할 수 있는 콘텐츠 관리 시스템이 있는데 그것을 CMS (Contents Management System)라 한다. 워드프레스는 템플릿을 사용하기 때문에, 테마를 자유롭게 설치하고 변경할 수 있고 위젯을 활용하여 php와 HTML 코드 수정 없이도 사용이 편리하다. 통합 링크 관리체계가 잘 작동하여 검색엔진에 친화적이며, 많은 써드파..

사이트 속도 측정, 웹 바이탈 4가지 지표에 대하여 구글 콘솔 사이트를 열고 자신의 사이트를 보면 웹 바이탈에서 실패 URL이 많이 나온다. 1. 사이트 속도 측정 2. 웹 바이탈이란 무엇인가? Web Vitals이란 단어 그대로 사이트의 신체 상태(건강 상태)이다. 이것은 구글의 PageSpeed Insight가 제공하는 지표 4가지로 측정된다. (구글의 PageSpeed Insights : 글 하단에 링크 첨부) PageSpeed Insight가 제공하는 지표 4가지는 ① FCP(First Contentful Paint), ② LCP(Largest Contentful Paint), ③ FID(First Input Delay), ④ CLS(Cumulative Layout Shift)이다. 이 네 가지 ..