makeBCT

#AI #OpenAI #Chatbot #Cloud #WordPress

워드프레스 표(table) 만들기 1

워드프레스에서 페이지나 글에 표를 삽입하려면 생각보다 어렵지요?

어떻게 설정해야 하는건지, 셀 크기부터 횡과 열 설정도 맘대로 안되고 여간 까다로운게 아닙니다.

이는 한글이나 워드 프로그램에서 표 작성이 습관화되어 더 어렵게 느껴지는 탓도 있을 겁니다.

 

이번 글에서는 간단한 표를 만들고 스타일을 적용해 보겠습니다.

에디터의 표 삽입 기능은 워드프레스 에디터 TinyMCE Advanced 플러그인에서 지원하는 표 기능입니다.

 

1. 표 삽입하기

’글 작성화면’의 에디터에서 [표] 버튼을 클릭하여 일단 표를 삽입하겠습니다.

5X5 의 표를 삽입하였으나 아래 그림과 같이 표가 삽입되었습니다.

zpost_08img01

 

테두리 오른쪽 상자를 드레그하여 오른쪽으로 700px까지 늘립니다.

zpost_08img02

 

표 전체를 블록한 상태에서 에디터의 [표] > [표 속성]을 선택합니다.

반응형 테마에서 출력되므로 각 해상도에서 잘 보이도록 가로폭을 %로 설정하기위해 표의 가로를 100%, 세로를 au>to로 입력합니다.

zpost_08img03

 

 

 

표의 첫 번째 줄에 Header 1 ~ 5까지 적어주고 이 부분을 block으로 감싼 후, 다시 에디터의 [표] > [열 속성]을 클릭합니다.

zpost_08img04

 

속성 설정에서 [고급]탭을 클릭하여 배경색을 다음과 같이 정합니다.

zpost_08img05

 

 

header 부분의 글자색을 흰색으로 지정하고 저장 합니다. 홈페이지에서 보면 아래 그림처럼 보입니다.

zpost_08img06

 

나머지 항목도 채우고 홈페이지에서 보면 아래 그림과 같이 출력됩니다.

각각에 작성된 글자 수 만큼 표의 각 셀의 가로폭이 적당히 자동으로 조절되어 보여집니다.

zpost_08img07 

 

 

Leave a Reply

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

This site uses Akismet to reduce spam. Learn how your comment data is processed.

인기 글

사용자 작성 모듈 import 시 에러)(ModuleNotFoundError: No module named
파이썬 모듈을 만들고 테스트 할 때 ModuleNotFoundError: No module named 에러가 발생한 경우원인파이썬은 모듈을 불러올 때 모듈 설치 경로와 자신의...
WSL2/Ubuntu 22.04 LTS에 Anaconda 설치 
WSL2/Ubuntu 환경에서 Python 버전별로 가상환경을 만드는 방법 중 그나마 Anaconda 방법이 좋은 것 같네요. 설치 방법은 간단합니다.1. apt update사용자...
오라클 클라우드 OCI 가입 드디어 성공 했습니다 (상세 후기)
2023년 2월 16일에 ‘오라클 클라우드 지급 검증 실패 글‘을 남긴 적이 있습니다.그 때 검색을 통해 해결 방법을 찾아 보았고, 당시 성공했던 분들의...
Ubuntu 20.04에 MySQL 5.7 설치
비씨티원 인공지능 서비스 플랫폼 BAP(Bctone AI service Platform)의 설치 환경은 공식적으로 Ubuntu 18.04와 MySQL 버전 5.7 입니다. 최근 Ubuntu...
AWS 인스턴스 유형 변경 방법
AWS 인스턴스 유형을 변경하기 위한 방법에는 다음 2가지가 있습니다.   1. 첫 번째 방법 AMI 이미지 생성 후 해당 이미지를 복원하여 신규 EC2 인스턴스를 생성하는...

BCT Ai Chatbot

답변을 준비중입니다 . . .