실제 사례
조작 설명: 검색창에서 검색창에 입력 회사명 또는 라이선스 번호를 입력해서 WikiFX 검색 결과 페이지로 들어가 주세요.
특색 사례
스텝 1: 컨테이너 생성
페이지의 <body></body>에서 적절한 위치에 div를 추가하고 <div id=“div_jiaoyishang”></div>와(과) 같은 고유 ID를 하나 자체 정의합니다. 해당 div는 js 코드에 의해 생성된 html 조각이 최종 페이지에 보이는 검색 상자의 위치를 결정하는 컨테이너입니다.
스텝 2: js 코드 호출 [방법 1: 기본 호출, URL 파라미터 수정으로 파리미터 배치]
01.
02.
03.
<script type==“text/javascript” src=“https://osshead.interface003.com/headfoot/fxeye/Content/js/tradersearch.js?id=div_jiaoyishang&width=350px&height=30px&buttomwidth=50px&border=1px&color=#f4c830&key=5x2102f96wq6&ts=” + Math.random()=Math.random()></script>
복사
[방법 2: JavaScript 대상 설정, JavaScript의 대상속성값 수정으로 파라미터 배치]
01.
02.
03.
04.
05.
06.
07.
08.
09.
10.
11.
12.
13.
14.
15.
16.
<script type=“text/javascript”>
var fx = new Object();
fx.id=“div_jiaoyishang”;
fx.width=“350px”;
fx.height=“30px”;
fx.buttomwidth=“50px”;
fx.border=“1px”;
fx.color=“#f4c830”;
fx.key=“5x2102f96wq6”;//设置合作码，与客服联系后填写。注：私自修改无效
var script=document.createElement(“script”);
script.type=“text/javascript”;
script.src=“//osshead.interface003.com/headfoot/fxeye/Content/js/tradersearch.js?id=”+ fx.id
+“&border=“+fx.border+”&color=“+fx.color+”&ts=” + Math.random();
document.getElementsByTagName(‘body’)[0].appendChild(script);
</ script>
복사
스텝 3: 협력 코드 획득
WikiFX 고객 서비스에 문의하여 위챗을 추가하고 협력 코드를 받으세요:FXEYE02、FXEYE07。
파라미터 설명
파라미터 이름
파라미터 유형
필수 여부
파라미터 설명
id
String
예
입력 상자가 생성되는 위치를 지정. 즉 스텝 2에서 생성된 div의 ID.
width
String
아니요
검색 상자의 전체 너비, 즉 컨테이너 너비를 설정
height
String
아니요
총 높이 설정
buttomwidth
String
아니요
좌측 버튼의 폭은 입력창과 버튼을 조정하는데 사용함
border
String
아니요
검색 상자의 테두리 두께는 입력 상자의 전체 크기에 따라 조정 가능
color
String
아니요
배경색
key
String
아니요
가맹점 전용 식별 키(오픈소스 버전도 기능은 동일하나, 자사 로고 적용은 불가)
비고 : 스텝2에서 언급한 JavaScript 코드를 div 컨테이너 뒤에 배치하고, body 맨 밑에 배치하는 것을 추천.