지역화된 이미지를 추가합니다

작동 방식

다른 언어로 현지화된 텍스트와 함께 이미지를 추가할 수 있습니다. 이 기능을 통해 여러 나라 사용자들에게 더욱 유용한 사이트를 만들 수 있습니다.

사용자

웹사이트 빌더와 이미 통합한 파트너.

획득 방법

  1. 게시자 계정 > 웹사이트 빌더로 이동합니다.
  2. 헤더 블록에서, 번역 컴포넌트를 설정합니다.
  3. 현지화 이미지에 추가할 언어를 선택합니다.
  4. 사용자 정의 코드 블록에 다음 코드를 삽입합니다.

Copy
Full screen
Small screen
<style>
  .localised-image {
    text-align: center;
    padding: 4em 1em;
  }
  .localised-image img {
    width: 100%;
  }
</style>  
<div class="localised-image">
  <img class="lazy loaded" data-src="https://cdn3.xsolla.com/files/uploaded/2340/d9d69114bb9f7c60f0981639aaa4bf3a.jpeg" />
</div>

  1. 개별 이미지에 대한 링크를 img 요소에 넣는데 이는 data-src 속성에 있습니다. 지원하는 이미지 포맷: JPEG, PNG, GIF.
  2. 여러 개의 지역화 이미지를 추가하려면, 블록을 div 태그로 복제하고 이미지 URL을 변경합니다.
  3. 미리보기를 클릭하면 변경 내용을 볼 수 있습니다.

이 레시피에 대한 예제 비디오 보기: