워드프레스 홈페이지 하단(footer) 영역 꾸미기

워드프레스 홈페이지 하단 영역에 정보, 링크, 베너 아이콘을 배치하여 다양한 정보를 제공할 수 있도록 만들어 보겠습니다.

[관리자] > [외모] > [BCT footer text]에 접속합니다.

하단 정보를 작성할 수 있는 텍스트 상자가 보입니다.zpost_03img01

1. 사이트 정보 작성하기

작성할 내용을 다음과 같이 텍스트로 입력합니다.

zpost_03img0101

홈페이지에서 확인해 보면, 아무런 태그를 지정하지 않아 그냥 주~욱 글자들이 이어져 출력됩니다.

zpost_03img02

2. 태그 활용하여 스타일 적용하기

작성해 놓은 텍스트에 <br/>, <a> 태그등을 활용하여 줄바꿈을 해주고, 텍스트에 링크를 걸어줍니다.

zpost_03img03

태그가 적용된 상태로 홈페이지에 출력됩니다.

태그를 더해주는 것만으로 BC TOWN™ 테마에 미리 지정되어 있는 스타일이 적용되어 보기 좋게 출력됩니다.

zpost_03img04

3. 이미지를 삽입하고 링크 걸기

텍스트 아래쪽으로 이미지를 배치하고 링크를 걸어 보도록 하겠습니다.

미리 준비한 아래의 그림과 같은 이미지를 워드프레스 [미디어]에 업로드 합니다.

zpost_03img07

업로드한 이미지를 클릭하여 상세보기 화면에 접속합니다.

오른쪽 파일 정보에서 ’URL’에 적혀있는 주소를 복사합니다. 이미지가 위치한 URL정보 입니다.

zpost_03img08

아래의 그림과 같이 텍스트 아래쪽에 이미지를 삽입하고, 링크를 걸어주는 HTML을 작성해 줍니다.

이미지 위치는 위의 이미지 URL을 적어주면 됩니다.

zpost_03img05

홈페이지 하단에 텍스트와 이미지가 함께 출력됩니다.

zpost_03img06

Leave a Reply

Your email address will not be published. Required fields are marked *

인기 글

Ubuntu 22.04 LTS에 Python 3.8 or 3.9 설치 방법
서버 : Vultr 클라우드OS: Ubuntu 22.04 LTS사용자 계정 생성하여 설치 진행함1. Start with the system updatesudo apt update...
오라클 클라우드 OCI 가입 드디어 성공 했습니다 (상세 후기)
2023년 2월 16일에 ‘오라클 클라우드 지급 검증 실패 글‘을 남긴 적이 있습니다.그 때 검색을 통해 해결 방법을 찾아 보았고, 당시 성공했던 분들의...
자동화설비 구조 및 데이터PC 역할
자동화설비에 사용되는 하드웨어는 다음과같습니다.PLC : PLC는 자동화 설비의 제어를 담당하는 핵심 장치로, 프로그래밍을 통해 다양한 장비와 프로세스를 제어할 수 있습니다....
BCT AI Chatbot 정식 버전 출시에 앞서
워드프레스 기반의 인공지능 대화형 AI챗봇 개발을 진행하면서 여러 시행착오를 해 왔는데, 다양한 피드백을 거쳐 현재 정리된 (BCT AI Chatbot 정식 버전 출시에 앞서) 해결해야...
자동화설비 데이터PC 환경 설정
파이썬 3.11.0환경변수 설정파이참 커뮤니티 에디션 다운로드프로젝트 필수 라이브러리 다운로드QT5 환경 변수 추가PostgreSQL...