검색결과 맞춤설정
컬렉션을 사용해 정리하기
내 환경설정을 기준으로 콘텐츠를 저장하고 분류하세요.
검색창을 맞춤설정하는 것과 비슷한 방식으로 검색 결과 요소에 옵션을 추가할 수 있습니다.
예를 들어, 검색엔진을 웹 결과 기반에서 검색엔진으로 변경하기 위해
이미지를 기반으로 하는 경우 defaultToImageSearch 속성을 활용할 수 있습니다.
먼저 검색엔진의 제어판에서 이미지 검색을 사용하도록 설정해야 합니다. 설정 섹션의 기본설정 탭에서 이미지 검색 옵션을 '사용'으로 클릭합니다. 있습니다. 그런 다음 웹사이트의 <div class="gcse-searchresults"></div> 요소에 defaultToImageSearch 속성을 추가합니다.
<!-- 프로그래밍 검색 엔진 ID 삽입 -->
<script async src="https://cse.google.com/cse.js?cx=017643444788069204610:4gvhea_mvga"></script>
<!-- 속성 값을 'true'로 전환해 보세요. 또는 'false'입니다. -->
<div class="gcse-searchbox"></div>
<div class="gcse-searchresults" data-defaultToImageSearch="true"></div>
이제 무언가를 검색하면 이미지 검색 탭이 기본값으로 표시됩니다.
더 많은 옵션을 사용할 수 있습니다. 프로그래밍 검색 Element Control API 섹션에서 다른 검색 결과 맞춤설정 옵션을 확인할 수 있습니다.
다음...
다음 단계로 진행합니다.
달리 명시되지 않는 한 이 페이지의 콘텐츠에는 Creative Commons Attribution 4.0 라이선스에 따라 라이선스가 부여되며, 코드 샘플에는 Apache 2.0 라이선스에 따라 라이선스가 부여됩니다. 자세한 내용은 Google Developers 사이트 정책을 참조하세요. 자바는 Oracle 및/또는 Oracle 계열사의 등록 상표입니다.
최종 업데이트: 2025-07-25(UTC)
[null,null,["최종 업데이트: 2025-07-25(UTC)"],[[["\u003cp\u003eThe search results element can be customized with additional options, such as switching to image-based results using the \u003ccode\u003edefaultToImageSearch\u003c/code\u003e attribute.\u003c/p\u003e\n"],["\u003cp\u003eTo enable image search, you need to activate it in the Control Panel for your search engine and then add the \u003ccode\u003edefaultToImageSearch\u003c/code\u003e attribute to the search results div element.\u003c/p\u003e\n"],["\u003cp\u003eThe \u003ccode\u003edefaultToImageSearch\u003c/code\u003e attribute, when set to "true", makes the image search tab the default view for search results.\u003c/p\u003e\n"],["\u003cp\u003eFurther customization options for search results can be found in the Programmable Search Element Control API documentation.\u003c/p\u003e\n"]]],[],null,["# Customizing Search Results\n\nIn a similar way to customizing search box, you can add additional options to the search results element.\n\nFor example, in order to change our search engine from webresults-based\nto image-based, we can utilize the `defaultToImageSearch` attribute.\n\nFirst of all, you need to enable Image Search in the [Control Panel](https://programmablesearchengine.google.com) for your search engine. In the **Setup** section, in **Basics** tab, click the **Image search** option into the \"on\" position. After that, add the `defaultToImageSearch` attribute to the `\u003cdiv class=\"gcse-searchresults\"\u003e\u003c/div\u003e` element on your website. \n\\\u003c!-- Insert your own Programmable Search Engine ID here --\\\u003e \\\u003cscript async src=\"https://cse.google.com/cse.js?cx=017643444788069204610:4gvhea_mvga\"\\\u003e\\\u003c/script\\\u003e \\\u003c!-- Try switching the attribute value to \"true\" or \"false\" --\\\u003e \n\n \u003cdiv class=\"gcse-searchbox\"\u003e\u003c/div\u003e\n \u003cdiv class=\"gcse-searchresults\" data-defaultToImageSearch=\"true\"\u003e\u003c/div\u003e\n\nNow, when you search for something, the image search tab is showing as a default.\n\nThere are many more options available. You can read about other search results customization options in [Programmable Search Element Control API](/custom-search/docs/element#supported_attributes) section.\n\nNext...\n-------\n\nContinue to [Next steps](/custom-search/docs/tutorial/nextsteps)."]]
