메인 콘텐츠로 건너뛰기

4. 당신의 iLost 위젯/i프레임 설정

최소 6달 전에 업데이트됨


iLost는 고객들이 귀하의 기관 웹사이트에서 직접 분실물을 찾을 수 있도록 위젯 또는 iFrame을 통합하는 것을 권장합니다.

버튼, 검색 위젯 및 검색 iFrame과 같은 여러 위젯 옵션이 있습니다. 제공된 HTML 코드를 사용하여 이러한 옵션들을 쉽게 통합할 수 있습니다. 이러한 옵션들은 귀하의 iLost 계정에서 사업 설정하에 사용 가능합니다.

버튼 예시:

검색 위젯 예시:

검색 iFrame 예시:

iLost 위젯의 높이를 변경할 수 있습니까?

'검색 iFrame' 위젯의 경우 높이를 변경하여 더 많은 결과를 볼 수 있습니다. "ilost-widget" 요소에 다음 데이터 속성을 설정하십시오. 단위는 픽셀입니다:

<div class="ilost-widget" data-type="searchframe" data-height=500>...

기본값은 400(400px)입니다.

아래에 예시가 제시되어 있습니다:

<html>  <head>    <title>당신의 웹사이트 제목</title>  </head>  <body>    <!-- 위젯 코드 -->
<div class="ilost-widget" data-type="searchframe" data-height=500>
<form accept-charset="utf-8" action="https://ilost.co/en/org/ilost?country=nl">
<a href="https://ilost.co/en/org/ikea?country=es" title="IKEA에서 발견한 물건들 on iLost" target="_blank">
<img src="https://ilost.co/static/widget/ilost-button-new.png" alt="IKEA에서 발견한 물건들 on iLost">
</a>
<input name="q" placeholder="당신은 무엇을 잃어버렸나요?" type="text">
<button class="ilost-widget__search_button" type="submit" value="search"></button>
</form>
</div>

<!-- JavaScript용 iLost SDK 로드 -->
<script>(function(i,s,o,g,r,a,m){i['iLostObject']=r;i[r]=i[r]||function(){(i[r].q=i[r].q||[]).push(arguments);},i[r].l=1*new Date();a=s.createElement(o),m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m);})(window,document,'script','https://ilost.co/widget/sdk.js?version=v3.3&locale=en','ilostsdk');
ilostsdk('organization', 'ilost');</script>
</body></html>

iLost 위젯의 스타일을 변경할 수 있습니까?

추가 쿼리 매개변수 'nostyling=true'를 제공하여 iLost 위젯의 기본 스타일을 비활성화할 수 있습니다. 이것은 게스트 웹페이지에 삽입된 html에만 영향을 미치고 주입된 iframe(찾은 항목 결과가 인쇄되는 곳) 내의 내부 html에는 영향을 미치지 않습니다.

국제 보안 프로토콜로 인해 주입된 iframe에 액세스할 수 없습니다. 따라서 찾은 항목 목록의 스타일은 변경할 수 없으며 한 스타일에서만 사용할 수 있습니다.

예제 코드:

<div class="ilost-widget" data-type="searchframe">
<form accept-charset="utf-8" action="https://demo.ilost.co/en/org/ilost?country=nl">
<a href="https://demo.ilost.co/en/org/ilost?country=nl" title="Found items at IKEA on iLost" target="_blank"><img src="https://demo.ilost.co/static/widget/ilost-button-new.png" alt="Found items at IKEA on iLost"></a>
<input name="q" placeholder="What have you lost?" type="text"><button class="ilost-widget__search_button" type="submit" value="search"></button></form></div>
<script>(함수(i,s,o,g,r,a,m){i['iLostObject']=r;i[r]=i[r]||함수 (){(i[r].q=i[r].q||[]).push(인수);},i[r].l=1*new Date();a=s.createElement(o),m=s .getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m);})(창,문서,'스크립트','https://demo.ilost. co/widget/sdk.js?version=v3.4&locale=en&nostyling=true','ilostsdk');
ilostsdk('조직', 'ilost');</script>
답변이 도움되었나요?