web55 워드프레스로 웹사이트 만드는 방법 [사용자 정의 링크]는 웹페이지 URL 링크를 활용해 메뉴를 만들 수 있는 편리한 기능입니다. [테마]-[메뉴]에 있는 사용자 정의 링크에 url 에는 사이트 주소/#태그명 을 작성하고 링크 텍스트는 링크로 이동할 텍스트를 작성한다. 그리고 메뉴에 추가. Zerif Lite 테마는 전면 페이지의 항목마다 사용자 정의 링크를 제공합니다. 앞서 구성한 전면 페이지 항목을 기준으로 [고객사] 항목은 #focus, [국내 시장점유율] 항목은 #aboutus, [우리의 팀원] 항목은 #team, [연락주세요] 항목은 #contact 키워드로 링크를 만들 수 있습니다. 예를 들어 [고객사] 항목의 링크는 자신의 웹사이트 URL/#focus이고, 웹사이트 URL이 http://smilewolf.kr이므로 http:/.. 2023. 7. 26. 워드프레스 검색 엔진 최적화 워드프레스에는 시스템 성능 최적화와 검색 엔진 체적화(SEO) 두 가지가 있다. Search Engine Optimization 인터넷 사용자가 구글이나 네이버의 검색창에서 키워드를 입력하고 검색할 때 자신의 콘텐츠가 검색 결과 상위에 나타나도록 콘텐츠를 작성하고 웹사이트를 운영하는 작업을 말합니다. 외부링크를 통해 다른 웹사이트를 내웹사이트에 연결하라 내 웹사이트에 좋은 콘텐츠가 많다면 방문자가 늘어날 것이며,유명한 웹사이트에서 내 웹사이트 콘텐츠 를 링크하거나 공유할 가능성이 높습니다. 유명 웹사이트에 방문한 사용자들이 링크를 통해 내 웹사이트 에 들어올 것이고 웹사이트에 방문한 사용자가 웹사이트의 다른 글을 볼 수도 있습니다. 다른 웹사이트에서 내 웹사이트에 접속하는 링크를 ‘외부 링크’라 합니다... 2023. 7. 25. 워드프레스 유용한 플러그인 추천 워드프레스는 테마와 플러그인이 전부다 유용한 추천 플러그인들을 소개한다. 홈페이지의 문의 양식을 넣어주는 플러그인 플러그인을 설치하면 워드프레스 관리자 페이지에서 필요한 내용을 넣어서 적용을 해주면 된다. 위쪽의 양식, 메일 등을 설정해주고(다른건 셋팅도 안했다.) 양식 아래에 있는 파란색 네모를 눌러 필요한 것들을 추가해줬다. FAQ 양식 책에서 알려주는 플러그인은 서비스가 중단된건지.. 안나온다. FAQ로 검색해서 많은 사람들이 설치한 플러그인을 설치해보고 적용해주면 된다. 물론 설명이 영어로 되어 있어서 좀 햇갈릴수도 있겠지만 가격표 페이지 만들기 제품서비스를 이용하는 사람들을 위해 가격표를 만들어주는 플러그인 (사용방법은 익혀야 함) 한국인들이 많이 사용하는 게시판 Kboard https://ww.. 2023. 7. 25. 워드프레스 홈페이지를 만들기 전 기획하는 방법 제일 처음 해야 할일 웹사이트 기획을 할 때 추천하는 방법은 엑셀이나 구글 스프레드시트 등을 이용하여 직접 사이트맵이나 메뉴 구조도를 만드는 것입니다. XMind가 무료로 되어 있다. www.xmindkorea.net 마인드맵 | XMind Korea XMind는 세계에서 가장 많이 사용하는 최상의 마인드맵 소프트웨어입니다. 정보를 모아 정리하고 창의적인 아이디어를 추가하여 업무 효율을 극대화하세요. XMind의 놀라운 세계를 경험하세요 !!! www.xmindkorea.net + 이건 맥용도 있으니까 다시 설치해봐야겠다. 2023. 7. 25. 워드프레스 테마에 대해 배워보기 워드프레스의 모든 테마는 공식테마를 기반으로 만든다 [외모]-[테마] 에서 디자인을 변경할 수도 있고 오른쪽 테마 목록에서 '사용자 정의하기'를 클릭해서 디자인을 변경할 수도 있다. 유료 테마에서는 [사용자 정의하기]를 사용하기도 하지만 [테마 옵션(Theme Option)] 등과 같이 따로 메뉴를 두고 테마를 관리하는 경우가 많다. 유료 테마에는 기능이 많기 때문에 별도의 메뉴로 분리한 것이다. 워드프레스에 위젯은 없어졌다?! 예전에는 '테마'탭에 위젯이 있었는데 지금은 안보인다! '플러그인'으로 통합된것인가? 그게 아니라 이것도 테마에 따라 위젯이 나왔다가 안나왔다가 하는것 같음. Demo 데이터를 활용하기 전 시스템을 백업하자 Demo 데이터가 문제를 발생시킬 경우 시스템 전체를 백업해야 Demo .. 2023. 7. 25. 워드프레스 관리자 메뉴 설정방법 및 글 고유주소 셋팅하지 않으면 생기는 문제 워드프레스 관리자 메뉴 우측 상단에는 '화면 옵션'이 있다. 확인을 잘 못하고 넘어갈 수 있지만 화면 옵션에서 보여지는 화면을 체크해서 설정할 수 있다. 체크를 한 화면들이 아래쪽에 나오는데 드래그에서 순서를 변경할 수 있다. 워드프레스 테마를 수정하려면 '외모'로 들어가야 한다. 원래 '테마디자인'이라는 이름이였는데 '외모'로 변경됐다. 인기 무료테마 중 'sydeny'라는 것이 있다. 무료테마 '인기순'이라는 카테고리도 있으니 그걸 참고해도 좋다. 여러가지 테마를 설치해보고 많이 테스트를 해보자. 카테고리 정리를 잘해야 한다. 처음부터 카테고리와 태그를 활용해 글을 잘 분류해야 한다. 글이 많아져도 찾기도 쉽고 검색엔진 최적화에도 도움이 된다. 우측에 있는 특성이미지 워드프레스 글쓰기 우측에 있는 '.. 2023. 7. 25. 피그마 해상도와 단위 용어에 관하여 스크린 사이즈 (screen size): 화면의 대각선 길이. 단위는 인치 해상도(resolution): 화면의 총 픽셀 수 ppi (pixels per inch): 화소 밀도. 디스플레이에서 인치당 픽셀 수 dpi(dots per inch): 픽셀 밀도. 화면의 실제 영역 내에 있는 픽셀 수 do (density-independent pixels) sp (scale-independent pixels) pt (point) 픽셀 밀도(DPI) 픽셀 밀도는 화면의 실제 영역 내에 있는 픽셀 수이며 dpi로 나타냅니다. 이 밀도는 화면상의 총 픽셀 수인 해상도와 다릅니다. 다양한 디바이스에 디자인이 같은 비율로 보이도록 1x를 기본으로 디자인합니다. 디자인은 1x로 하지만 디바이스에는 각 배율로 보이게 됩니다.. 2022. 11. 23. Figma 기초 다시 배우기 어쩌다 피그마를 다시 배워볼라고 기록중. V: Move K: Scale(오브젝트나 레이어 전체의 비율을 변경할 수 있다.) scale은 비율대로 조정할 수 있는데 move와 다른건 뭘까? A, F: frame 만들기.(왜 단축키는 중복으로 만들었을까?) S: Slice 원하는 만큼의 영역을 지정하여 내보낼 수 있는 툴(이 툴은 아직 잘 모르겠다!) R: 사각형 O: 원형 L: 선 P: 펜툴 shift+P: 연필툴 T: 텍스트툴 C: 코멘트툴 C를 누르면 코멘트를 남기는 창이 생긴다. 코멘트를 입력 후 줄바꿈을 하려면 cmd+Enter를 입력하면 된다. 피그마 우측 상단 확대 기능 줌(Zoom): 뷰를 확대하거나 축소합니다. 디자인이 캔버스 내 어디에 있는지 보이지 않을 경우 Zoom to ft 을 활용하.. 2022. 11. 22. 홈페이지를 쉽게 만들 수 있는 framer 우연히 소식을 접하게된 프레이머 난 당연히 피그마인줄 알았고 이제 UI뿐만 아니라 웹사이트 발행까지 가능해졌다고 한줄 알았는데 피그마가 아니라 프레이머였다! 어디서 들어본것 같기도 하고 아닌것 같기도하고.. 아마도 피그마랑 비슷한 느낌이여서 그런걸까? 프레이머 대략적으로 본 글로는 피그마 같은 기능을 하다가 홈페이지도 쉽게 만들 수 있게 바꼈다고 본것 같은데 아닌가? 좀 더 알아봐야지! 홈페이지 디자인이 좀 더 쉬워진다면.. 이런 기술을 더 배운다면 재미있어질것 같다. 아직 유튜브에는 많은 영상이 없고 있는 영상에도 조회수가 높지도 않다. 책을 찾아보니 라는 책이 있다. 2017년도에 출간이 되었는데 벌써 5년전이니까 내용이 엄청 많이 바꼈을것 같다. 해외 유튜브 영상을 찾아보든지 국내껄로 찾아보던지 해.. 2022. 9. 2. 워드프레스 홈페이지 제작 배워보기 도메인등록 업체: 호스팅케이알, 후이즈, 가비아, 카페24 웹호스팅 업체: 카페24 (호스팅케이알이 제일 저렴하다.) .com 기준으로 10,500원이다. 국내 워드프로세스 유저 대부분이 고유주소를 가지고 있는 '설치형'을 이용하고 있다. 워프프레스 사이트에서 설치 파일을 다운 받아서 설치해야 하고, FTP프로그램을 필수로 설치해야 한다. 파일질라를 사용하자. 워드프레스 6.0.1 까지 나왔구나! 내가 예전에 만들었던 워드프레스 사이트는 어디갔지? 그땐 호스팅서버도 연결안하고 그냥 썼던것 같은데.. 아! 그땐 설치형이 아니라 가입형으로 만들었던것 같네! 가입형은 wordpress.com 으로 가서 만들고 설치형은 wordpress.org로 가서 만들어야 한다. 가입형 서비스는 단순한 블로그를 운영할 사람.. 2022. 8. 16. 워드프레스 다시 시작해보자 워드프레스는 구글 검색에 최적화 되어 있다고 한다. 워드프레스의 특징으로 텍스트와 이미지가 분리되어 있기때문에 반응형 페이지에 맞춰져 있다. 워드프레스를 만든 후 구글 검색에 노출을 시키려면 우선 글을 많이 작성해야 한다. 제목에 맞는 컨텐츠를 주기적으로 작성하면 구글에 지속적으로 노출될 확률이 높아진다. 그리고 그 글에 관련된 웹페이지가 있다면 링크를 걸어 놓으면 구글 검색 최적화에 효과가 좋아진다고 한다. SEO관련 플러그인을 활용해 구글 노출 확률을 높일 수 있다. 워드프레스로 홈페이지를 만들려면 무조건 테마를 설치해야 한다. 그리고 플러그인으로 홈페이지의 기능을 추가할 수 있다. 1단계-사이트 기획 2단계-도메인 3단계-웹호스팅 4단계-테마 선정 5단계-워드프레스 제작 홈페이지를 제작하기 전에 꼭.. 2022. 8. 15. 가변 글꼴 가장 많이 사용되는 단위는 em, rem 1em=16px 글자 크기(em)=글자크기(px) / 16px 태그에서 srcset속성을 이용하면 화면 너비 값이나 픽셀 밀도에 따라 고해상도의 이미지 파일을 지정할 수 있다. 기본형 srcset 속성을 사용해 픽셀 밀도가 1일 때 표시할 이미지와 픽셀 밀도2일 때 표시할 고해상도 이미지를 따로 지정할 수 있다. (픽셀 밀도 2란 픽셀 밀도 1일 때보다 화면 1인치당 표시하는 픽셀 수가 2배라는 뜻이다. 동일한 크기를 표시하는 데 2배의 픽셀을 사용하니까 그만큼 해상도가 더 뛰어난다.) 태그와 태그를 이용해 화면 너비에 따라 다른 이미지 파일을 표시할 수도 있다. 고정 그리드 레이아웃이든 가변 그리드 레이아웃이든 맨 먼저 할 일은 펜으로 종이에 그리거나 프로그램을.. 2022. 3. 8. 이전 1 2 3 4 5 다음