WordPress에서 텍스트를 강조 표시하는 방법은 무엇입니까?

게시 됨: 2021-08-23

WordPress 게시물이나 페이지에서 텍스트를 강조 표시하는 방법을 찾고 있습니까?

워드프레스에서 기본적으로 이 기능을 검색했다면 거기에서 얻지 못할 것입니다. 그러나 자세히 논의하여 적합한 솔루션을 제공할 것이므로 좋은 소식이 있습니다.

이는 제안 및 할인 기간 동안, 통계를 표시하거나 간단한 견적을 위해 중요한 발표를 할 때 특히 유용합니다. 콘텐츠의 특정 부분에 사용자의 주의를 집중시키는 데 도움이 됩니다. 전반적으로 콘텐츠의 일부에 하이라이트를 추가하면 콘텐츠를 흥미롭게 읽을 수 있습니다. 사진, 인포그래픽, 슬라이드, 하이라이트로도 콘텐츠의 매력을 유지할 수 있습니다.

왜 필요한가요?

내용을 작성할 때마다 굵게 또는 기울임꼴로 충분하지 않을 수 있습니다. 그렇게 생각하지 않아?

강조 표시된 텍스트가 어떻게 보이는지 궁금하다면 아래 내용을 살펴보세요.

여러 색상으로 텍스트 강조 표시
여러 색상으로 텍스트 강조 표시

이 간단한 작업에는 플러그인을 사용하지 않는 것이 좋습니다. Elementor 또는 Beaver Builder와 같은 페이지 빌더를 사용하는 경우 자체 내에 많은 옵션이 있습니다. 따라서 이 게시물의 끝에서 수동으로 이 작업을 수행하는 방법을 배웁니다.

내용물
1 구텐베르크 블록을 사용하여 WordPress에서 텍스트를 강조 표시하는 방법
2 HTML 태그를 사용하여 WordPress에서 텍스트를 강조 표시하는 방법

Gutenberg 블록을 사용하여 WordPress에서 텍스트를 강조 표시하는 방법

WordPress가 Gutenberg를 기본 편집기로 추가한 지 오래되었습니다. 그것의 도움으로 단락 블록에 있는 텍스트를 강조 표시할 수 있습니다.

이 기능을 테스트하려면 먼저 단락 블록에 텍스트를 작성하십시오. 차단 설정 아래 오른쪽에서 색상 설정을 찾습니다. 텍스트 색상, 배경 색상 및 링크 색상을 변경하는 옵션이 있습니다. 사용자 정의 색상 옵션을 열면 16진수, RGB 값 또는 HSL 값의 색상 값을 기반으로 색상을 선택할 수 있습니다.

블록 설정 및 사용자 정의 색상
블록 설정 및 사용자 정의 색상

단락 블록의 배경색을 변경하면 전체 블록의 배경이 해당 특정 색상으로 설정되는 것을 볼 수 있습니다. 구텐베르크에서만 특정 단어의 배경을 변경할 수 없습니다.

그러나 단락 블록에 있는 특정 단어의 색상을 변경할 수 있습니다. 이렇게 하려면 단어를 선택하고 링크 버튼 옆에 나타나는 드롭다운 화살표를 클릭하고 텍스트 색상을 선택합니다. 색상을 변경하면 해당 텍스트가 선택될 때마다 텍스트 아이콘이 나타납니다.

단락 블록의 텍스트 색상 변경
단락 블록의 텍스트 색상 변경

이제 해당 텍스트를 선택하면 텍스트 색상 옵션이 드롭다운에 표시되지 않습니다. 드롭다운 아이콘 옆에 나타나는 텍스트 아이콘에서 텍스트 색상을 관리해야 합니다. 블록의 모든 텍스트에 특정 색상을 추가해야 하는 경우 앞에서 설명한 대로 추가할 수 있습니다.

HTML 태그를 사용하여 WordPress에서 텍스트를 강조 표시하는 방법

여전히 혼란스럽 습니다. WordPress에서 텍스트를 강조 표시하는 방법은 무엇입니까?

위의 방법은 단락의 특정 텍스트를 강조 표시하는 것을 허용하지 않았습니다. 그러나 HTML 태그를 사용하면 솔루션을 얻을 수 있습니다. 이 방법에서는 mark HTML 요소와 span 태그를 사용하여 텍스트를 강조 표시합니다. 먼저, 일부가 쓰여진 단락 블록을 만듭니다.

다음은 텍스트의 하이라이트를 보여주기 위해 만든 콘텐츠입니다.

 1번 라인입니다 
HTML 요소 표시 사용
HTML 요소 표시 사용

이제 단락 블록에 있는 동안 세 개의 점을 클릭하고 HTML로 편집을 선택합니다. 강조 표시하려는 부분은 마크 태그 내에 유지되어야 합니다.

예를 들어 이 텍스트를 아래와 같이 "mark" 태그로 묶었습니다.

 <p><mark>1번째 줄입니다.</mark></p>

이 코드를 유지한 후 세 개의 점을 다시 클릭하고 시각적으로 편집을 엽니다.

그러면 변경 사항이 표시됩니다. 일반적으로 노란색으로 강조 표시됩니다. 그러나 사이트 설정 및 사이트에 있는 테마에 따라 다릅니다.

색상을 변경하려면 사용자 정의 CSS를 추가해야 합니다.

테마 사용자 지정 프로그램에서 이 작업을 수행할 수 있습니다. 대시보드에서 모양>사용자 정의>추가 CSS로 이동합니다.

마크 요소의 색상 사용자 정의
마크 요소의 색상 사용자 정의

아래와 같이 마크 태그의 색상을 변경할 수 있습니다.

 표시{

배경색: #32cd32;

}

변경 사항을 적용하려면 원하는 색상의 16진수 값을 유지하십시오. 이러한 변경 사항을 저장하려면 게시하십시오.

제 경우에는 녹색으로 유지했습니다. 이제 강조 표시된 텍스트가 위의 그림과 같이 노란색 에서 녹색 으로 변경됩니다.

나중에 테마를 변경하면 이 서식이 손실됩니다. 따라서 새 테마의 추가 CSS에 위의 코드를 다시 입력해야 합니다.

이제 WordPress에서 다른 강조 색상으로 텍스트를 강조 표시하는 방법을 알고 싶으십니까?

가능합니까?

물론 가능합니다. 위의 과정에서 HTML로 편집할 때 아래와 같은 코드를 삽입합니다.

 <span>Your_Text</span>

이 작업을 수행하는 동안 사용자 정의 색상 코드와 사용자 정의 텍스트를 유지하십시오.

사용자 지정 하이라이트 색상
사용자 지정 하이라이트 색상

따라서 마크 태그의 색상을 가장 강조할 때 사용한 색상으로 변경하는 것을 권장합니다. 이렇게 하면 마크 태그 내에 텍스트를 추가하여 텍스트를 강조 표시하는 데 도움이 됩니다.

또한 다른 하이라이트 색상이 필요한 경우 위에서 했던 것처럼 직접 코드를 추가할 수 있습니다.

결론

이 게시물이 WordPress에서 텍스트를 강조 표시하는 방법에 대한 완전한 솔루션을 다루기를 바랍니다. Gutenberg 블록 또는 HTML 태그를 사용하여 수행할 수 있습니다. 구텐베르크 블록을 사용하면 단락 블록의 개별 텍스트 색상을 변경할 수 있지만 배경색은 동일한 단락 블록에서 다를 수 없습니다.

반면에 HTML 태그를 사용하면 모든 텍스트를 원하는 색상으로 강조 표시할 수 있습니다. 이 작업을 수행하는 동안 마크 태그의 색상을 강조 표시를 위해 가장 선호하는 색상으로 변경해야 합니다. 마크 태그 내에 텍스트를 포함하기만 하면 하이라이트 색상을 얻을 수 있습니다. 다른 하이라이트 색상의 경우 이 게시물에서와 같이 span 태그로 묶고 색상 태그를 추가하여 수행할 수도 있습니다.

관련 게시물

  1. WordPress에서 글꼴 색상을 변경하는 방법
  2. 데이터베이스에서 WordPress 페이지는 어디에 저장됩니까?
  3. WordPress에서 단일 페이지의 배경색을 변경하는 방법