본문 바로가기
  • 나의 작은 기록이 도움이 될 수 있기를

하루하루707

맥북프로M216인치 보다 143만원 더 싸게 맥북프로 16인치 얻을 기회 맥북프로 16인치 모델이 이보다 저렴할 수는 없다! 사용하고 있던 맥북프로13인치 모니터가 갑자기 나가서! 어쩔 수 없이 당장 구매할 수 있는 맥북에서 M1을 구매했는데 처음 사용해본 애플 실리콘 M1은 상상이상이다! 맥스튜디오의 M1MAX도 써봤는데 일반적인 작업을 하는 사람들에게는 M1이나 M2나 M1 MAX나 M1Pro나 싱글코어 점수가 크게 나지 않기 때문에 큰 체감은 없더라! 다시한번 말하지만 일반적인 작업(인터넷, 문서작업 등)은 진짜 큰 체감이 없다. 휴대성을 생각한다면 노트북이 맞고 거기다 14인치가격보다 더 저렴한데 16인치 제품을 구매할 수 있다면 마다할 이유가 없다! 기회다! 나는 14인치를 고민했었는데 이 가격이면 무조건 16인치지! 맥북프로13인치를 쓰다가 가격때문에 14인치를 구.. 2023. 9. 6.
divi 아코디언 메뉴 마우스 오버했을때 색상 및 서체 크기 변경하는 방법 아코디언 메뉴 뿐 아니라 기본적인 사용법은 동일하다 divi 테마 프로그램의 기본 사용방법인데 이걸 모르고 있었다니! 아코디언 메뉴에 마우스를 올리면 서체크기와 색상을 변경하려면 위에 보이는 메뉴는 거의 모든 속성창과 동일한데 아이맥 모양의 아이콘 오른쪽에 있는 마우스버튼 아이콘을 클릭하면 마우스 오버를 했을때 변하는 모든 설정을 변경할 수 있다. 추가로 닫힌 아코디언 높이를 변경하는 방법 divi 테마 옵션으로 들어가서 css 코드를 추가해야 한다. .vertical-align .et_pb_toggle.et_pb_toggle_close{ padding-top: 11px !important; padding-bottom: 11px !important; } 위에 있는 11px 값을 원하는 높이로 변경해주면 .. 2023. 9. 5.
divi 메인 배너 줄바꿈 및 행간 조절하는 방법 메인 배너에 줄바꿈 기능이 없어서 메인 배너에 들어갈 텍스트를 입력하면 자동으로 줄바꿈이 진행되서 내가 원하는 장소에서의 변경이 불가능했다. 아래는 내가 원하는 문장에서의 줄바꿈을 해결한 화면 태그를 사용하고 싶은데 메인 배너의 텍스트입력란에는 태그 적용이 안되더라. 그럼 어떻게 해결할 수 있나? 메인 타이틀에 텍스트를 입력하지 않고 본문 텍스트 입력하는 곳에 텍스트를 입력해야 여러가지 태그 속성을 적용할 수 있다. 메인 텍스트는 처음부터 로 분류해서 입력을 하고 폰트크기나 행간의 경우 style로 적용을 해서 하나 하나 값을 입력해줘야 한다. font-weight: font-size: line-height: 지금은 마구잡이고 px을 쓰다가 안쓰는 곳도 있고 하지만 하나하나 정리해줘야지! + 처음 'Te.. 2023. 9. 5.
divi accordino module 값 변경하는 방법 폰트 세로 가운데 정렬 divi Accordion 모델에 클래스 이름을 먼저 지정해줘야 한다. 개별 커스텀값 옵션이 없는 경우에는 대부분 새롭게 정의를 해줘야 하는데 아코디언 메뉴에서 수정하려는 부분의 클래스 이름을 정의해줘야 한다. 아코디언 모듈 선택후 'advanced' 메뉴에서 CSS Class 이름을 vertical-align 이라고 지정해줬다. 이건 알아보기 쉬운 이름을 지정해주면 된다. '세로 정렬값' Divi Theme Option으로 들어가서 CSS값을 설정해줘야 한다. 저 위에서는 아코디언 메뉴의 클래스 이름만 설정을 해준거고 이제 그 이름을 붙인 아코더언 메뉴의 설정을 바꿔주려면 CSS값을 변경해줘야 하는데 DIVI- Theme Option으로 들어가서 변경해야 한다. Custom CSS 입력공간에 다음을 넣.. 2023. 9. 5.
divi theme 기본 폰트변경 하는 방법 워드프레스 메인 화면에서 'Theme Customizer'를 선택한다. 너무 쉬다가 다시 시작하는 워드프레스 자동 번역되는 글이 너무 엉망이라서 영문으로 변경해서 쓰는 중인데 아직 워드프레스에 익숙하지도 않은데 바로 영문으로 변경해서 좀 햇갈리긴 하는데 나중에는 오히려 이게 더 편할지도 모르겠다. 워드프레스 기본 default 값을 변경하려면 테마커스텀으로 들어가야 한다. General Settings 에서 거의 대부분을 변경할 수 있다. 여러가지 기본값을 변경할 수 있는 부분이 많지만 기본 서체의 경우 general settings로 들어가서 변경할 수 있다. Typography 로 들어가준다. 익숙해지면 쉽게 찾을 수 있겠지만 일단은 잊기전에 기록해두는 용도로 Customizing -> General.. 2023. 9. 5.
divi builder 아코디언 메뉴 열리는 속도 조절하는 방법 divi theme 에 있는 아코디언 메뉴 열리는 속도를 조절하는 방법 divi 모듈중에 아코디언 모듈이 있는데 이게 기본으로 사용하면 문제가 없는데 안쪽에 이미지를 넣고 간격을 조정한다던지 하나하나 조정하려면 기본 설정으로는 안되는 경우가 많다. 아코디언 메뉴의 경우 버튼을 클릭하면 메뉴가 열리면서 텍스트가 에니메이션으로 표현이 된다. 하지만 에니메이션의 속도를 조절한다던가 디테일한 조정은 역시나 코딩값을 입력해야 변경을 할 수 있다. 기본 디폴트값이 느리게 설정이 되어 있어서.. 그런데 하나의 값을 조정해 버리면 새로 추가하는 아코디언 모듈이나 기존이 있던 다른 아코디언 모듈의 값도 모두 바뀐다. 이것도 하나하나 개별로 셋팅하는 방법이 있을것 같긴하지만.. 지금 디자인하고 있는 페이지에서는 1개의 아.. 2023. 8. 22.
원페이지 디자인 divi 테마에서 dot navigation 없애는 방법 홈페이지 사이드 네비게이션바 없애는 방법 특히 외국 사이트의 경우 우측에 네비게이션 버튼이 달려있는 경우가 많은데 워드프레스 홈페이지 디자인 트랜드 같은 느낌이다. 처음에는 좋았는데 자꾸 보니까 따라다니는게 거슬려 보인다. 특히 모바일에서는 안그래도 가로폭이 좁은데 저 버튼까지 있으니까 더 답답한 느낌이다. DIVI 테마 페이지 속성에서 변경해줘야 한다. 그렇다는 말은 각 페이지마다 이 네비게이션 버튼을 보이게도 안보이게도 할 수 있다는 말이다. 전에 기록해 놓은 줄 알았는데 안보여서 다시(?) 기록하는 중 페이지 수정 옵션으로 들어가서 우측에 있는 사이드바 아래쪽으로 찾아가면 Divi page settings가 보인다. 그 아래에 있는 dot navigation이 'on'으로 되어 있는걸 확인할 수 있.. 2023. 8. 22.
맥용 피그마를 다시 설치했다. 어도비에 인수되었지만 뭐가 달라진거지? 피그마가 한창 주가를 올리고 있을때 어도비에서도 adobeXD로 도전을 하며 맞서고 있었지만 피그마를 이길 수 없었고 결국 자본력으로 피그마를 인수했다. (옛날에 플래시도 인수를 했었나?) 결국 사라져 버렸지만 피그마도 어도비 속으로 들어오게 될까? 아님 그냥 지금처럼 유지가 될까? 어도비XD 개발팀들은 뭔가 포지션이 애매하게 될듯하다. XD팀들이 모두 피그마로 넘어가는 걸까? 배워두면 유용할 피그마 꼭 디자이너만 사용하는게 아니라 실제로 디자이너가 아닌 사람이 활용하는 걸 봤는데 자기가 필요한 영역에서 유용하게 잘 쓰더라. 나중에 여기서 디자인한 것들도 바로 실제로 사용할 수 있게 되는 기능도 생길것 같긴한데.. 미리미리 배워둬서 나쁠껀 없을것 같다. + 요즘 h.. 2023. 8. 21.
워드프레스 처음 사용하면 불편한 점들 네이버 블로그나 티스토리 블로그를 사용하다가 워드프레스 쓰면 불편한점들 주로 티스토리나 네이버 블로그를 쓸때는 몰랐던 워드프레스를 사용할때 불편하점들 글쓰기 대표 이미지 넣기 글쓰기 처음 워드프레스에 글을 쓰다보면 우리나라 블로그 툴이 너무 편하게 잘 되어 있다는게 느껴진다. 워드프레스는 블럭 단위로 글이 작성되기 때문에 그냥 Enter키를 누르면 바로 문단이 만들어 진다. html 태그로 보면 태그가 만들어 지는 셈이다. 나는 태그로 줄 바꿈만 하고 싶은데 엔터키를 두번 누른것 처럼 바뀐다. 기본 설정에 있는지 없는지 모르겠지만 뭔가 어색하다. 이건 나중에 익숙해지면 해결 될 문제이긴 하지만.. 우리나라 블로그처럼 셋팅해서 편하게 글을 쓰고 싶다. 나중에 관련 플러그인이 있는지 찾아봐야겠다. 대표 이미.. 2023. 8. 20.
맥용 visual studio code VScode 배워보기(추가하면 좋은 확장 플러그인) 다시 VScode를 배워보기로 했다. 예전에도 vscode를 책에서 배웠는데 멈췄다가 다시 시작한다. 이번에는 새로운 책으로.(그때 배웠던 책이 뭔지 모르겠다) 무료이기도 하고 현업에서도 가장 많이 사용하는 에디터라고 한다. 아직 현업에서 이쪽 일을 하는 사람을 만나본적이 없어서.. 다들 사용한다고 하니 좋은 이유가 있겠지? 아주 옛날에 editplus 라는 에디터 프로그램을 사용했었던 적이 있었는데 그때에 비하면 진짜 세련되고 좋아졌다. 설치하면 좋은 확장 플러그인 5가지 추천 책에서 알려준 추천 플러그인 5가지 태그를 자동으로 닫아주는 플러그인 '설치'버튼을 누르기만 하면 끝. (워드프레스 플러그인처럼 설치가 쉽다.) 태그를 입력할때 자동완성 기능을 제공하는 기능이라고 하는데 더이상 제공하지 않는다고.. 2023. 8. 9.
divi 테마 열 사이즈를 각각 다르게 설정하는 방법 divi theme 에서 레이아웃을 다르게 셋팅하는 방법 워드프레스 divi테마에서 레이아웃을 만들면 아래와 같은 기본 레이아웃을 만들고 거기서 행을 추가하거나 삭제하는 방식으로 시작되는데 거의 대부분이 정확한 사이즈로 나눠져있다. 예를 들면 아래쪽에 파란색으로 되어 있는 4개의 열은 사이즈가 모두 동일하다. 전체폭이 100%라면 각각 25%씩의 공간을 차지하고 있다. 그런데 가끔은 이런 동일한 사이즈가 아닌 10%, 50%, 20%, 30% 이렇게 각각 다른 사이즈를 만들어줘야 할 경우도 생긴다. 하지만 divi 빌더에서는 그걸 지원해주지 않는다. 이건 divi에서 제공하는 플러그인을 또 추가로 구매해야 한다! 기본값으로 되어 있는 설정을 바꿔준다. 위에 파란색으로 되어있는 부분 그대로 사용하게 되면 .. 2023. 8. 7.
divi theme 로 동영상 슬라이드 만드는 방법 divi theme 동영상 슬라이드 설정하는 방법 divi 테마에서 동영상을 여러개 삽입하여 슬라이드 형식으로 동영상을 표시할 수 있다. 동영상파일의 경우 WebM, MP4 2가지 형식을 다 올리는게 좋다고 한다. 동영상을 업로드하는 경우 WebM 및 MP4 형식을 모두 업로드하는 것이 좋습니다. WebM 파일은 파일 크기가 더 작고(서버 공간 절약) 압축률이 더 높지만 일부 브라우저와 장치는 WebM을 지원하지 않으므로 MP4 파일을 업로드하면 비디오가 모든 브라우저와 장치에서 재생됩니다. 위와 같이 동영상을 여러개 나오게 할 수 있다. 영상파일을 직접 올리거나 youtube, vimeo 영상 주소를 링크로 넣을 수 있다. 이런것도 쉽게 만들 수 있다니! divi theme 동영상 모듈 삽입 방법 색션.. 2023. 8. 4.