클릭엔

소스 코드를 직접 입력할 수 있는 블록으로 HTML 과 CSS 를 활용해 원하는 블록을 생성할 수 있는 블록이에요.

기존에 정해진 디자인 블록 외에 사용자가 직접 코드를 삽입해 보다 자유롭게 디자인을 확장할 수 있어요.

코드 블록을 추가하고 소스코드 수정 버튼을 통해 소스 코드를 입력해 주세요.

참고사항

코드 블록에서는 HTML 과 CSS 만 삽입할 수 있어요.

Java Script는 클릭엔 기본 기능 및 디자인과의 충돌이 발생할 수 있어 사용할 수 없어요.

  • HTML : 웹 페이지의 뼈대와 구조를 만드는 언어

  • CSS : 구조 위에 디자인과 레이아웃 등의 스타일을 입히는 언어

코드 블록은 AI 를 활용해 원하는 디자인 블록을 생성할 수 있어요.

추가 수정을 최소화하고 결과물의 품질을 높이기 위해 아래 내용을 참고하여 디자인 코드를 생성해 주세요.

구체적인 요청사항 전달하기

요청사항이 구체적일 수록 보다 정확하고 향상된 품질의 결과물을 얻을 수 있어요.

ex)

  • 목적 : "사이트의 소개 페이지를 만들거야"

  • 스타일 : "모서리가 둥근 형태이고 이미지와 텍스트가 삽입될거야"

  • 색상 / 톤 : "브랜드 컬러인 #0066ff 를 배경색으로 사용하고 텍스트 배경은 화이트로 맞춰줘"

  • HTML , CSS : " HTML과 CSS는 분리해서 생성해줘"

"반응형" 디자인 요청하기

클릭엔은 기본적으로 PC와 모바일이 자동으로 조절되는 반응형으로 제공되기에,

코드 블록으로 디자인을 생성할 때에도 "반응형" 처리를 요청해 주세요.

이미지의 저작권 및 상업적 이용 가능여부 확인하기

AI 가 생성한 이미지는 저작권 문제가 발생할 수 있으니 주의해 주세요.

Java Script 사용여부 확인하기

코드 블록에서는 기본 기능 및 기본 디자인 블록과의 충돌이 발생할 수 있어 Java Script의 사용이 불가해요.

코드 블록에 이미지는 어떻게 삽입하나요?

소스 코드를 직접 작성하여 생성하신 디자인 블록에는 이미지를 직접 업로드할 수 없어요.

소스 코드 내에 사용된 이미지는 외부 이미지 URL을 통해 불러와지며

사용할 이미지의 URL이 존재해야 해요.

(별도 이미지 호스팅 등 사용 필요)

코드 블록이 원하는대로 생성되지 않아요.

코드 블록에 삽입한 소스 코드에 대한 정상동작 여부 및 오류 현상에 대해서는 확인이 어려워요.

소스 코드 생성시 활용한 AI 툴 등을 활용해 오류 현상 설명 및 수정을 진행해 주세요.

코드 블록에 Java Script 는 사용할 수 없나요?

클릭엔의 디자인 모드 기본 기능과 제공된 기본 디자인 블록과의 충돌이 발생할 수 있어 코드 블록내 Java Script 는 사용할 수 없어요.

기본 블록의 소스를 수정할 수 있나요?

코드 블록을 통해 생성한 블록 외에 클릭엔에서 기본으로 제공하는 블록들의 소스는 수정할 수 없어요.