WordPress에서 이미지 위에 텍스트를 추가하는 방법(3가지 방법)

최근 게시물 게시판 wordpress WordPress에서 이미지 위에 텍스트를 추가하는 방법(3가지 방법)

  • WordPress의 이미지 위에 텍스트를 추가하시겠습니까?

    텍스트 오버레이는 이미지에 대한 몇 가지 추가 정보를 제공하는 좋은 방법입니다. 또한 배너, 헤더 및 온라인 광고까지 빠르고 쉽게 만들 수 있습니다.

    이 기사에서는 WordPress에서 이미지 위에 텍스트를 추가하는 방법을 보여줍니다.

    WordPress에서 이미지 위에 텍스트 추가

    이미지는 WordPress 웹사이트를 더 흥미롭게 보이게 하고 텍스트의 큰 단락을 나누는 데 도움이 됩니다.

    그러나 때로는 이미지에 더 많은 설명이 필요할 수 있습니다. 예를 들어 이미지 위에 텍스트를 추가하여 이미지가 표시하는 내용과 이미지를 게시물에 추가한 이유를 설명할 수 있습니다.

    많은 워드프레스 블로그 또한 이미지 위에 텍스트를 추가하여 눈길을 사로잡는 유익한 배너와 헤더를 만드십시오.

    이 게시물에서는 WordPress에서 이미지 위에 텍스트를 추가하는 세 가지 방법이 있습니다. 특정 방법으로 바로 이동하려는 경우 아래 링크를 사용할 수 있습니다.

    WordPress에서 이미지 위에 텍스트를 추가하는 한 가지 방법은 다음을 사용하는 것입니다. 커버 블록. 이 블록을 사용하여 이미지를 표시한 다음 이미지 위에 텍스트를 입력할 수 있습니다. 따라서 Cover 블록은 영웅 이미지, 헤더 및 배너를 만드는 데 적합합니다.

    페이지나 게시물에 표지 블록을 추가하려면 WordPress에서 더하기(+) 기호를 클릭하기만 하면 됩니다. 블록 편집기.

    이제 ‘커버’를 입력하고 표시될 때 올바른 블록을 선택할 수 있습니다.

    워드프레스 커버 블록

    기본적으로 Cover 블록에는 자리 표시자 이미지와 일부 자리 표시자 텍스트가 있습니다.

    기본 이미지를 바꾸려면 이미지를 클릭하여 선택하기만 하면 됩니다. 완료했으면 ‘바꾸기’ 버튼을 클릭합니다.

    WordPress에서 이미지 위에 텍스트를 추가하는 방법

    이미 있는 이미지를 사용하려면 워드프레스 미디어 라이브러리을 클릭한 다음 ‘미디어 라이브러리 열기’를 클릭하기만 하면 됩니다. 그런 다음 기존 이미지를 선택할 수 있습니다.

    새 이미지를 업로드하려면 대신 ‘업로드’를 클릭하세요.

    WordPress Cover 블록에 이미지 업로드

    그러면 컴퓨터에서 파일을 선택할 수 있는 창이 열립니다.

    이미지를 선택한 후 블록 설정을 사용하여 흥미롭고 눈길을 끄는 효과를 만들 수 있습니다. 예를 들어 방문자가 페이지를 스크롤할 때 이미지를 제자리에 고정하거나 이미지에 색상 오버레이를 추가할 수 있습니다.

    컬러 커버 오버레이

    오버레이를 사용하는 경우 ‘불투명도’ 슬라이더를 사용하여 오버레이의 불투명도를 변경할 수 있습니다. 불투명도 설정은 배경 이미지의 투명도를 제어합니다.

    이미지가 마음에 들면 텍스트를 추가할 준비가 된 것입니다.

    기본적으로 Cover 블록에는 이미지 위에 텍스트를 추가할 수 있는 Heading 및 Paragraph 블록이 있습니다.

    WordPress에서 이미지 위에 텍스트를 추가하는 방법

    일부 텍스트를 추가하려면 제목 또는 단락 블록을 클릭하여 선택하기만 하면 됩니다. 그런 다음 사용하려는 텍스트를 입력하십시오.

    이미지 위에 텍스트를 추가하면 해당 텍스트를 읽기 어려울 수 있습니다. 이것은 시력이 좋지 않은 방문자에게 특히 해당됩니다. 자세한 내용은 다음 가이드를 참조하십시오. WordPress 사이트의 접근성을 개선하는 방법.

    즉, 읽기 쉽도록 텍스트의 스타일을 지정할 수 있습니다.

    제목 블록으로 작업하는 경우 다른 제목 스타일을 시도하여 가장 읽기 쉬운 제목 스타일을 확인할 수도 있습니다.

    WordPress 이미지 위에 텍스트 스타일 지정

    대비되는 색상을 사용하여 텍스트를 돋보이게 할 수도 있습니다.

    다른 색상을 선택하려면 오른쪽 메뉴에서 ‘차단’ 탭을 선택합니다. 그런 다음 ‘색상’을 클릭하여 이 섹션을 확장합니다.

    완료했으면 ‘텍스트’를 클릭하십시오. 그러면 블록의 모든 텍스트에 대해 새 색상을 선택할 수 있는 팝업이 열립니다.

    이미지 위의 텍스트 색상 변경

    일반적으로 텍스트가 클수록 읽기 쉽습니다.

    텍스트를 더 크게 만들려면 ‘크기’ 옆에 있는 필드를 클릭한 다음 이 필드에 더 큰 숫자를 입력합니다.

    WordPress에서 이미지 위에 텍스트 추가

    표지 블록이 마음에 들면 평소처럼 페이지를 게시하거나 업데이트할 수 있습니다. 이제 웹사이트를 방문하면 이미지 위에 텍스트가 표시됩니다.

    방법 2. 이미지 블록을 사용하여 이미지 위에 텍스트를 추가하는 방법

    Cover 블록은 배너 및 헤더를 만드는 데 적합합니다. 그러나 표준 WordPress 이미지 블록 위에 텍스트를 추가할 수도 있습니다.

    시작하려면 다음을 수행해야 합니다. 이미지 블록 추가 귀하의 페이지 또는 게시물에. 이렇게 하려면 WordPress 블록 편집기에서 더하기(+) 기호를 클릭하기만 하면 됩니다.

    그런 다음 ‘이미지’를 입력하고 올바른 블록을 선택하여 게시물에 추가할 수 있습니다.

    WordPress 이미지 블록

    그런 다음 컴퓨터에서 이미지를 업로드하거나 미디어 라이브러리를 클릭하여 WordPress 미디어 라이브러리에서 이미지를 선택할 수 있습니다.

    이미지를 선택한 후 위에서 설명한 동일한 프로세스에 따라 초점을 변경하고 오버레이를 추가하고 불투명도를 변경할 수 있습니다.

    다른 ‘고정 배경’ 및 ‘반복 배경’ 슬라이더를 사용하여 이미지 블록에 가장 적합한 것이 무엇인지 확인할 수도 있습니다.

    이미지가 마음에 들면 ‘이미지 위에 텍스트 추가’ 버튼을 클릭하십시오.

    WordPress에서 이미지 위에 텍스트 추가

    이렇게 하면 텍스트를 입력할 수 있는 영역이 추가됩니다.

    이미지에 따라 방문자가 텍스트를 읽는 데 어려움을 겪을 수 있습니다. 여기에서 위에서 설명한 동일한 프로세스에 따라 텍스트를 굵게 만들거나 색상을 변경하는 것이 도움이 될 수 있습니다.

    WordPress에서 텍스트 색상 변경

    텍스트를 더 크게 만들 수도 있습니다.

    이렇게 하려면 오른쪽 메뉴에서 ‘크기’ 섹션을 찾으십시오. 그런 다음 다른 숫자를 클릭하여 텍스트를 더 크거나 작게 만들 수 있습니다.

    텍스트 크기 늘리기

    텍스트와 이미지가 마음에 들면 임시 저장, 업데이트 또는 게시를 클릭하여 변경 사항을 저장합니다.

    방법 3. 이미지 위에 텍스트가 있는 사용자 지정 페이지 레이아웃을 만드는 방법

    내장된 WordPress 블록은 WordPress에서 이미지 위에 텍스트를 추가하는 빠르고 쉬운 방법입니다. 그러나 완전히 맞춤형 페이지 디자인을 자유롭게 만들려면 페이지 빌더 플러그인이 필요합니다.

    SeedProd 이다 최고의 WordPress 페이지 빌더 플러그인 시장에. 전체 웹사이트에서 이미지 위에 텍스트를 추가할 수 있습니다.

    메모: 이있다 SeedProd 무료 버전하지만 이 가이드에서는 더 많은 기능이 있는 Pro 버전을 사용합니다.

    먼저 SeedProd 플러그인을 설치하고 활성화해야 합니다. 자세한 내용은 단계별 가이드를 참조하세요. WordPress 플러그인을 설치하는 방법.

    활성화 시 SeedProd 라이선스 키를 입력해야 합니다. 로그인하면 이 키를 얻을 수 있습니다. SeedProd 계정. 그런 다음 ‘다운로드’ 탭을 클릭합니다.

    이 작업을 완료하면 ‘라이선스 키’ 섹션에서 키를 복사할 수 있습니다.

    SeedProd 다운로드 페이지

    이제 다음으로 이동하여 이 키를 WordPress 관리 영역에 붙여넣을 수 있습니다. SeedProd » 설정 페이지.

    여기까지 왔으면 ‘라이센스 키’ 필드에 키를 붙여넣으세요.

    SeedProd 라이선스 확인

    그런 다음 ‘키 확인’을 클릭하기만 하면 됩니다.

    그 후에 우리는 다음으로 넘어갈 것입니다. SeedProd » 방문 페이지새 방문 페이지 추가를 클릭합니다.

    SeedProd의 페이지 디자인 템플릿

    다음 작업은 페이지의 시작점이 될 템플릿을 선택하는 것입니다. 어떤 SeedProd 템플릿을 선택하든 웹사이트와 브랜딩에 완벽하게 맞도록 템플릿의 모든 부분을 사용자 정의할 수 있습니다.

    빈 캔버스로 시작하려는 경우 빈 템플릿을 클릭할 수 있습니다.

    SeedProd 기성 템플릿

    모든 이미지에서 Tasty Squeeze Page 템플릿을 사용하고 있습니다. 더 많은 구독자 확보 캠페인.

    사용할 템플릿을 찾으면 그 위에 마우스를 가져갑니다. 그런 다음 ‘미리보기’ 아이콘을 클릭할 수 있습니다.

    SeedProd의 전문적으로 디자인된 템플릿

    그러면 템플릿의 미리보기가 표시됩니다.

    이 템플릿이 마음에 들면 ‘이 템플릿 선택’ 버튼을 클릭하세요.

    리드 생성 및 스퀴즈 템플릿

    ‘페이지 이름’ 필드에 페이지 이름을 입력합니다.

    기본적으로 SeedProd는 이 이름을 페이지의 URL로 사용합니다. 자동으로 생성된 이 URL을 변경하려면 ‘페이지 URL’ 필드의 텍스트를 수정하기만 하면 됩니다.

    SeedProd로 맞춤형 페이지 레이아웃 만들기

    입력한 정보가 만족스러우면 ‘저장 및 페이지 편집 시작’ 버튼을 클릭하십시오. 그러면 SeedProd의 끌어서 놓기 편집기에서 템플릿이 열립니다.

    왼쪽 메뉴에는 끌어서 놓기를 사용하여 페이지에 추가할 수 있는 모든 블록과 섹션이 표시됩니다.

    SeedProd 디자인에 블록 추가하기

    빈 템플릿을 사용하지 않는 한 SeedProd 페이지에는 이미 일부 블록과 섹션이 있습니다. 이 콘텐츠를 편집하려면 블록이나 섹션을 클릭하여 선택하기만 하면 됩니다.

    이제 SeedProd의 왼쪽 메뉴에 이 블록이나 섹션을 사용자 지정하는 데 사용할 수 있는 모든 설정이 표시됩니다. 다음 이미지에서 볼 수 있듯이 헤드라인 블록을 클릭하면 이 블록에 표시되는 텍스트를 변경할 수 있습니다.

    기성품 SeedProd 페이지 디자인 사용자 정의

    이미지 위에 텍스트를 추가하는 가장 쉬운 방법은 SeedProd의 기성품 Hero 섹션 중 하나를 사용하는 것입니다.

    이 섹션에는 일부 자리 표시자 텍스트가 맨 위에 추가된 자리 표시자 배경 이미지가 있습니다. 기본 배경 이미지와 텍스트를 자신의 콘텐츠로 간단히 바꿀 수 있습니다.

    시작하려면 SeedProd의 왼쪽 메뉴에서 ‘섹션’ 탭을 클릭하십시오.

    그런 다음 ‘영웅’을 클릭하여 페이지에 추가할 수 있는 기성품 영웅 섹션을 모두 볼 수 있습니다.

    SeedProd 섹션 템플릿

    이러한 섹션 템플릿을 미리 보려면 템플릿 위로 마우스를 가져간 다음 돋보기 아이콘을 클릭하기만 하면 됩니다.

    계속해서 이 영웅 섹션을 디자인에 추가하려면 ‘이 섹션 선택’을 클릭하십시오.

    SeedProd 영웅 템플릿

    다음으로 템플릿의 스톡 이미지를 자신의 이미지로 교체하고 싶을 것입니다. 그렇게 하려면 스톡 이미지를 클릭하여 선택하기만 하면 됩니다.

    그런 다음 SeedProd의 왼쪽 메뉴에서 휴지통 아이콘이 나타날 때까지 ‘배경 이미지’ 미리보기 위로 마우스를 가져갑니다.

    그런 다음 이 아이콘을 클릭하여 자리 표시자 이미지를 삭제할 수 있습니다.

    SeedProd에서 배경 이미지 삭제

    그런 다음 ‘자신의 이미지 사용’을 클릭하십시오. 그런 다음 WordPress 미디어 라이브러리에서 이미지를 선택하거나 스톡 이미지를 사용할 수 있습니다.

    SeedProd는 수천 개의 로열티 프리 스톡 이미지. SeedProd의 스톡 이미지 라이브러리를 살펴보려면 ‘스톡 이미지 사용’을 클릭하세요.

    검색 창에 찾고 있는 이미지를 설명하는 단어나 단계를 입력하고 ‘검색’ 버튼을 클릭합니다.

    SeedProd 스톡 이미지 선택

    SeedProd는 이제 검색어와 일치하는 모든 스톡 이미지를 표시합니다.

    디자인에 추가하고 싶은 이미지를 찾으면 클릭하기만 하면 됩니다.

    SeedProd의 스톡 이미지 라이브러리

    이미지를 추가했으면 자리 표시자 텍스트를 바꿀 준비가 된 것입니다.

    이렇게 하려면 텍스트 블록을 클릭하여 선택합니다. 그런 다음 ‘텍스트’ 영역에 사용하려는 텍스트를 입력하기만 하면 됩니다.

    SeedProd를 사용하여 이미지 위에 텍스트 추가

    SeedProd의 영웅 템플릿 중 일부에는 행동 유도 버튼과 같은 추가 콘텐츠가 있습니다.

    이 콘텐츠를 변경하시겠습니까? 그런 다음 블록을 클릭하여 선택한 다음 SeedProd의 왼쪽 메뉴에서 변경하기만 하면 됩니다.

    SeedProd 텍스트 편집

    또 다른 옵션은 영웅 템플릿에서 블록을 삭제하는 것입니다.

    이렇게 하려면 블록을 클릭하여 선택한 다음 휴지통 아이콘을 클릭하기만 하면 됩니다.

    SeedProd 섹션 및 블록 삭제

    페이지 디자인이 마음에 들면 ‘저장’ 버튼을 클릭할 수 있습니다.

    여기에서 페이지를 게시하거나 템플릿으로 저장할 수 있습니다.

    SeedProd 디자인 게시

    SeedProd로 맞춤형 페이지 레이아웃을 만드는 방법에 대한 자세한 내용은 다음 가이드를 참조하세요. WordPress에서 랜딩 페이지를 만드는 방법.

    이 기사가 WordPress에서 이미지 위에 텍스트를 추가하는 방법을 배우는 데 도움이 되었기를 바랍니다. 당신은 또한 우리의 가이드를 통해 갈 수 있습니다 최고의 웹 디자인 소프트웨어를 선택하는 방법 또는 전문가의 선택을 참조하십시오. 사용해야 할 최고의 SEO 플러그인 및 도구.

    이 기사가 마음에 들면 구독하십시오. 유튜브 채널 WordPress 비디오 자습서용. 당신은 또한 우리를 찾을 수 있습니다 트위터 그리고 페이스북.

    포스트 WordPress에서 이미지 위에 텍스트를 추가하는 방법(3가지 방법) 에 처음 등장 WPB초보자.

    Source link

    신고하기
'WordPress에서 이미지 위에 텍스트를 추가하는 방법(3가지 방법)'에 답변달기
글쓴이 정보: