How to Make A Website using Divi

안녕 얘들 아 오늘 우리는 당신이 당신의 웹 사이트 사이트를 만들 수있는 방법을 보게 될 것입니다

Divi를 사용하여 이제이 비디오를보고 나면 드래그 앤 드롭만으로 이런 웹 사이트를 만들 수 있습니다 그래서이 비디오가 끝날 때까지 지켜 보도록하십시오 그것을하는 방법을 배우기 위하여 그래서 나는 Websitelearnerscom의 Shyam입니다 Divi Theme를 사용하여 웹 사이트를 제작 해 봅시다

Divi를 사용하여 웹 사이트를 만들려면 우리는 세 부분을 할 것입니다 첫 번째 부분은 WordPress 웹 사이트를 시작하는 것입니다 Divi는 WordPress 테마이기 때문에 먼저 WordPress 웹 사이트를 시작해야합니다 Divi를 사용하려면 그래서 우리의 WordPress 사이트를 시작하려면 우리는 세 단계를 수행 할 것입니다 첫 번째 단계는 웹 사이트의 이름을 선택하는 것입니다

그래서 귀하의 웹 사이트 이름을 선택하려면 이 비디오 아래의 링크를 클릭하기 만하면됩니다 이 페이지로 이동합니다 원하는 이름을 입력하십시오 이 상자에 그래서 나는 webinventscom에 들어갈거야

가능 여부를 확인하십시오 보시다시피 이 이름을 사용할 수 있습니다 일단 당신이 당신의 이름을 얻으면 다음 단계로 이동할 수 있습니다 귀하의 호스팅 및 도메인을 얻는 것이 무엇입니까 이제 호스팅은 웹 사이트의 파일이있는 장소입니다 저장된 domain은 웹 사이트의 이름입니다 그래서 귀하의 호스팅 및이 도메인 이름을 얻으려면 이 페이지를 아래로 스크롤하면됩니다

클릭하고 호스팅 받기를 클릭하십시오 이제 sitegroundcom으로 연결됩니다 우리가 호스팅 및 도메인을 얻을 수있는 곳 이제 여기서 우리는 세 가지 다른 계획이 있음을 알 수 있습니다 이제 하나의 웹 사이트를 시작하려면 이 계획을 위해 갈 수 있습니다

여러 웹 사이트를 시작하려는 경우 이 계획을 선택할 수 있습니다 하나의 웹 사이트를 만들고 싶으므로 이걸 고를거야 여기를 클릭하십시오 이제 도메인 이름 선택을 요청할 것입니다 그래서 이전에 찾은 것과 같은 이름을 입력하십시오

그래서 나는 같은 이름으로 갈거야 계속 클릭하십시오 이제 귀하의 도메인 및 호스팅을 얻으십시오 이 세부 정보 만 입력하면됩니다 이제 여기서 우리는 호스팅과 도메인을 얻고 있음을 알 수 있습니다

일년 동안 이 결제를하면 귀하의 웹 사이트가 인터넷에 게시됩니다 다음 1 년 동안 그래서 그것을 얻으려면 결제 세부 정보를 입력 해주세요 지불을 클릭하십시오 이제 우리는 지불을 성공적으로 마쳤습니다 우리는 도메인과 호스팅을 가지고 있습니다

일단 도메인을 확보하고 호스팅하면 이제 웹 사이트를 시작하는 마지막 단계로 이동할 수 있습니다 어느 WordPress를 설치하는 것입니다 이제 WordPress는 우리가 구축하게 할 플랫폼입니다 우리의 divi 웹 사이트 그래서 WordPress를 설치하기 만하면됩니다 그런 다음 새 웹 사이트 시작을 선택하십시오 이제 WordPress를 선택하십시오

그런 다음 WordPress에 원하는 로깅 정보를 입력하십시오 그래서 나는 내 이메일을 입력 할거야 사용자 이름 및 암호 그런 다음 준수를 클릭하십시오 설정 완료를 클릭하십시오 이제 wordpree가 설치되었습니다 이것은 귀하의 웹 사이트가 현재 인터넷 상에 존재 함을 의미합니다

새 탭을 열어 확인해 보겠습니다 그리고 지금 우리가 우리의 웹 사이트 webinventcom에 가면 Enter 키를 누릅니다 우리는 새로운 웹 사이트를 볼 수 있습니다 우리가 선택한 이름에 따라서 일단 WordPress 사이트를 시작하면 이제이 자습서의 파트 2로 이동할 수 있습니다

WordPress에서 Divi 테마를 설정하는 방법은 무엇입니까? Divi 테마를 설정하면 제작을 시작할 수 있습니다 Divi를 사용하는 웹 사이트 Divi를 설정하려면 우리는 5 단계를 수행 할 것입니다 첫 번째 단계는 귀하의 wordpress 사이트에 로그인하는 것입니다 귀하의 사이트에 로그인하려면 당신이해야 할 일은 유형 / 로그인 귀하의 사이트 주소 이제 Enter 키를 누르면 웹 사이트의 로그인 페이지로 이동합니다 이제 로그인 세부 정보를 입력하십시오

당신은 WordPress에 대해 만들었습니다 로그인을 클릭하십시오 이제 WordPress 사이트에 성공적으로 로그인했습니다 이것은 WordPress 대시 보드입니다 이제 귀하의 웹 사이트를 관리 할 수있는 곳입니다 일단 로그인하면 이제 2 단계로 갈 수 있습니다

Divi를 얻는 것은 어느 것입니다 이제는 Divi 테마를 얻습니다 웹 사이트 구축을 시작할 수 있습니다 Divi 사용하기 Divi 테마를 얻으려면 현재 시청중인 동영상으로 이동하십시오 설명에서이 링크를 클릭하십시오 Divi 웹 사이트로 연결됩니다

Divi 테마를 얻을 수있는 곳 이제이 페이지에 도달하면 Divi에 대한 계획을 선택해야합니다 그래서 주요 차이점은 이 계획을 위해 가면 Divi에 대한 업데이트를 1 년간받습니다 이 계획을 위해 간다면 평생 업데이트를받을 수 있습니다 제비 그리고 당신은 그것을 다시 갱신 할 필요가 없습니다 따라서이 계획 중 하나를 선택할 수 있습니다

필요한 것 이걸 고를거야 그런 다음 가입을 클릭하십시오 계정을 만들려면 이 세부 사항을 끝내자 전체 등록을 클릭하십시오 결제 정보를 입력하십시오

지불을 클릭하십시오 괜찮아 이제 Divi 테마가 있습니다 그래서 당신은 divi 테마를 얻었습니다 이제 3 단계로 이동하십시오 Divi 테마를 다운로드하는 방법은 무엇입니까? 다운로드하려면 로그인을 클릭하기 만하면됩니다

이제 사용자 이름과 암호를 입력하십시오 Divi 용으로 생성되었습니다 로그인을 클릭하십시오 Divi를 다운로드하십시오 다운로드를 클릭하기 만하면됩니다

Divi 테마가 컴퓨터에 다운로드됩니다 Divi를 다운로드하면 이제 다음 단계로 넘어갈 수 있습니다 DivX를 귀하의 WordPress 사이트에 설치하는 방법은 무엇입니까? Divi 테마를 설치하려면 WordPress 대시 보드로 가자 그 다음에 간다 클릭 테마 귀하의 사이트에 Divi를 설치하십시오

새 테마 추가를 클릭하기 만하면됩니다 테마 업로드를 클릭하십시오 이제 파일 선택을 클릭하십시오 divi 테마를 선택하십시오 다운로드 한 항목 선택 될 것이다

설치를 클릭하십시오 Divi 테마를 설치하려면 그런 다음 활성화를 클릭하십시오 이제 WordPress 사이트에 Divi를 설치했습니다 Divi 테마를 설치하면 당신이 당신의 위치에 갈 경우 새로 고침을 클릭하십시오 이제 Divi 로고가 사이트에 표시됨을 알 수 있습니다

Divi가 설치되었음을 의미합니다 일단 divi 테마를 설치하면 이제 테마 설정의 마지막 단계로 이동할 수 있습니다 Divi 테마를 활성화하는 방법은 무엇입니까? Divi를 활성화 한 후에 만 모든 기능을 사용할 수 있습니다 Divi 테마를 활성화하려면 WordPress에 가자 Divi를 클릭하십시오

이제 업데이트로 이동하십시오 divi에 대해 선택한 사용자 이름을 입력하십시오 지금 우리가이 열쇠를 얻을 필요가있는 divi를 활성화하기 위해 Divi 웹 사이트에서 그래서 그것을 얻으려면 Divi 웹 사이트에 가자 내 계정으로 이동하십시오 그런 다음 API 키를 클릭하십시오

키를 복사하려면 여기를 클릭하십시오 그런 다음 저희 웹 사이트로 이동하십시오 여기에 붙여 넣으세요 이제 divi를 활성화하려면 저장을 클릭해야합니다 그것이 활성화 될 것이다

이제 WordPress에서 Divi 테마를 성공적으로 설정했습니다 이제이 자습서의 마지막 부분으로 넘어갈 수 있습니다 웹 사이트 구축을 시작하는 것입니다 그래서 우리 웹 사이트를 만들려면 우리는 네 단계를 수행 할 것입니다 첫 번째 단계는 홈페이지를 만드는 것입니다

그래서 홈페이지는 모두가 볼 수있는 페이지입니다 처음 웹 사이트를 방문했을 때 그래서 홈페이지를 만들려면 우리 사이트로 가자 그리고 지금 당신은 이것이 우리의 홈페이지임을 알 수 있습니다 어느 쪽이 비어 있습니까? 지금 홈페이지를 만들려면 새로운 곳으로 가자 페이지를 클릭하십시오

이제 여기에 우리 페이지의 이름을 입력해야합니다 나는이 페이지를 집으로 부를 것이다 이제 홈페이지 구축을 시작하십시오 Divi 빌더 사용을 클릭하십시오 이제 3 가지 옵션을 통해 페이지를 만들 수 있습니다

먼저이 옵션을 보게 될 것입니다 레이아웃을 사용하여 페이지를 만들 수있는 곳 그래서 레디 메이드 디자인 페이지를 작성하는 데 사용할 수있는 사이트 브라우저 레이아웃을 살펴 보겠습니다 보시다시피 여기에는 다양한 유형의 레이아웃이 있습니다 이제 네가 좋아한다고 말하자 이 디자인 그냥 클릭하십시오

여기에서 미리보기를 볼 수 있습니다 이제이 디자인을 페이지에 사용하려면 이 레이아웃 사용을 클릭하십시오 전체 디자인이 페이지에 추가됩니다 그래서 우리가 볼 수 있듯이 우리는 정확한 디자인을 우리 페이지에 넣었습니다 이제 일단이 디자인을 얻게되면 어떻게이 콘텐츠를 변경합니까? 이 텍스트를 변경하려고한다고 가정 해 봅시다

텍스트를 선택하기 만하면됩니다 자신의 텍스트를 입력하십시오 이제 같은 방법으로 원하는 텍스트를 변경할 수 있습니다 텍스트를 선택한 다음 변경하십시오 이제이 버튼의 텍스트를 변경하려면 그냥 두 번 클릭하십시오

그런 다음 여기에서 버튼 텍스트를 변경하십시오 따라서 텍스트가 변경된 것을 볼 수 있습니다 그래서 그것이 얼마나 쉬운가? 같은 방법으로이 페이지의 모든 내용을 변경할 수 있습니다 이제이 이미지를 변경하고 싶다면 그냥 두 번 클릭하십시오 여기에서 이미지를 선택하십시오

이제 컴퓨터에서 이미지를 끌어서 놓기 만하면됩니다 이미지가 바뀔 것입니다 그래서 그것이 얼마나 쉬운가? 이제 같은 방법으로이 페이지의 일부를 변경할 수 있습니다 모든 변경 사항을 완료하면 게시하려면 클릭하십시오 이제 exit를 클릭하면 사이트에 새 페이지가 있음을 알 수 있습니다

우리가 추가 한 모든 콘텐츠가 있습니다 원하는 페이지를 원하는만큼 만들 수 있습니다 같은 방법으로 이제 우리는 홈페이지를 만들었습니다 하지만 여기서 문제가 있습니다 지금 새 창을 열면 사이트의 홈페이지로 이동 우리는 여전히 기본 페이지가 있음을 알 수 있습니다

어느 쪽이 비어 있습니까? 우리가 만든 페이지 / home이라는 별개의 페이지에 나타납니다 이제 이와 같이 나타나지 않고 이 페이지를 어떻게 우리 홈페이지로 만드나요? 어느 쪽이 여기에요 다음은 페이지 설정 방법입니다 당신이 만든 귀하의 홈페이지로 그래서 우리의 홈페이지를 설정하려면 우리는 wordpress에 갈거야 대시 보드를 클릭하십시오 이제 설정으로 이동하십시오 클릭하여 읽기 이제 여기에 우리는이 옵션이 있다는 것을 알 수 있습니다

귀하의 홈페이지가 표시됩니다 이제 여기에 정적 페이지를 먼저 선택해야합니다 우리가 만든 페이지를 선택하십시오 홈페이지로 여기를 클릭하십시오 다음 집 선택 우리가 만든 페이지는 어느 것입니까? 이제 변경 사항 저장을 클릭하십시오

이제 우리가 만든 페이지를 성공적으로 설정했습니다 홈페이지로 이제 우리 홈페이지로 가면 새로 고침을 클릭하십시오 당신은 우리가 지금 홈페이지를 가지고 있음을 볼 수 있습니다 어느 쪽이 여기에요 그래서 이것은 당신이 만든 페이지를 어떻게 설정할 수 있는지입니다 귀하의 홈페이지로 이제 가져 오기를 통해 페이지를 만드는 방법을 알았습니다

레이아웃 하지만 레이아웃을 가져 오는 대신 처음부터 새 페이지를 만들고 싶습니다 그러면 빈 페이지에서 어떻게 시작하니? 그런 다음 페이지를 작성하십시오 아주 쉽다 다음은 새로운 페이지를 만드는 방법을 보여 드리겠습니다 기스로부터 그래서 처음부터 페이지를 만들려면 새로운 곳으로 가자

페이지를 클릭하십시오 이제 생성하려고한다고 가정 해 봅시다 연락처 페이지 연락처로 페이지 제목을 입력하기 만하면됩니다 이제 페이지 작성을 시작하십시오 그냥 divi 빌더 사용을 클릭하십시오

이제 레이아웃 대신 처음부터 빌드를 선택합시다 이제이 빈 페이지가 나타납니다 페이지를 만들 수있는 곳 이제이 페이지를 만들기 시작하십시오 파란색 더하기 아이콘을 클릭하기 만하면됩니다 이 세 가지 옵션을 얻을 수 있습니다

이제 이와 같은 섹션을 만들고 싶다면 페이지의 전체 가중치를 사용합니다 전체 너비 만 선택하십시오 추가 할 수있는 다양한 너비 유형의 항목을 가져옵니다 귀하의 페이지로 이제이 페이지의 헤더를 만들고 싶습니다 머리글로 전체를 클릭하겠습니다

그리고 당신은 섹션을 얻을거야 이제 우리가 전에했던 것처럼 텍스트를 변경하려면 그냥 선택하세요 그것을 바꾼다 다음 섹션을 추가하려면 더하기 아이콘을 클릭하기 만하면됩니다 이번에는 정기적으로 선택하십시오

우리는 전체 너비가 필요하지 않기 때문에 이제는 다양한 유형의 섹션을 찾을 수 있습니다 당신은 당신의 페이지에 추가 할 수 있습니다 그래서이 섹션을 원한다면 이 레이아웃을 선택할 수 있습니다 또는 이와 같은 섹션을 원할 경우 이걸 선택할 수 있습니다 그래서 이걸 고를거야

이 섹션이 생성됩니다 이제 더하기 아이콘을 클릭하면 다양한 유형의 항목을 볼 수 있습니다 당신은 당신의 페이지에 추가 할 수 있습니다 이제 페이지에 이미지를 추가한다고 가정 해 보겠습니다 이미지를 클릭하기 만하면됩니다

항목이 추가됩니다 이미지를 추가하려면 여기를 클릭하십시오 그런 다음 컴퓨터에서 이미지를 끌어서 놓으십시오 보시다시피 이미지가 추가되었습니다 이제 크기를 변경하려면 여기로 드래그하십시오

크기를 변경하려면 이제 같은 방식으로 이 영역에 컨텐츠를 추가 할 수 있습니다 더하기 아이콘을 클릭하기 만하면됩니다 추가 할 항목을 선택하십시오 연락 양식을 선택하겠습니다 여기를 클릭하십시오

추가 될 것입니다 따라서 페이지 작성을 완료하면 게시하려면 클릭하십시오 이제 새 페이지가 귀하의 사이트에 게시됩니다 이제 exit를 클릭하면 우리 사이트에 새로운 연락처 페이지가 추가되었음을 알 수 있습니다 이제 새 페이지를 만드는 방법을 알았습니다

기스로부터 원하는 페이지를 원하는만큼 만들 수 있습니다 같은 방법으로 다음으로 웹 사이트 구축의 세 번째 단계로 넘어가십시오 메뉴를 만드는 것은? 이제 알 수 있듯이 메뉴가 없습니다 메뉴를 만들려면 여기로 가자 테마 사용자 정의 프로그램을 클릭하십시오

그런 다음 메뉴를 클릭하십시오 새 메뉴를 만들려면 여기를 클릭하십시오 이제 우리 메뉴에 이름을 써야 해 그래서이 메뉴를 메인 메뉴로 부르겠다 다음으로 선택해야합니다

메뉴가 표시되어야하는 곳 이 지역에 나타나고 싶다면 기본 메뉴 만 사용하십시오 다음을 클릭하십시오 이제 메뉴에 항목을 추가 할 수있게되었습니다 항목을 추가하려면 여기를 클릭하십시오 여기에 우리가 만든 페이지를 볼 수 있습니다

이제 메뉴에 추가 할 페이지를 선택하십시오 이제 여기를 클릭하면 메뉴가 생성되었음을 알 수 있습니다 우리가 선택한 페이지로 일단 그렇게하면 게시하려면 클릭하십시오 모든 변경 사항이 저장됩니다 이제 여기를 클릭하면 메뉴가 생성되었음을 알 수 있습니다

이제 연락처를 클릭하면 연락처 페이지가 있음을 알 수 있습니다 그리고 우리가 집을 클릭하면 우리는 홈페이지를 가지고 있습니다 메뉴를 만들 수있는 방법입니다 한 번 메뉴를 만들었습니다 웹 사이트 구축의 마지막 단계로 가자

어떤 로고를 변경하는 것입니다 이제 여기에 Divi 로고가 기본으로 있음을 알 수 있습니다 이제 자신 만의 로고를 추가하십시오 그냥 여기 가라 대시 보드를 클릭하십시오 이제 divi를 클릭하십시오

여기에 로고 옵션이 표시됩니다 이제 로고를 추가하십시오 클릭 만하면됩니다 그런 다음 여기에 로고를 드래그 앤 드롭하십시오 추가됩니다

이제 변경 사항 저장을 클릭하면 그런 다음 저희 웹 사이트로 이동하십시오 리플렉션을 클릭하십시오 당신은 그것을 볼 수 있습니다 우리는 지금 우리의 로고를 가지고있다 따라서 웹 사이트의 로고를 변경하는 방법입니다

이제 메뉴를 어떻게 바꿀 수 있는지 알았습니다 및 귀하의 로고 다음은이 튜토리얼의 보너스 부분으로 넘어갑니다 우리는 당신이 당신의 페이지를 디자인 할 수있는 방법을 보게 될 것입니다 Divi 사용하기 그래서 우리는 당신이 다른 부분을 어떻게 바꿀 수 있는지 보게 될 것입니다 귀하의 페이지 이처럼 따라서 연락처 페이지의 디자인을 변경하려고한다고 가정 해 보겠습니다

연락처와 마찬가지로 이제이 페이지는 우리가 전에 만든 페이지입니다 이제이 페이지를 변경하십시오 활성화 된 비주얼 빌더를 클릭하기 만하면됩니다 이 편집 모드로 이동합니다 이제이 텍스트의 크기를 변경하려고한다고 가정 해 봅시다

설정을 클릭하기 만하면됩니다 그런 다음 디자인에 간다 이제 다른 장소를 볼 수 있습니다 디자인을 변경할 수있는 곳 이제 우리는 그 제목을 바꾸고 싶습니다 제목 텍스트로 가자

이제 텍스트 크기를 변경하려면 이 슬라이더를 드래그하면됩니다 텍스트 크기가 변경됩니다 이제 같은 방식으로 글꼴을 변경하려면 여기를 클릭하면됩니다 원하는 글꼴을 선택하십시오 일단 모든 변경 사항을 완료하면 여기를 클릭하십시오

변경 사항이 저장됩니다 이렇게하면 모든 항목의 디자인을 변경할 수 있습니다 내 페이지에 다음 것 여기에 공간을 추가한다고 가정 해 보겠습니다 당신이해야 할 일은 단지 여기에 갈뿐입니다 그리고 나서 공간을 추가하려면 이제는이 파트의 디자인을 어떻게 바꿀 수 있는지 알았습니다

하지만이 전체 디자인을 변경하려면 어떻게해야합니까? 섹션 따라서 섹션의 디자인을 변경하려면 여기 설정과 마찬가지로 섹션을 더욱 멋지게 보이게하려면 우리는 디자인에 갈 것입니다 이제 디바이더로 이동하십시오 스타일을 선택하십시오 원하는 디자인을 선택하십시오 이제 슬라이더를 드래그하면 우리는 그 디자인을 가지고 있음을 볼 수 있습니다

우리 섹션 따라서 섹션의 디자인을 변경하는 방법입니다 일단 모든 변경 사항을 완료하면 저장을 클릭하십시오 우리가 우리의 접촉 페이지에 가면 지금 새로 고침을 클릭하십시오 당신은 그것을 볼 수 있습니다 우리는 여기에 새로운 디자인을 가지고 있습니다

따라서 divi를 사용하여 페이지를 디자인 할 수 있습니다 이제 Divi를 사용하여 웹 사이트를 만드는 방법을 알았습니다 단 몇 분만에 Divi를 사용하여 웹 사이트를 만들려면 먼저 WordPress 사이트를 시작해야합니다 WordPress에서 Divi를 설정하십시오 마지막으로 웹 사이트를 구축하십시오

알았어 이제 자신 만의 웹 사이트를 만들 준비가되면 여기를 클릭하십시오 그리고 우리는 첫 번째 단계에서 본 페이지로 이동합니다 어떤 웹 사이트 이름을 선택하고 있습니까? 그래서 귀하의 웹 사이트 이름을 선택하고 귀하의 웹 사이트를 구축하십시오 따라서 웹 사이트를 구독하면 더 많은 것을 얻을 수 있습니다

이 같은 동영상 보고 주셔서 감사합니다 다음 비디오에서 뵙겠습니다 Be-bey

Divi The Ultimate WordPress Theme And Visual Page Builder

웹 사이트를 구축하는 것은 걸작 그림 같은 거지 걸작품을 칠하는 것과는 다르다

당신이 실제로 무엇을하는지 볼 수있는 무언가를 칠할 때를보십시오 그래서 작은 집을 그리면 저기에 작은 집이있어 하지만 WordPress에서 웹 사이트를 만들 때 백엔드에서 작업하고 있습니다 콘텐츠 작성을 위해 만들어진 인터페이스 디자인이 아니다 게다가 사이트에서 실제로 어떤 것이 보이는지 전혀 알 수 없습니다

그렇게 어려운 걸작을 창조하기가 어렵다 걸작? Puih Divi가 있습니다 Divi를 사용하면 WordPress 웹 사이트를 만들 수 있습니다 실제 웹 사이트에서 실시간으로 그래서 위젯이나 텍스트를 추가하고 싶다면 계속해서 추가하십시오 모든 것은 끌어서 놓기가 가능하며 완전히 사용자 지정할 수 있습니다

모양, 크기, 글꼴, 색상, 40 가지 이상의 서로 다른 콘텐츠 요소 추가 할 수없는 것이 없습니다 그래서 지금 웹 사이트를 구축하는 것은 걸작을 그리는 것과 같습니다 단 한 번만 더 쉽게 Divi, 아름다운 웹 사이트를 구축하는 가장 빠른 방법

Divi – Add CSS to individual menu items in the Divi Theme

안녕 얘들 아이게 제이미에서 http://wwwsystem22

net 및 http://wwwgreat-webdesigncom/ 오신 것을 환영합니다 우리는 Divi 사용자 정의 비디오 모음집에서 계속됩니다 이 비디오는 우리의 톱 메뉴를 꾸미기 위해 여기에 있습니다 우리가 그것 위에 마우스를 가져갈 때 조금 더 흥미롭고 또한 우리는 하나를 줄 것입니다

우리 메뉴 항목의 CSS가 조금씩 다르기 때문에 나머지 부분과 크게 다르지 않습니다 내가하고 싶은 첫 번째 일은 내가 떠올랐다면 이것들 아래에 약간의 아래쪽 테두리를 두는 것입니다 그 (것)들에 그리고 그것을하기 위하여 나는 나가 원한 색깔을 찾아 내고 싶다 나는 가고있다 이 파란색 테마 색상을 계속 사용하려면 여기를 사용하여 color 나는 그 색깔의 무엇인가를 오른쪽 클릭하기 만하면된다 검사 버튼과 볼 수 있듯이 여기에 우리 색이 있습니다 방금 클릭하고 복사하면 멋지다

이제 클릭하기 만하면된다 이 메뉴 항목 중 하나는 여기에 상관 없어요 마우스 오른쪽 버튼을 클릭하고 다시 검사에 들어가십시오 여기에 우리가 있습니다 우리가 실제로 그것을 강조 표시 강조 표시 앵커 태그 다 나머지는 저기 거기에 트레스 내가 실제로 목록 항목 클래스에 그냥 나를 사기 위해되고 싶다

저기서 내 하숙인을 내려 놓고 싶기 때문에 내가 갈거야 앞을 클릭하고 클릭 횟수를 줄이십시오 여기에 내가 할 일은 두 픽셀의 테두리 아래쪽에 줄 것입니다 그 푸른 색으로 나는 그것을 고체의 2 개의 픽셀로하고, 그 차에 붙여 넣을 예정이다 우리가 지금 물고기를 두려워한다는 것은 굉장합니다 그러나 당신이 아무것도 모른다면 그냥 Google을 사용하고 당신이 찾고있는 것이 무엇이든지 넣으십시오

그냥 CSS를 넣을 수 있고 모든 종류의 것들이 여기에 올 것입니다 w3schools는 또한 실제로 할 수있는 게임을 할 수 있기 때문에 가능합니다 그것의 예 찾고있는 것이 무엇이든 거기에 해결책이있을 것입니다 모든 것이 잘 나는 둥근 구석 사이에 둥근 모서리를 만드는 법을 원합니다 코너 CSS 등 괜찮아 다시 우리 사이트에 당신이 볼 수있는대로 넣어 border-bottom : 거기에 그 색을 가진 단단한 이쑤시개가 있고 그것은 여기에 나타났습니다

좋아,하지만 우리는 항상 그걸 원하고 싶지 않아 우리가 그 (것)들에 공중 선회 할 때 나는 나의 로고의 밑에 그것을 원하지 않는다 여기 melargo는 보조 메뉴에 로고를 추가 한 또 다른 메뉴 항목입니다 여기에 그 문제를 먼저 다루겠습니다 내가하고 싶은 일은이 CSS를 여기 복사하여 복사합니다 내 왼쪽 마우스 버튼과 컨트롤 C 또는 마우스 오른쪽 버튼으로 클릭하고 복사 할 수 있습니다

그렇게하면 대시 보드로 돌아가서 Divi로갑니다 한 세트가 열리는 버튼 테마 옵션 아래에서 아래로 스크롤해야합니다 사용자 정의 CSS 상자를 조금만 확장하면 새로운 것을 넣을 수 있습니다 평소대로하는 것처럼 제목을 주려고합니다 우리가 원할 경우 찾을 수 있습니다

다른 시간에 편집해라 / var 별을 선택하고 중간에 4 개의 슬래시를 다시 넣고 제목을 넣으십시오 당신이 원하는 건 내가 전화 할게 내가 분명히 당신이 그것을 전화 메뉴 장식 전화 할께 너가 지금 그것을 찾을 수있는 한 너는 네가 원하는대로 뭐든지 붙여 넣을거야 우리가 가지고있는 약간의 코드 필요하지 않습니다

이미 거기에 있기 때문에 우리는 그것을 조정해야 할 수도 있습니다 나중에 우리가 우리가 꾸미고 나면 알게 될거야 우리가 거기에 넣을거야 우리는 빠른 저장을 할 것입니다 변경 사항을 저장하고 우리의 사이트로 돌아 가자 이것이 거기에 머물러 있는지 보아라

그래도 거기에있는 것을 보아라 그러나 내가 말했던 것처럼 지금 당장 우리 경감을 닫을거야 여기 항상 원하지 않는다 확실히 그 로고에 그것을 원하지 않습니다

그래서 우리가 우리가 다시 넣은 커스텀 CSS로 되돌아 간다 우리가해야 할 일을 마지막으로 작성한 사용자 정의 CSS는 지금 리에서 나는 결장을위한 공간을 두지 말고 다시는하지 않는 것이 중요합니다 공간을두고 바로 마우스를 가져 가면 지금처럼 빠르게 움직일 것입니다 저장하고 우리의 사이트로 돌아가서 빨리 새로 고침하고 그 라이닝을 볼 수 있습니다 내가 마우스를 가져갈 때 우리 메뉴 엔트리 밑으로 갔다

작은 선이 거기에 와야합니다 우리는 단지 작은 호버 효과가 있습니다 우리 메뉴 항목에 거기에 추가 된 괜찮아 그래서 우리는 가자 조금 더 멀리하고 싶습니다 나머지는 아마 그것 주위에 상자를 넣을 수도 있습니다

검색 버튼이 있습니다 좋아요 이렇게 강조 표시하고 검사하십시오 이번에는 href 태그에 태그를 붙이자 이 곳에서 내 맞춤 설정을 입력하고 싶습니다

여기에서 요소 스타일로 잠시 후에 수업을해야합니다 그게 걱정스러운 배경이야 그리고 만약 당신이 배경색을 변경하는 방법을 모르겠다면 그냥 구글 그곳에는 모든 종류의 결과가있을 것입니다 우리는 먼저 우리 색을 그려 내려고합니다 1 대 7-3 비키니가 되라

그래야 차가 끝난다 당신이 텍스트를 볼 수없는 이유는 배경색이 분명하기 때문입니다 그것은 같은 색깔이고 텍스트를 만들고 거기에 색깔을 넣으면됩니다 흰색으로 SSS 해시 태그를 지정하고 이전에 내 동영상을 본 사람은 당신은 흰색이 실제로 성공하다는 것을 압니다 3을 넣어야 만합니다

ffffff는 실제 색상이므로 볼 수 있습니다 우리의 텍스트를 우리가 원하는 방식대로 돋보이게 만들었습니다 거기에 색이 있지만 그것이 끔찍한 것 같아요 저것의 할 것이다 약간 패딩을 추가하고 우리는 각 측을 할 것이다 자체적으로 여기에 두 개의 속성을 넣을 것이므로 패딩 상단이 있습니다 그리고 우리가 그것을 들으니까 첫 번째 될 것입니다 하단 10 추천 및 당신은 위로 뛰었지만 단어의 맨 위에서 아래까지의 공간을 볼 수 있습니다

단어의 왼쪽과 오른쪽은 15 픽을 줄 것입니다 그것에게 15 픽셀을주는 것은 내가 원하는 것을 조금 형성하는 것입니다 이 단추를 여기처럼 좀 더 보이게하려면 그리고 거기에이 멋진 둥근 모서리가 있고 그것은 경계 반경입니다 CSS 그래서 국경 반경 및 아마 4 개 5 개 6 개의 화소 가자 그게 바로 5 픽셀 정도 줄께 네, 그래, 거기 가자

그 일을 끝내서 마침내 내가하고 싶은 일은이 모든 것을 복사하고 싶다 여기 CSS는 내가하고 싶지 않은 것은 우리가 원하는 요소 타일을 복사하는 것이다 우리가 만든 실제 CSS 저는 빠른 노트 패드를 가져올 것입니다 이 파일을 왼쪽 마우스 버튼으로 드래그하여 드래그하면됩니다 컨트롤 C 또는 마우스 오른쪽 버튼으로 클릭하고 복사 할 수 있지만 그렇게하고 싶습니다

노트 패드에 붙여 넣기 만하면됩니다 잠깐만이 버튼을이 공간에 추가하려면 약간의 공간이 필요하다 우리가 던지는 목록 항목 클래스를 조금만 올라가 보면 우리가있는 곳입니다 각 메뉴 항목에 따라 고유 식별자가 있으며 메뉴가 있습니다 우리가 원하는 바로 그 항목 450입니다

바로 마우스 오른쪽 버튼으로 클릭하고 편집하면 HTML입니다 그냥 우리가 원하는 메뉴 항목을 모두 450 비트 복사하려는 경우 그냥 입력 그걸 복사해서 메모장에 붙여 넣으면 여기에 붙여 넣을거야 CSS 편집기 클래스를 사용하여 호출 할 때 약간의 마침표가 있습니다 그것을 앞두고 둥근 괄호를 열고 CSS를 마친 후에 기간을 넣어야합니다 여기에 곱슬 브래킷을 닫으려고하는데, 조금 더 크게 넣으면됩니다

그곳에있는 나머지 사람들과 일치하는 사람들은이 공간을 없애 버릴 필요가 없습니다 CSS를 깔끔하게 유지하고 우리는 우리의 wordpress 대시 보드로 되돌아 갈 것이고 여기에 사용자 정의 CSS로 갈 것입니다 우리가 필요로하는 것을 가지고 있다면, 이것을 아래로 내려 놓으십시오 우리가 작업 중이므로 순수하게 거기에 A를 추가하고 싶습니까? 그 앵커 태그 우리가 돌아가서 마우스를 가져 가면 앵커 태그에서 작업하고 있습니다 그것의 목록 ​​항목 다음에 또는 메뉴 항목을 누른 다음 다시 거기로 가자

빠른 답변과 우리 사이트에 대한 경의와 새로 고침 잘하면 그것은 우리가 텍스트를 잘 잃어버린 것과 거의 동일합니다 우리가 잃어 버리지 않은 텍스트 H는 잘못된 색상입니다 다시 돌아 가면 그 색상에 중요한 속성을 추가합니다 흰색으로 바뀌도록 강요해야합니다 때때로 당신은 우리의 변화를 저장하고 되돌아 가야합니다

우리는 그것을 다시 가지고 있습니다 그것은 거의 우리가 원하는 방식을 거의 바라보고 있습니다 내가 그것의 종류에 반대하고 싶은 호버에 다른 무엇인가하게하기 위해 사용자 정의 CSS 사본으로 돌아 가면 전체 섹션이 우리는 방금 그곳에 그리고 그 후에 히트를했습니다 결장에서 오른쪽으로 마우스를 가져 가면 h0v ER을 할 수 있습니다 그 배경색을 내가 흰색으로 바꾸고 싶다

나는 실제로 가고있다 두 번째 Ctrl 키를 사용하여 복사하므로 C로 바꿀 것입니다 해시 태그 FFF (흰색) 변경하려는 텍스트 색상의 색상 그 색깔에 나는 방금 복사했는데 다른 모든 것은 파란색이다 이 오를 세우십시오 테두리 나 두 개의 픽셀을 채울 테두리를주고 싶습니다

평소처럼 멋진 파란색과 세미콜론을 붙일 수 있습니다 그곳에 틈새를 두어 나는 단지 우리 사이트로 돌아갈 것이다 지금 내가 한 주간 새로 고침을하면 그걸 반전해야한다 우리는 멋진 푸른 색 테두리를 갖게 될 것입니다 텍스트는 파란색이지만 배경은 백인이어야합니다

우리가 가보고 싶은 것은 꽤 많이 있습니다 XD 그렇다면 내가 원하지 않는 것은 내가 우리가 가진 모든 것에 그것을 원하지 않는다는 것이다 거기에 밑바닥 국경이 있는데 그 중 하나는 두 개이고 나는 그걸 없애고 싶지 않아 그 뼈를 없애기 위해 약간의 고급 CSS를 사용해야합니다 저기에있는 것과 기억에서 나는 우리가 그것을 제거해야한다고 생각합니다

이 로고는 확실히 여기에 있습니다 그래서 저는 그들이 마지막 아이라고 부르는 것을 사용해야합니다 여기에서 당신을 제거하기 위해 여기에 속성이 있습니다 우리는 상대 할 것입니다 이 모든 목록 항목에 대한 목록 항목이 있으므로 목록을 클릭하면됩니다

여기에 ID가 있어야 겠어 2 차 미니 목록 항목을 복사하면됩니다 다시 우리의 사용자 정의 CSS로 그것은 단지 몇 가지 드롭 다운 그곳에 지금 내가하고 싶은 것은 콜론을 넣지 말고 복사하는 것에 대해 걱정하지 마십시오이 CSS를 다운로드하고 사용하고 있습니다 여기에 자유롭게 사용할 수 있지만 비디오 아래에 링크를 놓을 것입니다

귀하의 필요에 맞게 그것을 사용자 정의하고 나는 그 아이와 내가 마지막으로 시간을 씁니다 그것이 우리가 정말로 원하고 싶어지는 공중 위에 있기 때문에 거기에 끼어들 것입니다 그것의 제거는 중괄호를 닫고 중괄호를 닫고 두 개의 중괄호를 내려 놓는다 우리가 원하는 것을 두 사람의 중간에 나는 경계선을 말하고 싶다 그러면 우리는 다음을해야 할 것이다

이 특정 요소에 마우스를 올려 놓으면 경계선 아래 진료소를 표시하고 거기에 두 개의 새로운 공간을 깔끔하게 정리하고 저장을 클릭하십시오 다시 사이트에 새로 고침을하고 잘하면 지금 내가 그것을 가져갈 때 우리는 여기에 모두 공을 가지고있어 지금 바라건대 우리는이 마지막 단추에 그것을 아직 갖지 못했지만 아직 사라졌습니다 큰 이제 우리는 로고에서 동일한 일을하고 싶습니다 첫 번째 자식 마지막 자식 첫 번째 자식 관심있는 사람들은 첫 번째 자녀 TSS 또는 큰 자녀를 찾아 볼 수 있습니다

자선 자산과 또 하나의 훌륭한 CSS는 n 번째 CSS이며 환상적입니다 목록 항목을 선택하고 하나 또는 두 개의 목록 항목에서 작업하는 것만으로 우리가 저기에 넣은 것을 복사해서 할 일에 붙여 넣으면됩니다 변경 또는 마지막으로 변경 처음으로 빠른 저장 다시 우리의 사이트에 여기에 빠른 새로 고침 이제 우린 그 위에 마우스를 가져 가면 밑줄 친 로고가 사라질 것입니다 그래, 나머지는 여전히 거기에 갔다 우리가 패딩 (padding)을 추가했기 때문에 조금 조심스럽게 모든 것을 멋지게 만듭니다

이 항목은 여기에 약간 떨어 뜨려서 우리는 그걸 뒤로 밀고 싶습니다 우리가 좀 더 성장할 때가 조금 있습니다 조금 더 그것은 WordPress가 여기에 그렇게 말하는 중간에 확실히 아니에요 우선 먼저 이걸 조금 뒤로 잡아 당겨 보자 우리가 아마도 아마 목록 항목 클래스 일 것입니다

그래서 우리가 가리키면 그 놈들 중 하나가 거기에있어 거기에 녹색 비트가 보이네 패딩 여기 수피 시인들이 공황 상태에 빠졌습니다 당신의 레몬은 그것을 만들겠습니다 25 중간에 복사하면됩니다 복사하여 스타일 시트하지만 나는 그 순간에 나는 속성을 가지고 있다고 확신한다

변경해야 사용자 정의 스타일 시트로 이동하여 지금 찾을 수 있는지 확인하십시오 여기 어딘가에있을거야 거기에 바로 거기 그래서 만약 내가 선택하면 내가 할 필요가있는 모든 것을 25로 바꾸는 것이다 당신이 이미 거기에 넣지 않았다면 사진을 복사하고 붙여 넣기 만하면됩니다 우리가 해왔 던 것처럼 당신의 검사관이 우리의 사이트 빠른 리프레시 네, 우리가하고 싶은 곳에서 머물러있어 좋습니다

그냥 우리가이리스트 아이템 중 하나를 검사하면 그것을 채울 수 있음을 알 수 있습니다 아래쪽에서이 패널이 몇 년 동안 패딩을했는지 보도록하겠습니다 거기의 바닥에 괜찮아요 우리가해야 할 일은 이제 가장 큰 공포를 조정하는 것뿐입니다 거기에 당황병이있어

우리가 그걸 꺼내면 조금 더 보인다 일관성있는 일종의 엉망진창 우리가 할 일은 이 부분의 왼쪽 상단에 조금 더 추가 할 것입니다 그래서이 하나를 선택하고 그곳을 살펴 보겠습니다 바로 여기에 우리가 있습니다

여기 아래로 채우고 우리가 가진 것은 두 가지 속성을 가지고 있습니다 위쪽과 아래쪽, 왼쪽과 오른쪽으로 2 개 더 추가하면 최상위로 갈 것입니다 오른쪽과 다음 두 개가 아래쪽과 왼쪽에 표시되므로 복사 해 보겠습니다 붙여 넣기 할 때 Ctrl 키를 누른 상태에서 붙여 넣습니다 좋아, 그래서 우리는 지금 그것을 바꿀 수 있기를 바랐다

두 가지 더 옙에게 더 많이 제공하자 마치 조금 더 거기에서하는 것처럼 우리는 오른쪽 상단을 보자 또 다른 두 사람도 줘 우리는 17 명이지 12 명

우리가 간다 중앙에 가거나 더 가고 싶다면 더 나아가고 싶다면 전적으로 당신에게 달려 있습니다 우리가 그것을 가져 가거나 우리의 모든 것들 때문에 비트를 바꿀 때 작동하는 것처럼 보입니다 약간 다르다 좋습니다

글쎄, 조금 더 나아진 것 같아요 우리는 이전에했던 커스텀 CSS의 패딩에 붙여 넣을 것이다 그래서 여기에 메뉴 항목이 있습니다 여기에 패딩이 있습니다 바로 여기에 두 배가되는 캐롤라인을 제거하고 우리도 우리가 그것을 추가했기 때문에 호버에 호버 효과를주고 싶다

국경 우리는 몇 픽셀 걸릴 수 있습니다 우리가보고 제거 할거야 거기에 강아지 머리를 클릭하십시오 저장 신선한 네 예, 그렇습니다 나는 그 효과를 아주 좋아한다는 것을 의미합니다 양쪽에 2 개 2 개 2 개가 있습니다 바닥에 영향을 미치지 않을 수 있습니다 다른 하나에 의해 덮어 쓰여지므로 어쨌든 그냥 해봅시다

그냥 분명히 보여주기 위해 그것을 사용자 정의하지만 당신은 그것을 가지고 놀고 싶습니다 다양한 색상을 사용하여 모든 종류의 효과를 낼 수있는 몇 가지 효과를 찾습니다 내가 한 일을 마음에 들지 않으면 실험 해보는 것이 좋습니다 그것을 선택하고 그것을 삭제하면 그것은 이전의 상태로 되돌아 가서 그렇게하지 않을 것입니다 당신의 주제를 깨뜨리는 것에 대해 걱정해야합니다

말하자면 이걸 끝내자 빨리 새로 고침하면 조금 더 좋아진다 여전히 바닥 패딩을 조정해야 할 필요가 있지만 괜찮습니다 어쨌든 Divi 테마에서 메뉴 항목을 사용자 정의하는 방법과 이것은 실제로 부트 스트랩에서의 작업과 당신이 원하는 WordPress 테마 그래서 우리는 그 뚜껑을 그 밑줄 없애 버렸어 우리는이 버튼을 만든 모든 호버에 아래쪽 테두리를 추가했습니다

조금 더 돋보이면 도움이된다 나는 한 번 유용했으면 좋겠다 다시 말하지만 시스템 22와 멋진 웹 디자인 담당자의 제임스입니다 누군가가 그것을 사용하고 싶다면 아래에 링크 된 PDF 파일에 커스텀 CSS를 넣으십시오 지켜봐 주셔서 감사합니다

좋은 하루 되세요

Make Columns in WordPress – No Code Needed! Divi Page Builder

(낙관적 인 음악) (낙관적 인 음악) (낙관적 인 음악) (낙관적 인 음악) (낙관적 인 음악) (낙관적 인 음악) – 이봐, 애쉬톤 고리 야 그리고 그것은 또 다른 WordPress 수요일이다

모두들 제게 부탁 했어요 'WordPress 웹 사이트에서 멋진 열을 어떻게 얻을 수 있습니까?' 그래서, 당신은 정말로 원하지 않습니다 정말로 지루한 WordPress 웹 사이트가 있습니다 당신은 어떻게 진짜로 차가운 나란히 서있는 내용을 얻는가? 동적인지 다르게 보이게 만드시겠습니까? 내 채널을 본다면 많은 사람들이 알 수 있습니다 나는이 WordPress 웹 사이트를 Divi 테마에 구축했다

아래의 설명 상자에 링크를 넣을 것입니다 그래서 당신은 그것을 확인할 수 있습니다 그러나 Divi Page Builder에는 능력이 있습니다 꺼내어 완전히 분리해야합니다 그리고 이것을 사용하여 정말 멋진 레이아웃을 만들려면, 그리고 내가 너에게 보여줄거야

Divi Page Builder를 사용하여 기둥을 만드는 방법 이 무료 자습서는 Liquid Web에서 제공합니다 그들은 WordPress Managed Hosting에서 절대적으로 최고입니다 지원과 지금 당장, 처음 3 개월 동안 추가로 33 % 할인을받을 수 있습니다 그래서 이것은 WordPress 편집기가 기본적으로 보이는 것입니다

이제 구텐베르크 (Gutenberg)와의 관계가 조금씩 바뀌고 있습니다 하지만 이것은 고전적인 편집자입니다 여기에 비주얼 모드가 있습니다 또는 텍스트 모드 그리고 그것은 실제로 얻을 수있는만큼 화려합니다 미디어 추가를 클릭하여 미디어를 추가 할 수 있습니다 추가하고 싶은 사진을 찾습니다

그리고 오른쪽 정렬 또는 왼쪽 정렬 할 수 있습니다 하지만 당신은 매우 환상적입니다 추가하거나 추가하려고 할 때마다 우리가 나란히 서서 갖고 싶은 것 어쩌면 3 개의 기둥 그것은 매우 까다 롭습니다 이것이 실제로 어떻게 만들어 내는지입니다

멋진 페이지 빌더 사용 다음 버튼을 클릭합니다 페이지 빌더를 사용하십시오 이 모드에있을 수 있습니다 하지만 나는 내 WordPress 웹 사이트의 앞쪽으로 가고 싶다

프런트 엔드에서 작업하고 내 콘텐츠 주변의 전체 테마를 볼 수 있습니다 방문자가 실제로 무엇을 경험했는지 프런트 엔드에서 볼 수 있습니다 이제 Divi를 사용하면 미리 만들어진 레이아웃에 액세스 할 수 있습니다 그리고 그것은 그것을 매우 쉽게 만든다 그러나이 튜토리얼을 위해, 나는 이걸 얼마나 믿을만한 지 보여주고 싶다

기존 콘텐츠로도 그래서 저는 Start Building을 클릭 할 것입니다 이제 너는 내가 물건 위로 맴돌 때 볼 수있다 우리는 내가 할 수있는 다른 섹션을 가지고 있습니다 하지만 내가 내 웹 사이트의 앞쪽에 있다는 것을 알아 차려라

페이지를 땜질하다 보면 방문객이 여기 올 때마다 어떻게 보이는지 나는 이것을 나란히 나란히 놓기를 원합니다 그럼, 잠깐 여기에 갈거야 이 사진을 클릭하면됩니다 삭제를 클릭합니다

왜냐하면 나는 더 이상 그것을 원하지 않기 때문입니다 그리고이 섹션을 여기에두고 싶습니다 실제로는 두 개의 열이됩니다 그래서 강조 할께 내가 원하는 열 구조를 선택하십시오

나는 두 개의 기둥이 필요하다 이제 내 텍스트를 왼쪽에 넣어 라 오른쪽에 빈칸을 남겼어요 내가 원하면 내 사진을 넣을 수 있습니다 그러나 정말로, 나는이 오른쪽에 내 텍스트를 원한다

그리고 왼쪽에있는 내 사진 당신은 내가 그것을 매우 쉽게하고, 드래그 앤 드롭하는 것을 볼 수 있습니다 새 모듈 추가를 클릭합니다 나는 이미지를 추가 할 것을 요청할 것이다 그들에게는 나를위한 이미지 모듈이 있습니다

매우 편리합니다 나는 그것을 클릭하고 같은 이미지를 선택할 것이다 저기서 내가 원했던 건 그냥 갈거야 그것을 중앙에 정렬하십시오 그리고 Enter를 클릭하십시오

그리고 바로 거기에서 아름답게 보입니다 내 콘텐츠를 나란히 놓았습니다 내가 이것을 축소 할 때, 그것은 휴대 전화에 완벽하게 쌓아 두었습니다 추가 열을 추가하려는 경우 우리는 여기에 세 개의 기둥을 갈 수 있습니다 얼마나 멋진가! 그리고 실제로 멋진 신문 스타일 레이아웃으로 가져 가세요

또는 멋진 블로그 레이아웃 단지 페이지를 만들 수 있습니다 훨씬 더 재미있어 보이다 몇 번의 클릭만으로 코드도 필요 없습니다 그래서 나는 코드가 필요없는 코드가 있다고 확신한다

우리 대부분이 정신적으로 불고있다 프레임 워크를 사용하는 방법을 알아 내야했습니다 구텐베르크를 사용하는 방법 모든 것을 올바르게 쌓아 두십시오 그리고 그것은 단지 이상하게됩니다 거기에 페이지 빌더가 있습니다

그건 너무 복잡해서 아주 복잡해 당신은 그렇게 할 필요가 없습니다 Divi Builder는 매우 쉽게 할 수 있으며, 칼럼을 쉽게 쌓을 수 있으며, 쉬운 행 만들기 및 페이지 아래로 계속하기 정말 역동적이고 재미있게 보이게합니다 귀하의 고객 또는 방문자에게 그들이 당신의 위치에 올 때 Divi Builder 구입에 관심이 있다면, 나는 아래에 링크를 넣을거야

항상 무료로 테스트 할 수 있습니다 그것을 시도하고 어떻게 느끼는지보십시오 그 링크를 아래의 설명 상자에 넣을 것입니다 좋아요, 수요일 좋은 WordPress를 가졌 으면합니다 내 채널을 구독해야합니다

매주 수요일에 이처럼 콘텐츠를 만들려고하기 때문에 당신이 WordPress에 흥분하도록 돕기 위해 귀하의 워드 프레스 웹 사이트를 흔들어 버릴 수 있습니다 온라인에서 또는 귀하 지역의 WordCamp에서 당신을 만나기를 바랍니다 다음에 보자 안녕

Block Editor [Gutenberg] VS Elementor VS Divi: Quick Comparison ⚡

안녕하세요 제 이름은 로버트입니다

이 동영상에서는 내가 가질 수있는 몇 가지 질문에 답변 해 드리겠습니다 블록 편집기 (일명 구텐베르크)와 엘리멘탈 대 디비 빌더 도구가 어떻게 비교되고 어느 것이 당신에게 옳은가? 전체 비교가 나오므로 계속 지켜보십시오 새로운 Gutenberg 블록 편집자가 더 많은 시각적 디자인과 드래그 앤 드롭 기능을 제공하지만 편집, 그것은 꽤 아직 페이지 빌더 플러그인을 대체하지 않습니다 이는 많은 사용자가 추가 도구를 사용해도 여전히 이점을 누릴 수 있음을 의미합니다

일반적으로 Gutenberg 블록 편집기는 기본 콘텐트와 레이아웃을 대체 할 수있는 좋은 대안입니다 그러나 원하는 경우 Elementor 또는 Divi Builder와 같은 페이지 작성기로 더 행복해집니다 디자인에 대한 스타일 및 간격 조절을 정확하게 나타낼 수 있습니다 실제로 Otter Blocks라는 매우 훌륭한 도구가 있습니다 블록 편집기를 사용할 때 페이지 및 게시물을보다 쉽게 ​​만들 수 있으며 템플릿을 사용하는 경우 예를 들어 라이브러리에서 미리 정의 된 섹션을 사용하여 멋진 방문 페이지를 만들 수 있습니다

블록 쿨, 맞지? 이 플러그인은 콘텐츠 제작에 사용할 수있는 다양한 요소와 템플릿을 제공합니다 무료 버전을 사용하면 드래그 앤 드롭 시스템을 사용하여 페이지와 게시물을 디자인 할 수 있습니다 예를 들어 Neve WordPress 테마와 원래 데모 컨텐츠를 사용하는 경우 Neve 옵션 패널에서 한 번 클릭으로 가져 오기 기능을 사용하면 쉽게 컨텐츠를 사용자 정의 할 수 있습니다 앞 페이지에 섹션별로 섹션이 있습니다 이것은 모든 WordPress 테마에 사용할 수있는 비주얼 한 드래그 앤 드롭 페이지 빌더입니다

여기에서는 커스터마이징과 함께 많은 요소 라이브러리에 액세스 할 수 있습니다 옵션 및 거의 모든 레이아웃을 만들 수있는 기능을 제공합니다 이제 각 도구와 함께 제공되는 기능을 비교해 보겠습니다 구텐베르크 차단 편집기에서 할 수있는 일은 다음과 같습니다 끌어서 놓기 편집기를 사용하여 페이지, 게시물 및 사용자 지정 콘텐츠 형식을 만들 수 있습니다

텍스트 및 이미지와 같은 필수 요소를 포함하여 콘텐츠를 만들려면 25 개 이상의 블록을 사용하십시오 테이블과 버튼과 같은 좀 더 고급 옵션입니다 더 많은 옵션이있는 블록을 원한다면 오터 블록 플러그인을 설치하고 고급 제목 블록, 버튼 그룹 블록, 글꼴 멋진 아이콘, 가격 책정 블록, 공유 아이콘 및 훨씬 더 위의 추천 동영상이나 아래의 설명 상자를보고 어떻게 할 수 있는지 알아보십시오 이 블록을 사용하여 WordPress 웹 사이트에서 멋진 콘텐츠를 만들 수 있습니다

또한 블록 편집기를 사용하여 각 블록에 대해 몇 가지 옵션을 사용자 정의 할 수 있습니다 문서 전체 설정과 마찬가지로 Neve WordPress 테마를 사용하면 설정을 변경하는 옵션이 더 많이 생기고 예를 들어 사이드 바를 제거 할 수 있습니다 새 항목을 처음부터 새로 만들려는 경우 유용 할 수 있습니다 그러나 표시 할 내용 원하는대로 블록을 다시 정렬하고 원하는만큼 추가하거나 삭제하십시오

아주 기본적인 다중 열 레이아웃을 만들 수도 있습니다 오터 블럭스 플러그인으로 더욱 복잡한 레이아웃 전반적으로 블록 편집기는 기능 드래그 앤 드롭 시스템을 제공합니다 그러나 이러한 기능은 대부분의 페이지 빌더 플러그인에서도 표준입니다 이 점을 고려하여 구텐버그 대 엘리멘틀 대 Divi Builder만의 독특한 점을 살펴 보겠습니다

예를 들어, Elementor를 사용하면 약 30 가지의 '요소'에 액세스 할 수 있습니다 블럭의 플러그인 이름 사용할 수있는 페이지 및 섹션 템플리트의 라이브러리 여러 열 및 훨씬 더 많은 컨트롤을 사용하여보다 복잡한 레이아웃을 만드는 옵션 여백과 안쪽 여백과 같은 간격 위에 각 위젯 및 섹션에 대한 더 많은 스타일 옵션과지도, 이미지와 같은 고급 기능 회전 목마 및 아코디언 탭이 있습니다

머리글, 바닥 글 및 사이트의 다른 부분을 디자인하는 기능을 사용할 수 있습니다 프리미엄 버전에서만 가능합니다 Divi는 어떨까요? 이 페이지 빌더를 사용하면 45 개 이상의 사용자 정의 모듈, 요소 또는 블록의 다른 이름, 귀하의 콘텐츠를 구축하십시오 포트폴리오, 회원 평가,지도, 양식, 카운터 등의 고급 기능 중에서 선택하십시오 더

여러 열 및 심지어 전체 너비와 다중 열이 혼합 된 복잡한 레이아웃 만들기 행 간격을 제어하기 위해 사용자 정의 여백 및 패딩을 추가하십시오 나중에 쉽게 다시 사용할 수 있도록 디자인을 저장하고 많은 스타일 컨트롤을 사용하여 방법을 변경하십시오 모듈보세요 보시다시피 Elementor와 Divi가 비교되는 영역 중 일부는 Gutenberg 블록 편집기는 열, 간격 및 스타일과 같은 것들에 관한 것입니다

통제 수단 이미 Divi 또는 Elementor를 사용하여 사이트에서 작업하는 경우 권장하지 않습니다 대신 Gutenberg를 사용하여 전환 이것은 기존 레이아웃에 혼란을 야기 할뿐만 아니라 현재의 레이아웃에도 영향을 미칠뿐만 아니라 버전의 새로운 블록 편집기는 너무 단순하여 대부분의 사용자를 대신 할 수 없습니다 반면에 페이지 작성기를 사용한 적이없는 경우 차단 편집기는 다음과 같습니다

시작하는 좋은 방법 간단하고 사용하기 쉽고 드래그 앤 드롭 방식을 사용하는지 여부를 결정하는 데 도움이됩니다 시스템으로 콘텐츠를 만듭니다 구텐베르크가 일하는 방식을 좋아하지만 더 많은 유연성을 원한다면 Otter Blocks 플러그인과 Neve WordPress 테마를 사용해보세요 더 많은 도구를 제공합니다

가능성 권장 비디오에서 이들이 어떻게 작동하는지 확인하거나 아래의 설명 상자에있는 링크를 확인하십시오 마지막으로 Elementor는 직관적이고 사용하기 쉬운 인터페이스를 원할 때 이상적입니다 Divi는 옵션과 디자인 가능성을 극대화하려는 경우 가장 좋은 방법입니다 또한 반드시 한 명 또는 다른 한 명을 선택할 필요는 없습니다

Gutenberg 블록 편집기를 사용하여 일상적인 디자인을하고 Elementor로 전환 할 수 있습니다 또는 Divi를 선택하십시오 또는 Elementor의 덕택으로 구텐베르그 디자인에 Elementor 템플릿을 삽입 할 수도 있습니다 무료 공식 블록 플러그인 WordPress의 새로운 블록 편집기에 대해 어떻게 생각하십니까? Elementor 및 Divi와 비교해 볼 때 이제는 차이점을 명확하게 볼 수 있습니다 블록 편집기 및 페이지 빌더

궁금한 점이 있거나 이러한 콘텐츠 제작에 대해 나에게 이야기하고 싶다면 대안, 아래에 의견을 남겨 주시면 최대한 빨리 답변을 드리겠습니다 WordPress에 대한 최신 업로드를 자유롭게 확인하십시오 다음 비디오에서 만나요 건배!

Elementor 2.0 vs DIVI: Outstanding Page Builders Compared

이 비디오에서는 최고의 페이지 빌더 중 두 가지에 대해 질문 할 것입니다 WordPress의 : ELEMENTOR & DIVI

어느 것이 최고인가? 다음에 몇 분 안에 그것을 발견해 봅시다! 글쎄, 여기에 비주얼 페이지 빌더에 대해 이야기하고 두 가지 모두 드래그 앤 드롭 기능을 가지고 있기 때문에, 그들은 사용자에게 친숙합니다 직관적 인 아이콘을 어디서나 볼 수 있으므로 맞춤 기능을 쉽게 찾을 수 있습니다 섹션이나 요소를 쉽게 Elementor에서는 모듈과 설정이 왼쪽에 있지만 Divi에서는 모듈 목록이 있습니다 이 플러스 아이콘을 클릭하면 나타납니다 큰 차이는 아니지만 요소 나 섹션의 설정을 변경하려는 경우, 시각적 경험은 Elementor에서 얻는 것보다 훨씬 낫습니다

팝업 창으로 이동하면됩니다 게다가 Elementor처럼 화면의 왼쪽에 창을 붙일 수 있습니다 또한 두 페이지 제작자가 각 아이콘을 가리키면 각 아이콘이 표시됩니다 마우스 커서를 클릭하고 아이콘을 클릭하면 사용 가능한 옵션 목록이 표시됩니다 이런 식으로 화면에 올라와

이것은 Elementor와 DIVI 모두 거의 같습니다 비주얼 페이지 빌더에서 얻을 수있는 가장 좋은 것들 중 하나는 인라인 텍스트 편집, 사용 가능 모두 내가 발견 한 것은 DIVI에서 독자적인 Heading 엘리먼트를 삽입 할 방법이 없다는 것입니다 예를 들어 섹션 제목을 만드는 것이 어려울 수 있습니다 나는 Elementor에서 정말로 사용할 수있는 Heading 모듈 위로 드래그합니다 내가 원하는대로

따라서 직관적이고 사용자 친화적 인 인터페이스라는 측면에서 볼 때 두 가지 모두 높은 기준을 지니고 있습니다 매우 사용하기 쉽다 WordPress에서 처음부터 Elementor를 사용하여 페이지를 만들면 특정 요소 위로 끌 수 있습니다 요소를 섹션별로 완성합니다 각 페이지 빌더가 제공하는 기본 요소를 사용할 수 있습니다 (예 : 이미지, 텍스트 요소 등

예를 들어, Elementor의 Pro 버전에서는 프리미엄 가격 정책을 드래그 할 수 있습니다 요소 Elementor의 무료 버전에서는 45 개의 항목을 드래그 앤 드롭하여 빌드 할 수 있습니다 커스텀 페이지와 포스트도 포함되어 있습니다 Elementoror는 20으로 시작하여 더 많은 기성품을 제공합니다

섹션과 같이 사용자 정의 페이지를 만드는 데 사용할 수있는 블록과 같이 재생할 수 있습니다 이런 식으로 머리글과 바닥 글도 만들 수 있지만이 템플릿은 PRO에만 사용할 수 있습니다 사용자 두 페이지의 플러그인으로 사용 가능한 요소의 수를 늘릴 수 있습니다 건축업자

다음은 내가 추천하는 7 가지 부가 기능을보고 싶다면 시청할 것을 권장하는 동영상입니다 나는 Elementor에게 말하고있다 아래 설명 상자에 해당 동영상에 대한 링크가 있으므로 확인하십시오 예를 들어 Orbit Fox WordPress 플러그인을 설치하고 활성화하면 몇 번의 클릭만으로 연락처 페이지를 만들 수 있습니다 기본 콘텐츠로 시작할 수 있습니다

그런 다음해야 할 일은 네가 필요로하는대로 WordPress로 할 수있는 것을 더보고 싶다면 같은 버튼을 누르십시오 아래에서 구독하고 벨을 누를 때마다 알림을 받도록 잊지 마세요

새 동영상을 업로드하십시오 내가 말했듯이, 각각에 대해 추가 요소가있는 비공식 플러그인이 많이 있습니다 페이지 빌더가 있으며 대시 보드에서 WordPress 플러그인을 찾을 수 있습니다 여기있는 유일한 한계는 당신의 상상력입니다 이 비디오의 두 페이지 제작자는 많은 맞춤 기능을 사용할 수 있으며 어떤 요소를 뭔가 독특한 것으로 변형시킬 수 있습니다

예를 들어, 단색, 그라디언트 등으로 요소의 배경을 변경할 수 있습니다 그리고 이미지도 일부 요소의 경우 비디오 배경을 설정할 수 있습니다

예를 들어 DIVI에서는 시차 효과를 설정할 수도 있습니다 또한 텍스트 요소에는 멋진 모양을 만들기 위해 필요한 모든 것이 있습니다 Elementor를 사용하여 최상의 모바일 경험을 제공하려는 경우 약간 조정할 수 있습니다 모든 화면 크기에 완벽하게 맞는 콘텐츠 DIVI에서도 그렇게 할 수 있습니다 두 페이지 빌더의 경우 요소 또는 섹션의 가시성을 설정할 수 있습니다

따라서 기본적으로 특정 장치에서 특정 요소를 숨길 수 있습니다 지금까지 살펴 보았 듯이 각 페이지 작성 도구에는 사용자 정의에 사용할 수있는 많은 옵션이 있습니다 귀하의 콘텐츠 및 그로 인해, 그것은 나를 위해 승자를 선택하기가 어렵습니다 내가 좋아하는 것은 Elementor이지만이 비디오가 끝날 때까지 스스로 결정할 수 있습니다 그래서 계속 지켜봐

짧은 것들을 줄이고 기본 웹 사이트를 빨리 만들기 위해 각 페이지 빌더에는 수백 가지가 포함되어 있습니다 사전 제작 된 템플릿을 사용하면 버튼을 한 번만 눌러 콘텐츠를 만들 수 있습니다 앞에서 언급 한 Orbit Fox WordPress 플러그인을 기억하십니까? 이 플러그인에는 무료로 즉시 사용할 수있는 많은 고유 한 기성 템플릿이 있습니다 가져 오기 버튼을 클릭하십시오 예를 들어 무료 버전의 ELEMENTOR를 사용하면 위와 아래의 모양 구분선을 만들 수 있습니다 더 나은 시각적 경험을위한 모든 섹션과 PRO 버전의 애니메이션 텍스트 요소 이 플러그인을 사용하면 페이지가 더욱 동적으로 변할 것입니다 이 두 가지만을 고려하면 WordPress 웹 사이트가 확실히 눈에니다 Elementor의 유지 보수 / 곧 제공 모드는 켜는 또 다른 고유 한 기능입니다 인터페이스에서 바로

DIVI의 고유 한 기능 중 하나는 배경 이미지에 설정할 수있는 시차 효과입니다 당신이 가지고 놀 수있는 더 독특한 특징들이 있습니다 # 가격이 얼마이며 어디에서받을 수 있습니까? 버전도 있으며 대시 보드의 WordPress 저장소에서 바로 설치할 수 있습니다 DIVI에는 무료 버전이 없지만 연간 89 달러 만 지불하시면됩니다 프리미엄 회원이 얻을 수있는 모든 주제와 플러그인

당신이 프리미엄 요소들로 조금 더 향신료를주고 싶다면 Elementor PRO는 1 개의 사이트에서 사용할 수있는 라이선스 인 49 달러의 시작 가격, 업데이트 및 구매 일로부터 1 년간 지원 나는 정확히 얼마나 많은 사용자들이 거의 500K 고객들로부터 DIVI를 가지고 있었는지는 모르지만 한 가지 확실히,이 페이지 작성기는 인기가 있고 WordPress 팬들은 그것을 좋아하고 있습니다 Elementor는 600K 이상의 사용자 때문에 왕관을 얻습니다 아무도 우리가 1 년 후에 볼 수있는 수치가 어느 정도인지는 알지 못하지만 한 가지 확실한 사실은, 그들은 자랄 것이다 필자가 가장 좋아하는 요소는 Elementor입니다

많은 무료 기능이 정기적으로 업데이트되기 때문입니다 라이브러리의 기성 페이지 템플리트 수 및 가져 오기 가능성 맞춤 템플릿은 내가 매일 사용하도록 설득 한 것입니다 자신의 필요에 따라 어느 것이 더 나은지 자유롭게 결정할 수 있습니다 아래의 댓글 섹션 및 WordPress에 대해 자세히 알고 싶다면 다음을 확인하십시오 동영상도 있습니다

구독하여 벨을 탭하면 새로운 비디오를 언제 게시하는지 정확히 알 수 있습니다 당신 준비 다 됐어요! 시청 해 주셔서 감사 드리며 다음 비디오에서 만나십시오

What Is The Best WordPress Front End Page Builder? Divi 3, Thrive, Beaver Builder, Elementor

다른 동영상을 원합니다 제 이름은 WPCrafter

com의 Adam입니다 비 – 기술자 및이 비디오에서 나는 간단한 질문에 답하려고 노력할 것이다 질문에 가장 적합한 페이지 작성기가 무엇인지 질문하십시오이 질문을 보았습니다 나는이 질문에 개인적으로 물었다

다른 사람들이이 질문에 대답하는 것을 보았다 그리고 나는이 비디오에서이 모든 문제를 해결하려고 노력할 것입니다 비디오는 다른 일부 비디오보다 약간 길 수도 있고 다르게 수행 한 것일 수도 있습니다 이 비디오에서 나는 실제로 여기에 메모 한 장을 가지고 있으므로 확신 할 수 있습니다 내가 먼저 궤도에 머물고 있다는 것을 먼저 물어 본다

첫 번째 문제에 대한 질문은 질문하는 사람이 누구에게 달려 있는지에 달려 있다는 것입니다 페이스 북 그룹에있는 누군가를 연설하고있는 친구 또는 어쩌면 당신은 지각 된 WordPress의 전문가 또는 인터넷 전문가 그것은 당신이 당신에게 묻는 질문에 따라 다른 대답을 얻습니다 당신은 10 명의 다른 사람들에게 10 가지의 답변을 줄 것을 요청할 수 있습니다 그래서 그것이 왜이 주제입니까? 지뢰 종류에 발을 들여 놓는 것과 같아요 사람들이 열정적이라고 확신합니다

그들이 내가 지금까지 보아온 문제 중 일부와 함께 가기로 선택한 페이지 제작자에 대해 이 토론 주위에는 WordPress의 사용자 유형에 따라 달라 지므로 다른 그룹에는 WordPress에 아주 새롭고 일반적으로 묻는 사람들이 있습니다 이 질문에는 초보 사용자가 있습니다 나는 언론의 순수 주의자라는 단어를 좋아합니다 그리고 종류는 매우 가혹할 수 있고 심지어 일부 페이지 빌더를 줄 수없는 것들입니다 기회와 그들의 비판에 매우 가혹한 나는이 단어에 대해 더 이야기 할 것이다 press purist 이 비디오의 뒷부분에있는 문제는 내가 다른 페이지 빌더에 대해 이야기하고있을 때입니다

그들의 찬성과 그들의 코멘트 중 일부는 그래서 나는 당신이 가진 사람들이있는 것을 본다 다른 스킬 레벨이지만 다른 목표를 가진 사람들도 있습니다 목표 인 귀하의 목표가 될 수있는 방문 페이지를 WordPress 웹 사이트에 갖고 싶습니다 모두를 목표로하는 페이지 작성 도구를 사용하여 전체 웹 사이트를 구축하는 것일 수 있습니다 다른 목표를 가지고 있기 때문에이 질문은 정말로 어렵습니다

페이지 빌더는 자신의 찬반 양론을 가지고 있으며 자신 만의 독특한 기능을 가지고 있습니다 그것들은 동적 인 질문이기 때문에 가장 좋은 페이지가 무엇인지 물어 보는 것입니다 WordPress는이 문제를 매우 어렵게 만드는 다음 문제에 대한 진정한 대답입니다 대답은 모든 페이지 작성자가 다른 개발 단계에 있다는 것입니다 소득에 대해 물을 때와이 비디오가 무엇을 자극했는지에 따라 가장 큰 것 중 하나입니다

WordPress 페이지 빌더 Divi가 방금 새 버전을 발표하고 전체를 릴리스합니다 프론트 엔드 인터페이스 옵션과 눈 사탕으로 가득 차있어 아름답습니다 이 비디오에서 Divi에 관해 알아 본 다음 다른 것들을 살펴볼 수도 있습니다 예쁘게 보이거나 같은 기능과 물건을 갖고 있지는 않지만 모든 페이지 작성 도구가 다른 개발 단계에 있다는 점에 유의해야합니다 내가 이야기하려고하는 페이지 작성자 중 두 명이 완전히되고 있다는 것을 알게됩니다

상호 작용하는 방식으로 UI가 개선되었습니다 질문에 대답하면 간소화됩니다 오늘 내가 생각하는 가장 좋은 페이지 작성기는 답변이 내일 바뀔 수도 있습니다 이 페이지 빌더 중 하나의 다음 버전이 릴리스되어 이것이 매우로드 된 이유입니다 당신이 누구에게 물어 보는 지 묻는 질문과 내 웹 사이트에 특별한 페이지가 있습니다

다른 페이지 빌더의 이러한 다양한 변경 사항을 최신으로 유지하고 있습니다 이러한 여러 단계로 인해이 질문에 답하기가 너무 어려워졌습니다 이 비디오에서 나는 프론트 엔드 페이지 제작자들 앞에서 이야기하고 싶다 지금 WordPress에 대해 생각하고 있을지 모르지만 앞 페이지 빌더보다 더 많은 방법이 있습니다 그들의 것이 전부이고 나는 이것들을 가지고 있기 때문에 그렇게한다

워드 프레스에서 가장 많은 견인력과 성숙한 그들은 개발 직원이있어 그들 뒤에 헌신적으로 강해서 변화 할 수도 있지만이 비디오를 제작할 때 네 가지 주요 페이지 빌더 정착촌에 대해 이야기하고 프린지 것들도 좋아해 당신은 테마와 함께 번들 된 것들을 알고 있습니다 그리고 나는 그것들에 대해서 이야기하지 않을 것입니다 그것들은 초석이 될 것입니다 X 주제에서 당신이 주제 강연에서 찾은 것입니다

그것에 대해 거대한 역동이라고하는 또 다른 하나가있다 그리고 그것은 테마와 함께 번들로 묶여있다 아주 작은 사용 경주가 있습니다 사람들이 저에 대해 물어 보았습니다 그것에 대해서 이야기하십시오

왜냐하면 그것이 내일 주변에있을 수 있는지 여부가 아무런 언급이 없기 때문입니다 또한 시각적 인 작곡가가 있습니다이 라이브러리는 번들로 제공되기 때문에 거대한 사용자 기반을 가지고 있습니다 많은 주제가 있지만 매우 열악한 프론트 페이지 빌더이며 워드 프레스 저장소에도 있습니다 시장 점유율을 얻으려는 프런트 엔드 페이지 빌더가 많이 있지만 실제로 견인을받지 못하고 제대로 판매되지 않고있어 미래의 많은 것을 볼 수 있습니다

그래서 그것이 제가 최선의 것을 좁혀 야했습니다 나는 내가 함께 갈 수 있도록 지금 당장 이걸 통과하려고 노력한다 요점은 말했듯이 내 웹 사이트로 돌아가서 항상 이 질문에 대답하는 가장 신선한 데이터에 대한 시각 이 비교는 각기 다른 페이지 빌더의 비디오를 사용 방법에 대해 차트로 나타냅니다 그 (것)들 및 그 (것)들과 가진 새로운 발달은 인 무엇 그래서 첫째로 성분 둘러보기 지금 Elementor에 대해 들어 보지 못했을 수도 있습니다 무료 프론트 엔드 페이지 제작자입니다

미래에는 사실 미래에 대한 사실을 알고 있습니다 유료 버전의 요소와 요소는 실제로 불과 몇 달 전의 것이므로 위선적 인 것은 아닙니다 사용자 기반이 급상승하여 목록에 추가함으로써 성숙한 것입니다 빠른 속도로 움직이고 있습니다 Elementor가하는 일은 놀랍습니다

실제로 그들이 99 % 확신하는 다음 페이지 완료 왜냐하면 템플릿은 요소를 기반으로 할 수 있기 때문에 또는 무료 프론트를 찾고 있다면 최종 페이지 작성자 이것은 푸가 (pug)에 타블렛 시스템이있는 가장 좋은 옵션입니다 그것은 내장 된 템플릿을 가지고 있습니다 당신은 모바일 템플릿을 가지고 있습니다 그것은 그들이 요소 작업으로 한 것을 놀라 울뿐입니다 그리고 완전히 무료로 제공됩니다

그리고 나는 많은 비디오를 가지고 있고, 나는 요소 투어에 관해 발표 할 예정이다 정말로 당신이 페이스 북 페이지를 좋아해야만하기 때문에 새로운 기능을 계속 확인할 수 있습니다 그들이 추가하고 있으며 문자 그대로 가장 적극적인 마케팅 팀이 있습니다 그들은 하룻밤 사이에 엄청난 사용자 기반을 가지고 있다는 말을 듣는 것을 정말 잘합니다 시간이 지남에 틀림없이 이것이 최고의 폰트 및 페이지 빌더가 아니라면 최고가 될 것입니다

그래서 지금 Elementor가 가장 기능이 풍부하고 신뢰할 수있는 최고의 무료 제품이라는 것을 선언하고 있습니다 앞면과 페이지 빌더 그리고 Elementor는 여기에 링크를 아래에 넣을 수있는 웹 사이트입니다 그들이 한 일을 놀라워하고 Daniel Seymour가 그들에게서 나왔습니다 Divi Divi에 관해서는 우아한 주제로 지어진 페이지 제작자입니다 백엔드 페이지 빌더로 알려진이 때문에 프로 비 던트가 전체적으로 많이 얘기하지만 며칠 전에 버전 3을 출시하고 잠시 동안 작업을 진행했습니다

완전히 새로운 프론트 및 페이지 제작 경험을하고보기에 꽤 놀랍습니다 지금 당장 프런트 엔드 사용자 경험을 간략하게 보여 주겠지 만 몇 가지 장점이 있습니다 우아한 테마는 커다란 개발 공동체 인 거대한 사용자 커뮤니티이자 당신이 알고 싶은 것은 무엇이든 할 수있는 곳이 많습니다 Divi 고대와 함께 발전하고있는 곳에서 어느 곳으로나 거대한 발전이 이루어지면서 AB와 같은 매우 독특한 기능이 가장 최근의 목록을 보려면 내 웹 사이트로 돌아 갔지만 모두 지금 당장 그들 중 하나에 대해 이야기하고 그것은 B 분할을 가진 유일한 페이지 작성자입니다 당신이 염려하거나 더 높은 전환율을 원하는 경우 테스트가 내장되어 있습니다

웹 사이트는 그것이 그들이 분할 테스트를 가지고있는 유일한 것들입니다 AB 테스트 엔진이 페이지 빌더에 내장되어 있으며, 정말 놀라 울 것 같습니다 그들은 방금 정면에 밀기울로 새로운 사용자 인터페이스를 발표했다 그리고 그것은 화려하다 데비도저기서 싫어하는 사람들을 데려 와서 우울했다 그들은 열정으로 Divi를 싫어하고 당신이 누구에게 묻 느냐에 달려 있습니다 누군가 데비를 좋아한다고 말하거나 누군가 거기에있는 것을 싫어한다고 말했습니까? 모두 당신에게 그 두 가지 질문을하는 사람들을 조심해야한다

그들이 당신에게주는 대답에 대한 단서를 들어라 나는 소수의 사람들이 즉시 해임당하는 것을 보았다 그들의 새로운 사용자 인터페이스와 Divi에 대한 새로운 사용자가하는 과정을 알고 있습니다 어떤 것을 클릭해야할지 모르겠다 나는 그 주장을 듣는다

그러나 나는 또한 그것이 절대적이라고 생각한다 쓰레기와 이유는 내가 쓰레기의 무리라고 생각하기 때문에 내 웹 사이트에 살고있어 채팅 WordPress에 새로운 사용자를 향해 치료하려고 할 때 내 웹 사이트에서 그리고 내가 앞면과 페이지 빌더를 사용하는 것이 가장 쉬운 방법을 알았고 그걸 사용하는 방법을 알고 그래서 어떤 페이지 빌더 누군가가 웹 사이트 건물이나 워드 프레스에 새로운 그들은 그것을 사용하는 방법을 알지 못할 것이고, 상관없이 학습 곡선이 될 것입니다 어느 것을 사용하면 사용하기 쉽고 사용하기 쉽다는 말을 할 수 있습니다 또는 이것을 사용하기가 더 쉽다고 생각하지만 워드 프레스를 처음 사용하는 사람은 모두 상대적이기 때문에 프론트 엔드 페이지 제작은 어떻게 보더라도 학습 곡선을 갖게 될 것입니다 아무리 당신이 그것을 자르면 학습 곡선이 될 것이고 나는 사람들을 도우려고 노력했다

그리고 앞 페이지 빌더가 Beaver Builder와 Beaver Builder에 대해 이야기하고 싶습니다 하지만 저는 사람들에게 비버 빌더 (Beaver Builder)라는 브랜드의 브랜드를 느꼈고 그들이 그렇게하고 있다는 것을 모릅니다 모두 필요한 모든 도움을 필요로합니다 당신이 그것을보고 당신이 즉시하지 않기 때문에 앞면과 페이지 빌더를 닫습니다 클릭 Hon

그들 중 아무도 페이지 빌더가없고 즉시 알지 못한다 클릭하여 사용하고 편안하게 사용해야합니다 문제는 당신이 DivX에 다른 사람에 대한 그들의 의견을 purists이 WordPress 물어 때 Divi는 쇼트 코드라고하는 무언가를 만들고 있는데 이것이 의미하는 바는 무엇입니까? 삶에 대한 Divi의 개념 – Divi 사용을 중단하고 변경할 수 없음을 의미합니다 엉망이 될 것이지만 수많은 해결책이 있기 때문에 전복 논쟁을 볼 수 있습니다 인터넷에서 짧은 코드를 지울 수있는 약간의 코드가 있습니다

그리고 당신은 똑같은 내용을 바로 거기에 넣으십시오 그래서 그것은 정말로 비 의미입니다 실제로 비버 빌더 (Beaver Builder)가 좋아하는 것들 중 하나가 비활성화 될 때입니다 비버 빌더를 아직 사용하지 않기로 선택하십시오이 내용은 데비와 함께 있습니다

만약 당신이 그저 약간의 여분의 단계를 복사하여 약간의 코드를 붙여 넣는다면 이걸이 모든 단축 코드의 개념이라고 할 수있을거야 당신이 멈추기로 결정한다면 당신은이 페이지 빌더 중 어느 것과도 동일한 작업 부하를가집니다 그것들을 사용하고 다른 하나에 가도록 내가 개인적으로 그것이 잔인한 것이라고 생각한다 이제는 실제로 귀하의 웹 사이트를 가지고있는 일부 코드의 합법성이있을 수 있습니다 그러나 솔루션을 호스팅하고 우수한 캐싱 솔루션이 있다면 조금 더 느리게 실행하십시오

Divi를 사용하고 있기 때문에 웹 페이지를로드하는 데 3 ~ 4 밀리 초가 걸립니다 그 거래의 큰 그리고 내가 인터넷에서 보았던 연구가 다른 페이지 빌더 비교 속도 테스트 및 모든 그 어깨 정말 작은 차이 그 (것)들의 사이에서 속도 현명한 어떤 언론 페이지 빌더 당신이 필요로하는 사용 캐싱을 사용하려면 최적화가 필요하거나해야 할 일을 최소화해야합니다 어쨌든 최적의 속도로 달릴 수 있도록이 모든 것들을 그렇게 확신합니다 논쟁 중 어느 것이 든 지금 나는 당신이 Divi를 가진 정말 큰 사이트를 가지고 있다면 그것은 단지 천천히 달릴 것입니다 저는 제가 그것을 믿을 때 저는 그것을 말하지 않을 것이라고 생각합니다

그건 사실이 아니지만 내가 말하는 것은 대부분의 사람들이 WordPress 웹 사이트를 원한다는 것이다 어쩌면 10 페이지 또는 20 페이지를위한 데비는 환상적인 옵션이므로 여기에 발표 페이지가 있습니다 Divi는 아마 WordPress의 가격면에서 최고로 매력적이며 매력적입니다 당신은 평생 라이선스 단어를 얻을 수 있습니다 심지어는 매년 지불하지 않는거야 그리고 그것은 훌륭한 가치입니다 그래서 나는 당신의 사이트를 바로 여기에서 원하고 당신과 함께 진짜 빨리 보여줄 것입니다

새 인터페이스는 클릭 할 수있는 근처에 버튼이있는 것처럼 보이며 시도 할 수 있습니다 자신을위한 새로운 인터페이스는 당신이 주변을 돌아 다니는 것을 알고 있습니다 여기를 클릭하면 다른 옵션을 사용할 수 있습니다 그것이 무엇인지 알지 못한다 당신은 그 버튼이 무엇을 바꾼다는 것을 말해 줄 것이다

멋진 에세이이지만 여기를 클릭하면 무언가를 원상태로 돌리고 싶다면 이것을 클릭하면됩니다 되돌아 가세요 당신이 할 수있는 훌륭한 일들입니다 아마 이것은 가장 빠릅니다 프런트 엔드 페이지 구축 경험을 통해 본 것처럼 텍스트를 클릭 할 수 있습니다

이것으로 타이핑을 시작하면 편집 옵션이 있으며 주변을 움직일 수 있습니다 지금 내가 말했듯이 대답이 나오면 답이 많이 나올 수 있지만, 다른 페이지 빌더에서 제공되고 있습니다 이것은 다소 어색하게 보일 수 있습니다 나는 40 살이라는 것을 알고 30 살 때 새로운 휴대폰을 나에게 줄 수 있었고 나는 배울 수있다 Phil을 사용하는 것이 행복합니다

40 세가되면 iPhone을 가져 가서 안드로이드 폰을 주면됩니다 불편 함과 불편 함을 느끼는 숫자이며 그것이 내가 생각하기에 종기가된다 새로운 인터페이스를 사용하면 꽤 좋은 시간이라고 생각합니다 정말로 당신이 당신이 나의 웹 사이트에 되돌아 가게되고, 그것을 조사해야 한다라는 것처럼 그렇게 나는 그것이 좋다 내 웹 사이트에이 정보가 언제 표시되는지에 따라 업데이트 된 정보가 매우 귀엽습니다

다음에 보려는 비디오는 실제로 여기에 있습니다 지금 당장보고 싶었어 콘텐츠 제작자가 위협 콘텐츠 작성기를 가지고 있지 않다 그것과 찬반 양론의 그것은 앞면과 페이지의 최고의 1 세대 중 하나였습니다 빌더는 실제로 당신을 놀라게해서는 안됩니다 나는 그들이 일종의 개념을 개척했다고 생각합니다

정말로 나는 그들이 앞장서 서 처음 본 페이지 빌더 였음을 의미합니다 진정한 평평한 전면 및 편집 페이지 경험이 있었으며 2014 년에 다시 돌아 왔습니다 이제는 첫 번째 버전 중 하나이며 이제는 Thrive Content 빌더와는 다른 트위스트가 있습니다 더 많은 종류의 마케팅에 맞춰졌고 실제로 많은 요소가 실제로 조정되었습니다 마케터와 궁극적으로 대부분의 웹 사이트를 향해 우리 자신의 제품을 마케팅하는 우리의 제품 또는 비즈니스 리 마켓팅을 통해 수익을 창출 할 수 있습니다

건축업자의 강점이 있으며 그 중 가장 독특한 특징 중 하나는 새 페이지를 만들 수있는 방문 페이지 기능 100 개가 넘는 템플릿이 내장되어있어 방문 페이지 패키지에 새로운 템플릿을 계속 추가합니다 그 (것)들에 당신이주는 가치는 매우 놀라 울뿐입니다 에디터가 어떻게 생겼는지는 모르겠지만 에디터의 영웅에 대해 논평하고 싶습니다 곧 당신이 보는 첫 번째 것 중 하나가 편집 경험을 얻는 것입니다 매우 성숙하고 마케팅 관련 기능이 가득하며 나는 그것을 좋아합니다

실제로 내 사이트에서이 모든 것을 사용하여 다른 페이지 빌더 중 하나를 사용할 수도 있고 일반적으로이 고유 한 방문 페이지 기능과 이러한 독특한 마케팅 때문입니다 이 페이지 빌더에 대해 이야기 할 때 지금 가지고있는 요소 개발의 다른 단계 내가 말할 수 있습니다 빌더는 현재 버전 15에서 곧 재개발되고 있습니다 버전 2가 나오면 전체 인터페이스를 다시 작성하고 단순화하는 것이 좋습니다

올바른 콘텐츠 작성자에 대해 들었던 불만 중 하나는 잘 작동하려면 복잡해졌고 그들은 잘 알고 있으며 단순화하고 있습니다 그리고 그들은 사용자 인터페이스를 재 설계하고 있는데, 이것에 관해서 내가 좋아하는 것 중 하나이다 전체 페이지 빌더 전쟁과 요소는 Thrive와 같은 회사에 압력을 가하고있었습니다 컨텐츠 제작자가 UI를 업데이트하고 더 좋고 나을 수있게 해줍니다 저는 개인적으로 큰 사람입니다

Thrive 콘텐츠 제작자의 팬과 내가하고있는 일들을 많이 사용합니다 개인적으로 모든 웹 사이트에서 실제로 사용되고 가격이 책정되는 것을 볼 수 있습니다 드라이브 복사 건축업자는 당신에게 1 년 지원을 얻는 1 시간 요금이 아주 매력적입니다 그 (것)들에게 진짜로 유일한 특징 인 갱신의 일생은 모두 다른 사람이다 사람들은 당신에게 전형적인 WordPress 가격 책정이 많지 않습니다 평생 좋은 일이 아니거나 1 년 동안 1 년 간 지원을받습니다 그 해를 넘어선 무엇이라도 원한다면, 당신이 필요하지 않더라도 그것을 위해 돈을 내야 만합니다

그들이 무엇을하고 있는지에 대한 지원이 필요하다면 업데이트가 필요합니다 새로운 기능과 새로운 기능을 지속적으로 추가하지만 지원을받지 못합니다 그 해가 지나면 지원을 원한다면 약간의 수수료를 내야합니다 어떤 WordPress 제품을 사용하기위한보다 선행적인 합리적인 방법이지만 그들이 수익을 위해 그것을하는 방식으로하십시오 내가 옳은 콘텐츠 제작자에 대해 당신이 무엇이든 사용할 수 있다고 말하고 싶지만 그렇지 않습니다

이야기 할 때 주제와 완벽하게 통합됩니다 이 줄이 바로 여기에 있는데,이 색깔을 가지고 있고, 여기에 다른 틀린 다른 색깔이 있습니다 장미 빛으로 가득 찬 컬러 컵과 오른쪽 콘텐츠 작성기로 큰 부정적인 지금은 당신은 완전한 철수를 얻을 수없고 자신의 테마 또는 드라이브 콘텐츠 작성 도구가 포함 된 방문 페이지를 사용 중입니다 지금은 구걸하는 중입니다 개발자가 그것을 변경하도록 요청하면 그것이 내 웹 사이트로 되돌아갑니다

최신 정보를 모두 최신 상태로 유지하십시오 그러나 이것은 큰 부정적인 것입니다 그 (것)들을 위해 그러나 나는 생각한다 조금 같이 그들은 버전 2에서 저를 고칠 것이다 좋아하지 않는다 그걸 알아라하지만 나는 그들이 내가 원하는대로 업데이트하고 변경하도록 요청하고있다 이것이 바로 그렇게 될 수있는 최고의 제품이 될 것입니다

지금 콘텐츠 제작자입니다 마지막으로 보게 될 것은 바로 여기에 있고 이것은 비버 빌더입니다 비버 빌더는 실제로 내가 비버를 사용하는 많은 워드 프레스 개발자들에게 인기가있다 작성자가 많은 사이트에서 내 웹 사이트를 새로 만들면 나는 그것이 전체 웹 사이트를 구축하는 방향으로 비버 빌더를 사용할 것입니다 그것으로 꽤 환상적입니다

그들은 또한 그것이 완벽하게 작동한다는 주제를 가지고 있습니다 비버 빌더는 전체 웹 사이트 구축에 매우 적합하며 매우 효율적입니다 사용하기 쉽습니다 저는 Beaver Builder를 많이 좋아합니다 이제는 템플릿 기능이 뛰어납니다

이것이 의미하는 바는 내장 템플릿이있는 템플릿을 가져오고 내보낼 수도 있다는 것입니다 하지만 행렬에 모듈을 저장할 수 있습니다 그것은 또한 비버 빌더의 무료 버전입니다 나는 비버 빌더의 유료 버전입니다 유료 버전에 대해서 당신이 의도가 없다면 무료 버전은 제거됩니다 당신이 페이지를 지불하고 싶은 경우에 당신이 Elementor로 가고 싶은 페이지 건축업자를 지불하는 것은 이제까지 지불한다 비버 빌더가 들어있는 곳에서 전문적인 지원을받는 빌더 환상적인 태블릿 기능 8은 예를 들어 어떤 것과도 쉽게 통합됩니다 나는 내 사이트에서이 코드를 사용하고 있는데, 추가해야 할 코드 조각 내 사이트의 열을 가득 채우려면 내 사이트에 완벽하게 통합됩니다

비버 빌더 (Beaver Builder)에 대한 정보가 너무 많습니다 이상한 이름 인 Genesis dam Buster 매주마다 장미를위한 템플릿으로 Beaver Builder를 사용할 수 있습니다 스튜디오 프레스 템플릿과 아이 일은 꽤 환상적이며 개발자들은 Beaver Builder 테마 개발자들과 거래를하고 있습니다 Go Daddy 관심사는 Go Daddy가 본질적으로 자동으로 많이 설치할 수 있다는 것입니다 자신의 웹 사이트와 그들은 무료 및 유료 버전의 거대한 사용자 기반있어 매우 건강한 회사, 그래서 Beaver Builder를 통해 나는 그들이 다시 디자인하고 있다고 말하고 싶다

인터페이스가 그래서 지금은 인터페이스가 어떻게 생겼는지를 알 수 있습니다 그것의 버전 2는 완전히 미끄러 워질 것입니다 비디오를 몰래 빼내 주면 좋겠다 나는 비버 빌더를 아주 좋아한다 믿을만한 비버 빌더 커뮤니티는 비버 빌더에 대해 매우 열정적입니다

Divi 커뮤니티는 Divi에 열정적 인 관계로 Beaver Builder는 간단히 말하면 나오고있는 그들의 유일한 특징 나는 그것이 실제로 멀리 주어질 수있다라고 생각하지 않는다 무료 플러그인 유료 사용자가 될 수 있다고 생각합니다 그들이 청구 할 수도 있습니다 당신이 나를 인용 할 수 있는지 모르겠지만 WordPress에서 페이지 템플릿 템플릿을 디자인 할 수있는 페이지 템플릿을 디자인 할 수있는 기능 Beaver Builder에서 404 페이지에서 블로그 게시물이 실제로 약점 중 하나 일 수 있습니다 나는 비버 빌더를 현재 블로그 포스트로 사용하지 않을 것이라고 생각한다

어쨌든 단지 페이지 일 뿐이다 그건 비버 빌더입니다 그래서이 비디오에서 볼 수있는 것은 제가 대답하지 않았던 것입니다 어떤 WordPress 프론트 엔드 페이지 제작자인가에 대한 질문은 그것이 무엇인가에 달려 있습니다 이렇게 많은 요인에 나는 WPCrafter

com 나의 웹 사이트 등을 맞댄 가고 싶다 당신은 쉽게 앞면과 뒷면을 모두 추적 할 수있는 페이지를 쉽게 찾을 수 있습니다 페이지 빌더를 최신 상태로 유지해야 기능을 분류 할 수 있습니다 내가 가진 비디오를 분리 해낸 모든 것의 비교 차트 이 4 페이지짜리 빌더는 각각 자주 방문 할 수있는 장소가 될 것입니다 질문에 대한 답변으로 의견을 말하고 답변을 얻을 수있는 장소가 될 것입니다

나와 그 모든 것에서 나는 정말로 네가 내 웹 사이트로 돌아 가기를 바란다 당신이이 비디오를보고있을 때 나는 그 질문에 대한 나의 대답을 말해 줄 것이다 그리고 내 대답은 내 변화가 어쩌면 내가하지 말아야 할지도 모르지만 어쨌든 나는 그것을 할거야 비즈니스 용으로 누군가를 위해 웹 사이트를 구축해야한다면 Beaver Builder 내가 상상 한 방문 페이지에는 건조한 콘텐츠 작성 도구가 포함될 수도 있습니다 그 사이트 그래서 나는 그들을 위해 상륙 페이지를 빨리 크랭크를 돌릴 수있다 that 's 나의 대답 Divi 정직하게 나는 그것으로 가득 차있는 웹 사이트를 건축하는 것을 시도 할 필요가있는으로 주변에 놀 필요가 있고 그 일을하려고하고 TV를 통해 사람들이 그 과정을 겪을 수 있도록 도와주는 코스를 공개하려고합니다

Beaver Builder를 사용한 초기 학습 곡선 내 사이트 작업에 대한 홍보가 이미 있습니다 너는 나의 위치를 ​​통해서 누른 너는 나의 위치에 연결을 통해 그것을 산다 나는 훈련을 멀리주고있다 물론 Beaver Builder를 처음 사용하는 사람부터 Beaver Builder를 만들 수있는 사람까지 전체 웹 사이트를 활용하고 Beaver Builder의 모든 기능을 활용하십시오 예산 및 나는 웹 사이트 주제를 사기 위하여 또는 WordPress 페이지에 웹 사이트 페이지에 의하여 돈이 없었다 빌더 Elementor 끝까지 Elementor 모든 길 그리고 나는 정말로 미래가 무엇인지 모른다 Elementer를 위해 내가 행복 유료 버전에 거기에있는 것을 안다 그리고가는 웨이터는 단지 것이다 이 사용자 기반과 같은 기능이 이렇게 가고 있습니다

나는 생각조차하지 않습니다 Divi로 막을 수있는 모든 것들이 정말 파고들 필요가 있습니다 나는 단지 투명 해지고 있습니다 나는 Divi에 대한 판단을 서두르지 않고 있으며, 그것이 쓰레기라고 말하거나이 서비스를 Divi 빌드를 실제로 사용해야하기 때문에이 부분과 다른 부분을 어디에서 클릭해야할지 모르겠다 완전한 웹 사이트가 Divi 일 것입니다

그리고 그것은 앞으로 몇일 동안 곧 나올 것입니다 몇 달이 지나면 내 웹 사이트로 이동하면 전체 비디오 라이브러리를 갖게 될 것이라고 확신합니다 Divi에서 직접 결정을 내리기에 충분한 정보를 주셨으면합니다 내 웹 사이트에서 보자 라이브 채팅이있어

내 인생에 갈 수있어 제인이 나에게 질문했다 너의 상황에 대해 내가 생각하는 것을 내가 알고 싶으면 나는 행복하다 내 웹 사이트에서 실시간 채팅을 통해 대화하고 의사 소통하거나 아래 또는 아래에 댓글을 달거나 나가기 전에 내 웹 사이트에 대한 의견을 듣는다 나는 너와 내가 그것에 들어가기 전에 뭔가를 가지고있다

나에게 뭔가를 해달라고 부탁하고 싶었다이 비디오에서 나에게 엄지 손가락을 줄 수있다 구독자가 아니라면 구독 버튼을 클릭하십시오 이 동영상에 대한 질문에 답해 주시면 의견이나 질문을 남길 수도 있습니다 이 비디오 아래 헤이, 나는 너와 그를 위해서만 코스를 짜 넣고 너에게 그것을 준다

무료로 당신이해야 할 일은 바로 여기 오른쪽 버튼을 클릭하는 것입니다 WordPress의 성공에 3 단계 당신이 좋아할 멋진 과정입니다 내가 좋아할거야 이 비디오를 시청 해 주셔서 감사합니다 정말 감사드립니다 너를 위해서하는거야

Divi 3 How To Use A Popup Modal Box

안녕하세요 여러분, 다른 Divi WordPress 자습서에 오신 것을 환영합니다 제이미입니다

시스템 22 및 웹 디자이너 기술 팁 진정 이 비디오에서 우리는 일종의 팝업 창인 모달을 사용할 것입니다 그건 당신의 콘텐츠 상단에 있습니다 그래서 제가이 일을 끝내면 이리 당신 이것은 모달입니다 그것은 당신의 위에 앉아있는 약간의 팝 아웃 형태입니다 버튼이나 어떤 종류의 트리거를 클릭하면 Divi는 다른 모든 것에 환상적이기 때문에 모달은 훌륭합니다

aspect 나는 그들의 시스템에 모달을 왜 포함시키지 않았는 지 잘 모르겠다 하지만 내가 그렇게 많이 말했듯이 Divi는 당신이 그것을 시도하고 싶다면 절대적으로 굉장합니다 아래 링크를 체크 아웃하지만 어쨌든 Divi 사이트에 모달을 추가 할 것입니다 그래서 우리는 지금 이런 일이 일어나서 우리가 할 수있는 일을 얻을 수 있습니다 플러그인을 설치해야합니다

이미 설치했는데 보여 드리겠습니다 대시 보드에서 플러그인으로 이동하는 경우 수행해야 할 작업 거기에 가기까지 가서 새로운 것을 추가하십시오 여기 오른쪽에있는 검색 창에 팝업 메이커 em aka are 일단로드되면 일반적으로 첫 번째 것이지만 그 작은 녹색을 가진 것입니다 거기에 아이콘이있어 2461 리뷰 5 별 그래서 꽤 괜찮아 내말은 그게 진짜로 당신이 볼 수있는 것처럼 절대적으로 굉장한 통계가 되는거야

이미 설치 버튼을 누른 후 설치해야합니다 일단 다른 플러그인과 같이 활성화하면 활성화 될 것입니다 대시 보드는 여기에 있습니다 좋아요 설치되고 활성화 된 상태에서 마우스를 가져가 팝업을 추가하십시오

이제 우리는이 시험을 두 가지라고 부를 것입니다 이것은 내 의지가 될 것입니다 힌트를 제공하고 무슨 일이 일어나고 있는지 알려주며 Divi를 사용할 수 없습니다 빌더를 만들고 멋진 팝업을 정말 쉽게 만들 수 있습니다 그래서 빨리 뭔가를 만들어 봅시다

2/3 및 1/3 1/3 2/3 여기에 이미지 넣기 이걸 아주 빨리 할거야 이건 Divi 작성자가 아닐지도 몰라 이건 우리가 여기에 제목을 넣을 건 상관 없어 입술과 폭탄에서 넌센스 텍스트를 빠르게 가져와 봅시다

로렐의 순수함을 알지 못하는 분들은 필러 텍스트 일뿐입니다 디자이너가 텍스트를 넣을 때 사용할 수있는 콘텐츠가없는 콘텐츠를 거기에 적절한 텍스트가 어떻게 보이는지 알고 싶다 당신이 그것을 그냥 복사 할 수있을 때 꽉 끼는 꽉 끼는 타이핑 여기에 또 하나의 작은 행을 덧붙인다 나는 이것들을하고 있다고 말할 수있다 믿을 수 없을 정도로 빨리 나는이 특별한 물건을 만드는 데에 시간을 보내지 않는다

사이트를 올바르게 구축하는 방법은 귀하에게 달려 있습니다 좋아, 이거 저장해라 당신 그것을 발표하겠습니다 당신 당신 이제 괜찮아요 미리보기 버튼을 눌러보세요

그것은 다음과 같이 보일 것입니다 우리는 그냥 숙녀 그림과 아래에있는 텍스트 블록을 가지고 있습니다 분명히 당신은 당신이 좋아할만한 것을 알고 있습니다 비디오를 만들 수 있습니다 당신은 무엇이든지간에 사진 갤러리를 원할 것입니다

지금하고있는 일을 실제로 해보 죠 그걸로 내가하고 싶은 것은 내가 가고 싶은 페이지로 가야한다 당신 우리가 개발 한 비디오의 마지막 몇 이 작은 이미지들은 그레이 스케일에서 시작해서 그들 위에 마우스를 올려 놓습니다 그들은 자라나고 색깔이 생기고이 호버 글씨는 여기에있다 실제로 무언가를 말하는 방아쇠를 여기에 추가하고 싶습니다

더 많은 것을 읽으면서 나는 사람들이 할 수있게하고 싶다 그것을 클릭하고 라이트 박스를 열면이 팝업이 나타납니다 우리가 만든 이런 것들이 어떻게 만들어 지는지에 관해서는 직설적이지 않습니다 이 일을하지만 당신이 알지 못하는 한 그것이 얼마나 힘든 일인지 알지 못한다면 몇 번 해봤 으면 정말 쉽습니다 그래서 내가 할 일은 나는 가서 새 페이지를 추가 할 것이고 우리는이 페이지를 유지하지 않을 것이다

순전히 코드를 얻으려면 제목도주지 않을 것입니다 여기에있는 페이지를 보면 팝업 메이커를위한 작은 초록색 아이콘을 클릭하면 팝업이 나타납니다 방아쇠 내 옵션은 무엇입니까? 3 호 제목과 같은 것으로 만드십시오 우리가 꾸미고 싶어하는 경우에 대비해서 수업을 해줄거야 pop Z 아빠의 우우, 우리가 그 안에 무엇을 갖고 싶니? 그게 우리가 실제로 필요로하는 모든 것이어야하고 우리가 그 여자를 원하는 팝업이어야합니다

created2는 test2이고 우리는 그것을 저장하고 그것을 넣을 것입니다 믿거 나 말거나, 코드를보기 위해 텍스트 탭을 봐야합니다 그 두 괄호 사이에 우리가 원하는 모든 텍스트를 넣고 싶습니다 나는 더 많은 것을 읽으십시오 더 많은 것을 읽었다 거기에 우리가 간다 그리고 그것이 우리가 얻은 것이다

그래서 나는 이것을하고 싶다 텍스트 우리가이 페이지를 유지하는 것이 아니라고 말했습니다 우리의 방아쇠를 모두 ctrl C를 복사 실현 이제 우리가 사용하고자하는 페이지로 돌아가서 우리의 시각적 효과를 가능하게하자 여기 빌더 일단 이것이 가능 해지면 나는 이것에 갈거야 이것은 우리의 칼럼이고 우리의 텍스트 모듈을 사용하여 방아쇠를 당겨서 방아쇠를 당길 수 있습니다 석탄과 아마 당신이 처음 거기에 들어가면 비주얼 모드에있을 것입니다

약간의 텍스트 탭을 누르십시오 내가하고 싶은 것은 1 번 드롭 다운하여 붙여 넣기입니다 방금 복사 한 코드 이제 이미지를 조금 더 길게 만들지 만, 실제로 맞기 때문에 괜찮습니다 괜찮은 이미지 야 당신 그러니 그 말을 해봅시다

나는 더 많은 것을 읽었지 만 볼 수 있듯이 활동적이어서 우리를 구할 수 있습니다 변화들 당신 당신 비주얼 빌더를 종료하십시오 당신 당신 이 부분에 마우스를 가져 가면 더 많은 정보를 읽게되며 지금이 정보가 열립니다 그게 다 무슨 일이야 그것의 자신의 페이지의 일종에서 그것을 열어 내가 거기있어 정말로 관심이 없다고 생각하고 싶습니다 너를 위로 열어 라

이 실제 페이지의 상단에 있으므로 팝업으로 돌아가 보겠습니다 누가 왔어? 또는 팝업 나는 그것을 남겨두기 위하여 진짜로 저것을 저장에 흥미 있지 않다 거기에 두 페이지를 테스트 해보자 일단 우리가 팝업에 나타나면 내려 가서 보자 그리고 저는 그것을 열어주는 라이트 박스를 넣을 것입니다 우리가보고있는 것의 꼭대기에있는 라이트 박스는 다른 것들을 봐야합니다

당신은 당신에게 더 잘 어울리는이 것을 찾을 수 있습니다 그러나 그것은 제가 사용하기를 원하는 것입니다 그래서 나는 그것을 업데이트 할거야 당신 한 번 업데이트되면 내 페이지로 돌아갈 수 있습니다 우리는 빨리 새로 고칩니다

당신 더 많이 읽는 over-over 히트 그것이 실제로 그것을 터뜨렸습니다 페이지 자체를 통해 그들은 여전히 ​​백그라운드에서 페이지를 볼 수 있습니다 그런 다음 작은 닫기 버튼을 눌러 닫고 우리는 페이지 그래서 dimi 것을 가진 모달을 사용하는 방법은 정말 쉽습니다 효과적인 작은 도구는 그 버튼을 편집하지만, 나만 더 읽기 당신 당신 너와의 격차 그래, 이제 알았어 너와 비주얼 빌더를 나가라 이제는 CSS 클래스를 주었을 때 원하는 경우 CSS로 타겟팅 할 수 있습니다

그게 더 나아 보이지만 나는 그것을 가지고있어 그래서 이것을 검사 해보자 당신 팝 Z는 수업이었고 그래서 우리가하고 싶은 것은 그것을 갖자 당신 하지만 우리가 파란색 버튼 또는 그와 비슷한 것을 넣으면 배경 파랑 아마 그녀가 우리에게 말했던 것을 볼 수 없을 것이다 그래서 그것은 푸른 배경을 가지고있다 우리는 그 텍스트를 만들고 싶습니다

센터에서 우리는 배경을 보게 될 것입니다 패딩 (padding) : 상하 좌우 10 개 선택 20 개 선택 방법 찾고있어, 거기에 들어가자 나는 우리가 그 텍스트 센터를 만들고 싶다고 말할 수있는 것과 더 나이 들었던 숙녀가 말하기를 반올림 한 원인은 50 픽셀 좋아, 거기에 작은 파란 단추가있어 내가 그렇게 할거라고 말했어 텍스트를 중심으로 복사하면됩니다 우리가 추가 한 비트 만 커서를 복사 할 필요가 없다

그리고 나는 우리의 수업을 기억하고 싶다 Z는 우리의 Divi로 되돌아 가자 아래쪽에있는 옵션은 우리의 CSS입니다 그래서 들어 가자 한 쌍을 내려서 제목을 붙이세요

우리는 그것을 팝업 버튼이라고 부를 것입니다 거기서 타이틀을 닫고 Z는 클래스였습니다 클래스는 p o – p입니다 z 열리고 일부 중괄호를 닫습니다 그곳에있는 크롬 탐험가 크롬 검사관에게서 복사 된 괜찮아요

그래, 그 버튼에 약간의 호버 (hover) 효과를 주자 그래서 나는 복사 할 것이다 그 모든 것을 도트에서 닫는 중괄호에 추가하면 호버 컬이 추가됩니다 호버 위에 콜론 사이에 공백이 없어야합니다 패딩 또는 다른 무엇이라도 나는 배경색을 빨간색으로 표현할 것입니다

정말 상상력이 풍부합니다 여기서 색상을 지정하면 전환을 사용하여 실제로는 시간이 걸립니다 그것을하기 위해 나는 여기에서 아래로 전이 할 수있게했다 그래서 내가 그것을 간단히 베낄 것이다 거기에 우리가 간다

그리고 우리는 주인공에 그것을 넣을 필요가있다 호버 학급을 보지 마라 그러면 나는있다 아무 말도하지 말라 그래서 우리가 그렇게 할 때 3/4 초 안에 파란색에서 빨간색으로 바뀌어야합니다

그 말을 해봅시다 그리고 우리의 페이지로 돌아가서 새로 고침 우리의 검사관을 여기에서 제거하십시오 당신 우리가 가진 것은 우리의 버튼이 무엇인지 보아라 보시다시피 빨간색으로 변합니다 반응 적으로 내가하고 싶은 것은 그 텍스쳐를 중심으로하고 싶다 마지막으로 우리의 비주얼 빌더를 다시 사용할 수 있습니다

당신 거기에 우리가 가서 더 체크 마크를 확인하는 것 같아 당신 거기서 우리는 그 텍스트가 이제 그 버튼 안에 중심에 놓이게됩니다 그래서 나는 그걸로 꽤 행복해 따라 와야하고 너는 이것을 안다 그녀의 생체 또는 그와 비슷한 것일 수 있습니다

비주얼 빌더를 종료하십시오 당신 이 여자의 생체가 될 수 있다고 말한 것처럼 그것을 클릭하면 나머지 부분은 물론 할 수 있습니다 각각에 대해 다른 팝업을 작성하십시오 더 빨리하자 죄송합니다

어떻게 추가할까요? 내가 전에 만든 또 다른 하나를 가지고 있다는 것을 알고 있습니다 팝업 트리거 bio1이 우리가 만든 것이기는하지만 똑같이 생겼습니다 전에 당신 그리고 그것은 똑같은 종류의 팝 Z를 가질 것입니다 그래서 똑같은 일을 할 것입니다 버튼이 즉시 나타나야하고 우리가 ch3을 마지막으로 한 것은 무엇이라고 했습니까? 이제 우리가있는 텍스트를 살펴보고 거기에 모든 제목을 넣어 보겠습니다

거기에 팝업의 실제 아이디어가 있습니다 그래서 아마 당신은 만약 당신이 복사를 통해 이것을 다시 우리의 페이지 Mabel로 복사한다면 비주얼 빌더이다 당신 첫 번째 팝업이 두 번째 팝업과 정확히 동일하다는 느낌이 들었습니다 다른 것은 아니지만 그 코드를 여기에 붙여 넣으십시오 이번에는 텍스트 편집 탭에 있습니다

텍스트 센터를 원하겠습니다 확실한 강조가 다시 거기에있다 그리고 그것은 그 클래스를 가지고있다 팝 Z는 다른 것과 똑같아 보여야합니다 왜 오랫동안 거기에 더 이상 그래, 우리가 가서 왜 아마 하나 더 거기 아마 내가 괜찮아 짐작하지 않을 것 같다

그리고 그 이상 튜토리얼입니다 그러나 어쨌든 모달은 웹 사이트에 가지고있는 위대한 것들이고 내가 말하는 것처럼 포함되어 있지 않지만 사이트에 추가하는 것은 정말 쉽습니다 그것은 많은 시각적 인 건축업자를 끝내고 우리가 2 개의 다른 것을 가지고 있는지 보자 팝업 거기에 우리는 실제로 두 가지 다른 것들을 가지고 있다고 생각하지만 그들은 아마 제인 스미스의 첫 번째 파란색 셔츠와 똑같은 모습을 보입니다 제인 스미스 (Jane Smith)는 처음에는 녹색 셔츠 아래에 제목이 있다는 것을 보았습니다 그래서 그것은 다른 사람이 단지 그 제목인지 확인하고 싶었습니다

우리가 만든 모달을 클릭하여 모범을 보았습니다 거기에 왼쪽 라인과 두 번째 라인을 넣었 어 나는 그것을 Jane이라고 불렀다 스미스와 나는 센터에 제목을 써서 뭔가 다른 것과 정렬시켜야한다 두 가지 다른 모달이 거기에서 열리는 것을 보아라

우리 CSS는 이것들은 우리가 Z 클래스의 클래스를 제공했기 때문에 거기에 당신은 그것을 갖게했습니다 거기에 그만해라 그 날이 끝나기 전에 미안하지만, 정말 유용하다 작은 기능 그래서 나는 당신이 공유하고 싶다면 그것을 즐겼기를 바랍니다 우리의 YouTube 채널을 구독하십시오

당신은 웹 개발에 관심이 있습니다 훌륭한 무료 코스뿐만 아니라 거대한 할인 코스가있는 멋진 코스 우리 YouTube 가입자들에게 다시 한번 시스템 22의 제이미였습니다 기술 팁에 웹 디자인 사용 좋은 하루 되세요

Divi 3 – Hide elements on different screen sizes in the Divi WordPress theme menu

안녕 얘들 아, 다른 Divi 테마 자습서에 오신 것을 환영합니다 이것은 시스템에서 Jamie입니다 22 및 웹 디자인 및 기술 팁 침착하거나 누군가 내게 질문을 보냈습니다 제임스 그냥 물음표를 사용하는 질문 내용 텍스트를 표시하는 방법 데스크톱 혼자서 테스트 할 때 잘 Divi는 일을 쉽게 보이게하고 사라지게 만듭니다

여기 데모 웹 사이트를 조금 열어 보겠습니다 여기에 몇 가지 광고가 있습니다 비주얼 빌더를 사용하도록 설정합시다 제임스의 문제는 해결되지 않을 것입니다 그러나 저는 이것을 여러분에게 보여줄 것입니다

여러 가지 크기의 기기에서 물건을 사라지게하고 다시 나타나게하는 방법 데스크톱과 휴대 전화가 우리가있는 곳으로 돌아갈 때 흐려짐 이 모듈에 들어가서 우리가 여기 아래쪽으로 나아 간다면 당신은 그것을 볼 수있는 가시성을 볼 수 있습니다 휴대 전화 태블릿에서 어떤 모듈을 선택했는지 사라지게하십시오 바탕 화면을 선택하고 예를 선택하면 변경 사항이 저장됩니다 비주얼 빌더를 종료하십시오 그리고 지금 당신은 그 모듈을 보았습니다

왜냐하면 우리는 녹색 이었기 때문에 사라졌습니다 바탕 화면 버전에 있었는데 더 이상 볼 수 없으므로 화면을 축소하면 아래로 Google 크롬을 사용하고 있으므로 f12를 치고 개발자 도구를 구할 것입니다 여기있는 경위가이 작은 반응 형 탭을 여기에 부딪쳤다 이제 크기를 조정할 수 있습니다 이제 막 이동하지 않도록 조금만 볼 수 있습니다

더 나은 순간에는 더 좋지 않지만 작은 화면으로 크기를 조정하면 아마 1200보다 아래에서 다시 나타나지 않을 것입니다 우리가 위처럼 보이는다면 여기에 다시 나타납니다 79-78 이것은 꽤 전형적인 breakpoint bootstrap break points이다 WordPress하지만 bootstrap break points 99는 큰 것이므로 아마도 주위에 있습니다 거기 그것을 시도하자

하지만 991 좋아, 9 행 2로 변경하고 흥미가 없다 아홉 개가 아니기 때문에 존 브레이크 포인트라고 불린다 당신 그곳에 광산 980 이미 R이긴하지만 어쨌든 그렇게하지 않으면 그 일을 할 수 있습니다 제임스의 문제를 풀어주고 싶지만 그가 사라지 길 원한다 단지 이것을 원한다

비트가 바탕 화면에서 사라져서이 팩스를받지 못했다면 바탕 화면 크기가 없으므로 바탕 화면 크기를 조정할 수 있습니다 다시 그 작은 상자의 선택을 취소하십시오 당신 여기에 우리는 고급 광고 가시성에서 끝났습니다 그 작은 상자를 선택 취소하면됩니다 변경 사항 저장 후 되돌리기 그 반응 탭을 제거하면 우리의 작은 것들을 볼 수 있습니다

우리는 정말로하고 싶어하거나 제임스가하고 싶어하는 것은이 텍스트 비트를 제거하는 것입니다 여기 내가 그를 올바르게 이해하지만 그는 단지 데스크톱 버전에서만하고 싶어한다 그래서 우리는 여기서 미디어 쿼리를 사용해야합니다 그래서 제가 할 일은 제가 갈 것입니다 우리는 시각적으로 이것을 할 수 있지만 앞으로 나아가서 페이지로 들어갈 것입니다

여기에있는 편집장이 내 크롬 검사관을 없애 버리자 우리의 선전과 우리는 그것을 수업에 줄 것이다 그래서 우리는 Advanced 탭으로 갈 것입니다 이미 클래스가 있습니다 나는 제거하려고합니다

그 클래스의 레드 호버 국경에 대한 페이지를 볼 수 있기 때문에 우리가 거기에서 보여주고 있었던 그 불쾌한 빨간 테두리 때문에 나는 우리는 새로운 클래스를 제공하거나 데스크톱 드래 거에 데스크톱 마우스를 올립니다 너는 네가 원하는대로 기억할 수있어 불행히도 우리가 미디어 쿼리를 할 사촌 여기에 사용자 정의 CSS를 넣으십시오 내가 틀리면 여기에 미디어 쿼리를 넣을 수 없거나 방법을 찾지 못했다 아직 그렇게하지 않으려 고합니다 페이지를 업데이트하십시오

업데이트가 끝나면 우리의 견해를 재검토하고 우리가 알아 내고 싶습니다 저것은 어쩌면 저 선전용 내의 단 하나 원본 아마이다 그래서 나는이다 새로 고치려고하면 다시 검사원을 데려 올께 잘 클릭하십시오 나는 우리가 원하는 텍스트를 오른쪽 클릭하고 검사 할 것입니다 여기에 효과 그것을 보아라 그것은 단락 단락 텍스트이고 거기서 보자

바로 거기에 우리의 Dth 클래스가 있습니다 그래서 우리는 Dth와 P에 영향을 주어야합니다 우리가해야 할 일은 대시 보드로가는 것입니다 Divi를 강타합니다 이미 여기 있습니다

하지만 여기에 나와 있지 않으면 Divi를 확인하십시오 일반 탭에서 아래로 스크롤하면 사용자 정의를 찾을 수 있습니다 CSS 상자 바로 여기 작은 공간을 만들어 제목에 슬래시를 씁니다 스타 스타 슬래시는 나중에 데스크탑에서 쉽게 찾을 수있게 해줍니다 이제 우리는 P를 디스플레이 클래스로 제공 할 수 있다고 생각할 수 있습니다

그냥 해보지 만 효과가 없을거야 그래서 우리의 미디어 질의에서 처음에는 아마 1200 이하로 그것을하고 싶습니다 당신은 당신이 원하는 것을 무엇이든 넣을 수 있습니다 하지만 1200은 나를 위해 작동하므로 미디어 화면에 넣을 것입니다 그리고 나서 그냥 몇개의 일반 괄호를 열면 나는 나처럼 1200에 최소 너비로 넣을거야

네가 원하는대로 넣을 수 있다고 해 내가 980 전에 그것을 깨고 있다고 생각해 다른 하나는 당신이 여기에 놓은 다음 열어서 그 후에 중괄호를 닫으십시오 우리가 여기있는 누군가를 위해 우리가 말하고있는 미디어 쿼리를 수행하지 않은 것은 조회 가능한 영역의 너비가 최소 너비를 초과하는 화면 너비는 1200을 초과합니다 이 중괄호 사이에 넣은 픽셀은 모두 적용됩니다

지금 우리 수업은 dt 8 데스크톱 호버 Utley였습니다 그래서 그것은 클래스 점입니다 바탕 화면을 가리키면 여기에 더 많은 중괄호가 열립니다 내부에 있지만 우리가 영향을주고 싶은 클래스를하고 싶지는 않습니다 단락 텍스트이므로 단락을위한 D 번째 P입니다

나는 그것을 전시하지 않을 것입니다 1200 pix 이상에서 그들은 WIC에 있습니다 나는 거의 모든 데스크탑 화면입니다 원하는 것을 넣을 수는 있지만 대부분의 데스크톱 화면은 더 커질 것이라고 말합니다 그것보다 당신이 D th P 호버를 넣을 수있을 것이라고 생각할 것입니다

당신이 그것에 맴 돕니 다 왜냐하면 그가하고 싶은 것은 그것 위에 마우스를 올려 놓기 때문입니다 그리고 display : block하지만 블록이 표시되지 않습니다 저장이 페이지를 새로 고침으로 돌아 가자 당신 화면 크기를 줄이면 다시 사라집니다

그만큼 많이 떠난다 우리는 1200보다 아래로 갈 때 우리가 갈 때 거기에있는 것을 볼 수 있습니다 그 미디어 쿼리는 제가 거기에 넣었을 때 우리가 곧 우리가 11 54를 얻었습니다 1200 년에 다시 사라져야합니다 사라 졌어요

생각한다 데스크톱 호버업 P를 설치하고 호버 sudo를 지정하면 그 위에 마우스를 가져 가면 디스플레이로 돌아가서 만들 수 있습니다 기본적으로 꽤 정상적으로 디스플레이로 totes 및 당신은 당신이 줄 알았 겠지 이 일을 할 수는 있지만 이것은 효과가 없을 것입니다 그래서 내가 다시 새로 고침하면 우리는 내려갈 것이고 사라져야한다 오, 미안해 이제 우리가 다가 가면 사라져

네가 잘 생각해 그 위에 마우스를 올려 놓고 다시 가져 오지 만, 그럴 수는 없습니다 마우스를 올리면 표시 할 수 없기 때문에 표시되지 않기 때문입니다 그게 그렇게 작동하지 않을거야 우리가 할 일이 뭔가를 찾아 보자 그냥 투명하게 만들자

불투명도와 더 큰 값으로 표시하지 않으려면 불투명도 0 그것은 기본적으로 보이지 않습니다 이걸로 복사하면됩니다 다음 중 하나의 불투명도 완전히 눈에 띄고 당신은 1 점 2 점 3 점 4 점 5 점 6 점 7 점을 할 수 있습니다 불투명도를 매우 높이기 위해 8 개의 9 가지 정수를 저장하고 일단 사이트가 저장되면 우리 사이트는 녹색 체크 표시가 있고 이것을 새로 고칩니다 나는 우리가 그것을 12보다 크게 만들면 더 작은 리프레쉬를 해체 할 것이다

다시 사라지 겠지만, 이번에는 우리가 마우스를 가져 가면 위에 올려 놓으십시오 마우스를 올려 놓으면 나타납니다 클릭하여 마우스를 올리면 알 수 있습니다 전 화면에 마우스를 올려 놓으면 반응이 좋으니까요 우리가 거기에 나타나야 만한다

이제는 조금 더 천천히 전환하고 싶다면 전환을 추가 할 수 있습니다 대신에 075 초를 알고 있다고 말하십시오 우리가 쉽게 편하게 할 수있는 것처럼 뛰어 들며 우리는 편하게 쉬고 밖으로 나가서 내뱉기 만하면됩니다 사이트 새로 고침으로 돌아 가기 우리가 그 위에 마우스를 가져갈 때 좀 더 천천히해야합니다

거기에 쉽게 뛰어 들지 않고 편안함을 느낄 수 있습니다 변경 거기에 귀하의 질문에 대답을 바란다 텍스트 선전 텍스트가 나처럼 마우스를 가져 가면 바탕 화면에만 나타납니다 그 검사관을 다시 불러들이라고해라 이제 미디어 쿼리 인 1200보다 낮추면 그 수가 줄어 듭니다

우리가 간다 약 1200 년 전으로 돌아왔다 아직 그 위에 마우스를 갖다 대서 다시 가져올 수 있습니다 귀하의 의사 표시 텍스트가 사라지고 다양한 미디어 크기에 다시 나타납니다 비디오를 좋아하고 공유하고 싶다면 우리에게 유용했습니다

YouTube 채널 웹 개발에 관심이 있으시면 Google의 아래의 웹 개발 코스는 YouTube에 큰 할인 혜택을드립니다 구독자에게는 멋진 무료 코스가 있습니다 다시 한번 이것이 시스템 22의 Ben Jaime과 기술 팁 com의 웹 디자인입니다 보고있는 주셔서 감사합니다 좋은 하루 되세요

Divi 3 Example Media Queries in the Divi WordPress theme menu

안녕 얘들 아,이 Divi 튜토리얼에 오신 것을 환영합니다 이것은 시스템 22의 Jamie입니다 그리고 웹 디자인 테크 팁 통신 어제 우리는 우리가 그 비디오에서 비디오를 만들었습니다

일부 CSS 효과를 적용하고 일부 미디어 쿼리 사용 아 마의 이름으로 신사가 나에게 여기에 질문을했다 나는 내가 말하기를 바란다 너의 이름은 그가 미디어 쿼리에 대해 더 많이 배우고 싶다고 말했어 그래서 나는 그들이 우리가 그들을 사용하는 이유를 설명하는 비디오를 만들 것입니다 미디어 쿼리는 CSS이므로 WordPress를 사용하고 있습니다

Divi 테마를 사용하고 있습니다 WordPress를 사용하면 정말 멋지 네요 당신이 정말로 당신을 사용하는 것을 고려해야합니다 이 비디오 아래 링크에서 얻을 수 있지만 오늘 우리가하고있는 것은 순수 CSS입니다 부트 스트랩 사이트 나 HTML 사이트에서 적용 할 수있는 모든 사이트에서 작동합니다 CSS를 만들었 기 때문에 조금 만들었습니다

여기에 열 E 개의 주요 제목과 약간의 텍스트가있는 세 개의 작은 텍스트 상자 그 (것)들에서 당신은 볼 수있는 화면 크기를 가지고있는 미디어 쿼리가 무엇인지 사람들이 우리 스크린을보고 있다면 당신은 잘 말할 수 있습니다 이 일이 일어나길 원하거나이 크기와이 크기 사이에 있다면 일어나서 내가 이것을 좋아하는지 보여 주자 실제 장식이없는 네 개의 보통 텍스트 블록이 있거나 여기에 무슨 일이 있어도 내 선택권은 좋아 내 사용자 정의 CSS 필드는 내가 Divi를 사용하고 있다고 말했듯이, 코드를 사용하고 있다면 Divi 일반 탭을 사용자 지정 CSS에서 다른 많은 테마를 느낄 수 있습니다 일반적으로 사용자 정의 CSS 필드가있는 사용자 정의 외관은 지금 약간의 공간을 만들어 보자

그것은 내가 미디어라고 부르는 제목입니다 제목을 부여하는 것이 항상 좋은 생각입니다 나중에 슬랩 스타 스타 슬래시를 찾을 수 있습니다 따옴표로 묶어 브라우저가 코드를 다르게 읽지는 않습니다 장치의 너비가 다른 화면이 있으며 예를 들어 데스크톱 24 인치 화면에서 볼 때 아마도 그것은 아마 내가 1900 년을 1080 픽셀로 추측하는지 모릅니다

그런 식으로 뭔가를 말해 줄 수있는 비디오 해상도를 확인할 수 있습니다 물론 우리 iPad는 훨씬 작아서 생방송으로되어있을 것입니다 훨씬 작아서 상황을 다르게 표시하고 싶을 수도 있습니다 여러 번 볼 수 있기 때문에 기기 크기가 다릅니다 아마 데스크톱에서 보았을 때 또는 제 위치에있을 때 숨 막힐 듯합니다

그들은 전화로 자리를 잡지 못할 것이므로 전형적인 미디어 쿼리를 추가합시다 실제로 미디어 쿼리는 실제로 아래에 하나 있습니다 그래서 당신은 항상 그 미디어로 시작합니다 매체에서 다음 화면을 말한 다음 일반 대괄호 세트를 엽니 다 그리고 여기 안에는 미디어 쿼리를 넣으려는 곳이 있습니다

거기에 두 배가 있어요 나는 그렇게 할 수 없을거야 내가이 순간에 그렇게 할거야이 크기 사이에 말이야 이 크기는 이러지 만 멕시크 폭으로 시작 하겠어

그냥 갈거야 1200 사진을 말하자면 내가 말하는 것은 화면이 크기는 가능한 한 최대 폭을 의미합니다 그 후 나는 단지 열리고 닫히는 1200의 사진의 안에서 지금 일부 중괄호와 여기에 넣은 것도 있습니다 적용될 필요가 없습니다 이제 분명히 적용될 것입니다

최대 너비를 가진 1,200 개의 그림 화면보다 작은 화면 1,200보다 작거나 같아서 여기에 우리가 얻은 것을 보자 작은 텍스트 블록은 그에게 클래스를 주어 실제로 목표를 지정할 수 있습니다 여기에 몇 가지 CSS가 있습니다 여기 Divi 테마에 관해서 설명 드리겠습니다 mq-1 클래스 예 미디어 쿼리에 대해 동일한 작업을 수행 할 것입니다

너는 네가 바라는대로 네가 원하는대로 네가 원하는대로 네가 원하는 것을 기억해 나는이 다른 것들에 대해서도 똑같이 할 것입니다 너 너 우리는이 방법으로 CSS는 그들이 이름을 가지고 있기 때문에 당신이 원한다면 그에게 이름을 부여하는 것과 같습니다 그걸 업데이트해라

지금 우리가 페이지 자체를 보면 꽤나 잘 알고 있습니다 이것을 증명하기 위해 저는 극적으로 CFS를 조금만 할 것입니다 f12 키를 눌렀을 때 무슨 일이 일어나고 있는지 확인해주세요 브라우저에서 Google 크롬을 사용하고 있습니다 f12를 클릭하면 inspector 개발자 도구 검사원이 나타납니다

그리고 반응하는 탭이 있습니다 일단 당신이 그것을 치면, 물건을 끌어서 내리고 밖으로 내밀어서 당신은 그것을 축소하고있는 것을 볼 수 있습니다 서로 붕괴되고 있습니다 위대한 것은 여기에 있습니다 그 번호의 실제 너비는 내가 그 번호를 뽑을 때 처음으로 번호가 매겨집니다

올라간다 다시 밀어 내려 가라 좋습니다 그래서 우리는이 모든 것을 제공 한 몇 가지 미디어 쿼리를 보여 드리겠습니다 mq-1의 이름입니다

나는 이것이 내가 그들에게 준 것이라고 믿습니다 그래서 무언가를 만들어 봅시다 방금 쓴 Nydia 쿼리는 1200 세 미만 이었으므로 뭔가를 만들자 1200 이하로 내려 가서 사용자 정의 CSS로 돌아가 보겠습니다 그래서 우리는 클래스에 mq-1을주었습니다

클래스 도트와 mq-1이라는 이름이 붙었습니다 중괄호를 열고 닫으십시오 여기서 CSS를 넣을 수 있습니다 그래서 우리 사이트를 보면 순간적으로 뭔가를 극적으로 보냅시다 아무 일도 일어나지 않습니다

이미지를 마우스 오른쪽 버튼으로 클릭하고 검사하면 이미지가 나타납니다 IMG 이미지가 있고 제목 태그를 마우스 오른쪽 버튼으로 클릭하여 검사하면 h2 그리고 당신은 단지 P가 될 것입니다 몇 단락 텍스트를 가지고있어 거기에 P가 강조 표시되었으므로 우리는 모든 것을 개별적으로 말할 수 있습니다 여기 전체 블록을 대상으로하므로 CSS를 추가해 보겠습니다 배경을 파란색으로 보자 텍사스 의사가 텍스트 라이트를 만들어 봅시다

우리는 잠시 그 ​​것을 떠날 것입니다 아니면 모든 것을 목표로 삼고 있습니다 이제 Elia 질의 중 하나의 키가 그 안에있는 텍스트를 대상으로 삼을 것입니다 단락 본문을 열어서 왜 그렇게 다시 열어서 곱슬 머리를 닫아야하는지 생각해 봅시다 괄호 한 번 흰색 FFF 6f 색상을 지정하고 이제 해당 제목을 대상으로합시다

그것은 미디어 쿼리 하나는 블록이고 내부는 h2 열기 닫기이며 curlies는 내가 노란색을 볼 필요가 없다는 것을 확인한다 그것은 단지 보일 것이다 이상하지만 거기에 우리는 괜찮아 그래서 그게 무슨 일이 일어나는지 보자 꽤보기 흉하게하자 우리의 변화를 저장하고 다시 HTML 사이트 또는 부트 스트랩 사이트를 사용하여 스타일에 넣을 수 있습니다

시트 또는 인라인으로 페이지 상단에 넣을 수 있습니다 이제 우리가 페이지로 돌아 가면 빨리 새로 고칩니다 이제 우리가 1454에있을 때 내가 1200보다 아래로 수축하면 재생할 이러한 변경 사항 그래서 여기에 배경이 사라진 것을 볼 수있는 12 9450 붐이 있습니다 지금 h2가 작동하지 않았다 하지만 배경이 바뀌고 텍스트가 흰색으로 바뀌는 것을 보았습니다

거기에 여분의 V가있는 이유는 무엇입니까? 이제는 물건을 표시하기 때문에 사용자를 말하는 것처럼 많은 용도로 사용됩니다 다른 기기에서 다르게 사용하면 네가 괜찮 으면, 더 잘 보일거야 그건 노란색이에요 옅은 황색이라고 말할 수 있는지 모르겠군요 하지만 약간의 패딩을 우리가 약간의 패딩을하고 싶습니다

거기에는 패딩이 없기 때문에 거기에 있습니다 당신 patek 내가 그것을 좋아하는 것처럼 조금 더 잘 보이게하기 위해 15 명의 사진의 종류를 줘라 이게 데모라고 말하면서 어떻게 될지 너무 걱정하지 않아요 알았어 그래서 거기에 그저 조금 더 아래로 움직일 것입니다

그것은 단지 텍스트 주위에 약간의 덧붙임을 추가했기 때문에 약간 분리되어 있습니다 괜찮아요 일단 우리가 12 이상으로 올라 가면 그것은 12 세 이하 였고, CSS를 할 수있는 것이 었습니다 다른 미디어 쿼리 및 이번에 다시 변경하자 작은 장치 및 텍스트를 오른쪽으로 정렬하자

추측해서 나는 이것을 단지 복사 할 것입니다 줄을 내리다 거기에 우리가 간다 나는 지금 그것을 복사했다 나는 말하기 위하여 말할 것이다 900가 보자 이 배경을 녹색으로 만들어 봅시다 국경을 넘겨 주자 국경을 넘겨 줘 나는 단단히 선택하게된다

당신 코딩 할 때 철자를 잘못 쓰면 기억하십시오 일들은 괜찮은 패딩을 잘하는 경향이 없습니다 여기 텍스트가 이번에는 노란색으로 만들어 보겠습니다 거기에 해시 태그가 필요하지 않습니다 우리는 색상을 사용하고 있습니다

센터에 텍스트를 저장하면 저장됩니다 텍스트 정렬 : 가운데 네가 알고있는 전투 바탕 화면에서 왼쪽으로 정렬하면 멋지게 보일 수 있습니다 하지만 휴대 전화에서는 계속 진행되기 때문에 중앙 집중식으로 원할 수 있습니다 거의 더 작은 스크린이 될 것입니다

당신 우리가 이미지를 갖고 싶지 않기 때문에 우리 사이트를 살펴보기로 결정할 수도 있습니다 여기에서는 지금은 아무 것도하지 않을 것입니다 900 번 이미지를 우클릭하면이 이미지가 잘 사라지기를 바란다 그것이 IMG인지는 알지만 IMG가 우리가 이미지를 만들 수 있다고 말할 수는 없습니다 더 커지거나 사라지게 만들 수 있습니다

나는 그것을 사라지게 만들 것입니다 그래서 그것은 mq 1 + OMG가 거기에있는 이미지 일 것입니다 다양한 기기에서 사이트를 맞춤 설정하기위한 더 많은 옵션 책임감있게 그 일을 알게 해줄 수 있습니다 내 말을하자 우리 사이트로 돌아 간다

나는 다시 12 번 새로 고쳐야 겠어 이제 우리가 12 세가되면 배경은 파란색 텍스트 흰색 등으로 갈 것입니다 우리는 9 이하로 내려갑니다 9는 녹색 배경을 켜야합니다 그 이미지가 사라져야합니다

그렇게 해보겠습니다 우리는 우리가 본 12에 이르렀습니다 이미 9시 아래로 내려 가자 거기에 배경이 녹색으로 바뀌고 이미지를 볼 수 있습니다 사라지고 그냥 센터 정렬하자

각각은 암소를 채색한다 당신 당신 우리는 거기에 갈 그리고 두 값을 다른 값으로 넣을 수 있습니다 당신 예를 들어 여기에 다시 들어가서 미디어 쿼리에 900을 물어볼 것입니다 이걸 다시 복사하자 논쟁이 말한다

우리가 600과 700 사이에서 일어날 일이 아마 효과가 없을 것이라고 말하지만 예제로 오, 내가 그것을 두 번 복사하자 그걸 없애 버리자 800 번 최대 폭 사이에 806 백분의 일이므로해야합니다 그 다음에 그 다음에 더 많은 정규 괄호를 추가하면됩니다 최소 너비 우리가하는 말의 908 백분의 600 600pics 좋아

그래서 우리가 거기에서 약간의 여분의 공간을 만들었습니다 우리는 그것을 말하고 있습니다 화면의 최대 너비는 800이고 최소 너비는 600이므로 최소 600 개의 최소 800 가지 종류의 작은 태블릿 또는 그와 비슷한 것 또는 심지어 우리가 뭔가 일이 일어나길 원한다는 큰 전화는 이렇게 말하죠 우리가 볼 수있는 것을 아주 붉게 만들어서 아주 추악한 것을 볼 수 있습니다 사이트 패딩은 패딩을 10 단계까지 떨어 뜨립니다

가자 노란 경계 P와 우리의 텍스트가 전혀 표시되지 않도록합시다 그래서 나는 단지 display : none을 넣었다 우리는 그것을 중심으로 유지할 것입니다 아마도 우리는 너를 볼 수 있도록 물건을 돋보이게하려고 다시 한번 노란 색으로 만들어라

이번에는 중심에있는 일이 멀다 우리의 이미지를 더 크게 만들자 우리의 이미지가 너비와 높이로 만들어 보자 그래서 순간은 150×150입니다 생각합니다

깃발을 던지고 있다는 것을 알고 있습니다 거기에 노란 색으로 노란 색을 칠하면 그는 동시에 말하는 타입이 될 수 있습니다 좋아, 그래서 우리가 뭐라 말할지라도 우리는 너비와 높이를 줄거야 250 속성을 가정 해 봅시다 정사각형 이미지인지 높이인지는 모르지만 250을 놓아 두어 그것을 확보 할 수는 있지만 그것을 왜곡하지는 않습니다

데모 용일 뿐이에요 좋아 우리가 여기서 한 일이 그 아래에있는 다른 것을 보자 그래서 우리는 가고있다 800 ~ 600 pix 사이에서 이것을 원한다

우리가 저장 한 우리의 사이트로 돌아가 봅시다 상단 그래서 파란색 1200 900은 녹색이고 이미지 없음 거기 그것이 있고 지금 우리는 800에서 600까지 우리는 텍스트 이미지를 원하지 않는다고 말했습니다 250보다 커야하고 우린 여전히 제목이나 신념을 가지고 있으므로 거기 가서 우리는 어떤 이유로 든 이미지가 없다 우리는 노란 경계와 제목을 얻었다 왜 우리는 아무런 이미지도 얻지 못했다

다시 표시하라는 말 우리가 너를 간다 당신 약간의 여백이있다 나는 그것에게 정상에 부정적인 여백을 줄 것이다 그 상자에 다시 넣을거야 당신 당신 거기에 우리가 다시 들어가서 괜찮아

우리가 그 멍청 했어 제목 아래 이미지가 축소 되어도 이미지가 표시되지 않고 이미지가 아래로 떨어지면 오직 6 ~ 8 백 명 정도의 사람들 만이 그렇게하기를 원한다 우리는 600 이하로 떨어집니다 그 전의 상태로 되돌아갑니다 당신 네가 끝내려면 600 이하의 모든 것을 말할 수있을거야

나는이 한 번 더있을거야 그래서 600 이하로 떨어지려면 최대 너비 600 이제는 우리가 최소로 제거 할 수 있습니다 왜냐하면 우리가 정말로 영향을 미치기를 원하지 않기 때문입니다 아무것도 우리는 배경을 말할 것이다 : 백색 당신이 무엇을 원 하든지 당신이 무엇을 원 하든지간에 그것은 패딩을하고 싶습니다 너무 많이 거기에 있었고, 나는 이쑤시게 입체를 샀다

우리는 우리의 텍스트를 되 찾을 것입니다 각각의 말 도서관 너 우리는 그것을 중심 이미지로 유지할 것이다 우리가 거기서 먹어서는 안된다고 말하면 돼 사실 나는 그것을 버리고있어 이미지가 단지 기본 설정이라는 것을 보여주고있다 이제 거기에 마지막으로 닫는 중괄호를 쓰고 싶지 않습니다

미디어 쿼리를 수행 할 때마다 결국에는 CSS를 넣을 때는 항상 한 번만, 실제 미디어가 들어있는 경우에는 한 번만 사용할 수 있습니다 질의 자체는 이제 어떻게되는지 보자 우리는 다시 그릴 것입니다 이 빨간 비트가 여기있는 이유는 그 이미지를 두드리고 있었으니 그냥 해보 죠 이 섹션에 빨리 있었기 때문에 그 10 명의 사진을 잘 만들자

당신 효과를 내기 위해 25 개의 사진을 만들어 보겠습니다 좋아, 우리가 그 위로 가기 새로 고침을 취소 저장 우리는 그것을 크기로 끌어 내리기 시작할 것입니다 그래서 우리는 일어날 일을 알고 있습니다 그곳에 900 거기에있을 것입니다 그리고 800에서 600 사이에 우리가 간다 그래서 즉시 넓이와 높이를 부여했습니다

실제 너비보다 더 큽니다 요소 자체 그 다음 600 이하 그래서 우리는 그 텍스트를 검정색으로 만들었습니다 당신 여보세요 600 오줌 마저 우리가하지 않았어 아무것도 표시하지 않고 방금 다시 표시하도록했습니다 좋습니다

당신 거기에 우리는 포터도 거기에 간다 우리가 방금 더 작은 것을 말했기 때문에 그것이 바뀌지 않을지라도 600 명이 넘는 사람들은 똑같은 일을하기를 원한다 그러면 우리는 600 명을 되돌릴 것이다을 더한 그래서 나는 당신을 위해 사물을 설명하기를 바란다 미디어 쿼리는 귀하의 사이트 사용자 경험을 사이트는 계속해서 건물과 건물을 유지하고 건물을 짓고 다른 건물을 만들 수 있습니다 작은 화면과 큰 화면에서 일이 발생하여 사용자가 최고의 경험을 얻고 모든 것을 읽을 수있다 가능한 한 최선의 방법이 있으므로 간단한 설명이 있습니다

당신과 당신이 CSS로 할 수있는 모든 것들에 대한 미디어 쿼리에 대한 설명 미디어 쿼리 내부에서 좋은 효과를 얻을 수 있기를 바랍니다 그게 도움이되었습니다 우리 채널을 구독하고 당신이 웹 디자인에 관심이있는 경우 이것을 즐긴다면 비디오 아래의 웹 디자인 코스 중 하나는 YouTube 구독자에게는 멋진 무료 코스가 한 번 있습니다 다시 이것은 시스템 22의 jamie와 기술 팁의 웹 디자인에 감사드립니다 보고 좋은 하루 되세요