워드프레스 강좌 | 이미지 오른쪽 정렬하기

워드프레스에 이미지를 삽입할 때 왼쪽, 가운데, 오른쪽 정렬 또는 정렬 없음을 선택할 수 있습니다.

정렬 없음이나 가운데 정렬은 텍스트가 이미지 다음에 나옵니다. 그런데 왼쪽과 오른쪽 정렬은 이미지 옆에 텍스트가 나오도록 되어 있습니다.

예를 들어 오른쪽 정렬을 하면 다음과 같이 왼쪽에 텍스트가 나오게 됩니다.

하지만, 간혹 텍스트가 옆에 있지 않고 이미지만 오른쪽에 위치시켜야 하는 경우가 있습니다. 이럴 땐 직접 코딩을 해야 합니다.

이미지를 넣으면서 정렬 없음을 선택합니다. 그리고 글쓰기 폼을 텍스트(Text)로 변경하면 다음과 같은 코드가 있습니다.

<img class="alignnone size-full wp-image-968" alt="Image Alignment 150x150" src="http://dev-wordpress-3.cmsfactory.net/wp-content/uploads/2013/03/image-alignment-150x150.jpg" width="150" height="150" />

이를 다음과 같이 같이 바꿉니다. 빨간색이 추가하는 코드입니다.

<div style="text-align: right;">
<img class="alignnone size-full wp-image-968" alt="Image Alignment 150x150" src="http://dev-wordpress-3.cmsfactory.net/wp-content/uploads/2013/03/image-alignment-150x150.jpg" width="150" height="150" />
</div>

결과는 다음과 같습니다.

Created on 2013-12-09 14:10 | Updated on 2018-10-04 18:18

워드프레스 프리미엄 테마 사이트

  • Elegant Themes
    80여 개의 테마를 한꺼번에 $89에 판매하는 경제적인 테마 사이트 / 1년 업데이트 / 무제한 사이트
  • ThemeForest
    10000여 개의 테마가 거래되는 세계 최대 워드프레스 테마 오픈 마켓 / 계속 업데이트 / 1개 애플리케이션

Book

워드프레스 인기 테마