사이트에 공통으로 CSS, 스크립트를 삽입하고 싶어요.

아임웹은 기본적으로 사용자가 코딩을 몰라도 사이트, 쇼핑몰을 제작할 수 있도록 제작되었습니다. 하지만 아임웹에서 제공하지 않는 디자인이나 기능구현을 위해서는 특별한 코드가 필요할 수 있습니다. 예) 상단 이동 스크롤 버튼, 네이버 및 구글 등 소유자 확인용 메타 태그, 구글 태그 매니저 등

일반적으로 아임웹에 코드를 삽입할 때는 디자인 모드에서 코드 위젯을 사용합니다. 다만 이 경우 코드 위젯을 여러 페이지에 삽입해야 하는 불편함이 있을 수 있습니다. 코드 위젯은 페이지마다 최소한의 코드로 HTML 정도만 작성하시는 것이 좋으며, 공통으로 사용할 CSS나 JavaScript는 SEO, 헤더설정에서 공통 코드 삽입 후 코드 위젯에서 호출하는 것이 좋습니다.

삽입방법

  1. 내 사이트 관리자 페이지에 접속합니다. 접속방법
  2. 왼쪽 메뉴에서 [환경설정 > SEO(검색엔진최적화)]를 클릭합니다.
  3. 공통 코드 삽입 항목에 코드를 입력합니다. SEO(검색엔진최적화)에 입력한 코드는 모든 페이지의 HTML에 공통으로 삽입됩니다. 따라서 CSS를 작성할 때는 <style></style> 을 선언하여 이 사이에 삽입해야 하며, JavaScript 또한 <script></script> 선언 후 이 사이에 삽입합니다.

    https://cdn.imweb.me/upload/82c868683f1f6.png

    • Meta Code: 네이버 및 Google 웹마스터 도구의 사이트 소유 확인용 메타 태그는 이곳에 삽입합니다.
    • Header Code: 이곳에 작성한 코드는 모든 페이지의 HTML 와 사이에 삽입됩니다.
    • Body Code: 이곳에 작성한 코드는 모든 페이지의 바로 아래 삽입됩니다. 를 선언하고 JavaScript를 입력할 수도 있습니다.
    • Footer Code: 이곳에 작성한 코드는 모든 페이지의 바로 위에 삽입됩니다. 를 선언하고 JavaScript를 입력할 수도 있습니다.
  4. 저장 버튼을 클릭해 적용합니다.

활용예제

예를 들어, 웹사이트에 플로팅 배너를 추가하기 위해 SEO(검색엔진최적화)에 공통 코드를 삽입할 수 있습니다. 이후 특정 페이지에서는 작동하지 않거나, 보이지 않도록 처리할 수 있습니다. 아래의 도움말을 확인해 보세요.

플로팅 배너 만들기

목록으로