Creating A Custom Visualforce Search Page - Coveo Documentation

  • Home
    • Coveo Platform
      • Implementation guide
      • Index content
      • Build a search UI
      • Tune relevance
      • Monitor and measure your data
      • Leverage machine learning
      • Manage an organization
      • Manage customer service solutions
      • Knowledge Hub
      • Coveo CLI
      • Coveo REST APIs
      • Searching with Coveo
    • Solutions and integrations
      • Coveo for Adobe
      • Coveo for Agentforce
      • Coveo for Commerce
      • Coveo for Contentful
      • Coveo for Optimizely
      • Coveo In-Product Experience (IPX)
      • Coveo for Salesforce
        • New features
          • Features of 2024
          • Features of 2023
          • Features of 2022
          • Features of 2021
          • Features of 2020
          • Features of 2019
          • Features of 2018
          • Features of 2017
          • Features of 2016
          • Features of 2015
        • Basics
          • What's new in v6?
          • What's new in v5?
          • What's new in v4?
          • What's new in v3?
          • Architecture
          • Main features
          • Supported browsers
          • Product lifecycle
          • Grant login access to your Salesforce account
        • Get started
          • Install the application
          • Configure the application
          • Add a Salesforce source
            • Index Chatter feeds
            • Index related files
            • Index Knowledge
            • JSON modification
          • Go to production
            • Grant users access to your Coveo Lightning components
            • Grant users access to your Coveo Classic components
            • Get started for end users
          • Get started with Coveo for Einstein Bots
        • Integrate Coveo components
          • Choose the right Insight Panel component
          • Hosted components
            • Integrate a Coveo Hosted Insight Panel
              • Generate a custom platform token
              • Add custom context to the Hosted Insight Panel
            • Integrate a Coveo hosted search page in a Lightning Console app
              • Generate a custom search token
              • Add custom context
            • Integrate a Coveo hosted search page in an Experience Cloud site
              • Generate a custom search token
              • Add custom context
          • Lightning Console app components
            • Integrate a Coveo Full Search page
            • Integrate a Coveo Insight Panel Lightning Component
              • Configure a Coveo Insight Panel Lightning Component for Chat (Live Agent)
              • Use the result actions
              • Add the Create Article button
              • Add the UserActions component
              • Customize the Full Search button options
              • Add the Attached Results component
              • Add the Insight Query Summary component
            • Integrate a Coveo Insight Attached Results component
          • Experience Cloud site components
            • Integrate a Coveo Community Search component
            • Integrate a Coveo Page View Tracker component
            • Integrate a Coveo Recommendation component
            • Integrate a Coveo Case Deflection component
          • Analytics tracking components
            • Coveo ClientIdAccessor Lightning component
            • Coveo VisitorIdAccessor Lightning component (Deprecated)
          • Classic components (Deprecated)
            • Integrate a Coveo Insight Panel Classic Component
              • Add a Create Article button to the Coveo Insight Panel Classic Component
              • Add a contextual query to the Coveo Insight Panel Classic Component
              • Add a UserActions component
            • Integrate a Coveo Full Search page
          • Access the Interface Editor
        • Manage the application
          • Configure Coveo for Salesforce
            • Reset your Coveo for Salesforce configuration
            • Access to the Coveo for Salesforce configuration pages
            • Uninstall Coveo for Salesforce
          • Refresh Coveo for Salesforce in a sandbox
          • Identify your Coveo for Salesforce version
          • Use SSO with Coveo for Salesforce
          • Investigate Coveo for Salesforce performance
          • Synchronize your configuration
          • Lightning Web Components (LWC) support
          • Upgrade
            • Upgrade the Coveo for Salesforce application
            • Upgrade to the new Coveo Insight Panel Lightning Component experience
            • Upgrade from v5 to v6
            • Upgrade from v4 to v5
            • Upgrade from v3 to v4
              • Migrate components from Salesforce API 39 to API 40+
            • Upgrade from v2 to v3
        • Develop and customize
          • Basic setup before you can start to develop
          • Quantic library
            • Usage
              • Use a standalone search box
              • Use the Result Template component
              • Implement folding
              • Use generative answering
              • Content recommendations
              • Create a Case Assist interface
              • Create a custom caption provider component for facets
              • Log view events with Coveo UA
              • Display a facet based on the selection of another facet
              • Create custom result actions
              • Access Headless through Quantic
              • Create a custom Insight Panel
                • Create result templates
                • Create custom result actions
                • Leverage case context
                • Integrate useful Coveo for Salesforce features
              • Safely set the search hub value
            • Upgrade
            • Reference
              • Search components
                • AriaLive
                • BreadcrumbManager
                • CategoryFacet
                • CategoryFacetValue
                • DateFacet
                • DidYouMean
                • Facet
                • FacetCaption
                • FacetManager
                • FacetValue
                • Feedback
                • FeedbackModal
                • FeedbackModalQna
                • FoldedResultList
                • GeneratedAnswer
                • Modal
                • ModalA11yHandler
                • NoResults
                • Notifications
                • NumericFacet
                • Pager
                • QueryError
                • RecentQueriesList
                • RecentResultLink
                • RecentResultsList
                • RefineModalContent
                • RefineToggle
                • Result
                • ResultAction
                • ResultActionBar
                • ResultList
                • ResultsPerPage
                • SearchBox
                • SearchBoxSuggestionsList
                • SearchInterface
                • SmartSnippet
                • SmartSnippetAnswer
                • SmartSnippetSource
                • SmartSnippetSuggestions
                • Sort
                • SortOption
                • StandaloneSearchBox
                • Summary
                • Tab
                • TabBar
                • Timeframe
                • TimeframeFacet
              • Result Template components
                • ColoredResultBadge
                • ResultChildren
                • ResultDate
                • ResultField
                • ResultHighlightedTextField
                • ResultLabel
                • ResultLink
                • ResultMultiValueText
                • ResultNumber
                • ResultPrintableUri
                • ResultQuickview
                • ResultTag
                • ResultTemplate
                • ResultText
                • ViewedByCustomerBadge
              • Case Assist components
                • CaseAssistInterface
                • CaseClassification
                • DocumentSuggestion
              • Utility components
                • CardContainer
                • Carousel
                • Heading
                • NumberButton
                • Pill
                • Placeholder
                • Svg
              • Insight Panel components
                • AriaLive
                • BreadcrumbManager
                • CategoryFacet
                • CategoryFacetValue
                • DidYouMean
                • Facet
                • FacetCaption
                • FacetManager
                • FacetValue
                • Feedback
                • FeedbackModal
                • FeedbackModalQna
                • InsightInterface
                • InsightPanelSummary
                • Modal
                • ModalA11yHandler
                • NoResults
                • Notifications
                • NumericFacet
                • Pager
                • QueryError
                • RefineModalContent
                • RefineToggle
                • Result
                • ResultAction
                • ResultActionBar
                • ResultCopyToClipboard
                • ResultList
                • ResultsPerPage
                • SearchBox
                • SearchBoxSuggestionsList
                • Sort
                • SortOption
                • Summary
                • Tab
                • TabBar
                • Timeframe
                • TimeframeFacet
                • UserActionsToggle
              • Recommendation components
                • RecommendationInterface
                • RecommendationList
            • Product lifecycle
            • Change log
            • Versioned documentation
          • Quantic library
            • Usage
              • Use a standalone search box
              • Use the Result Template component
              • Implement folding
              • Use generative answering
              • Content recommendations
              • Create a custom caption provider component for facets
              • Display a facet based on the selection of another facet
              • Create custom result actions
              • Access Headless through Quantic
              • Safely set the search hub value
            • Reference
              • Search components
                • AriaLive
                • BreadcrumbManager
                • CategoryFacet
                • CategoryFacetValue
                • DateFacet
                • DidYouMean
                • Facet
                • FacetCaption
                • FacetManager
                • FacetValue
                • Feedback
                • FeedbackModal
                • FeedbackModalQna
                • FoldedResultList
                • GeneratedAnswer
                • Modal
                • ModalA11yHandler
                • NoResults
                • Notifications
                • NumericFacet
                • Pager
                • QueryError
                • RecentQueriesList
                • RecentResultLink
                • RecentResultsList
                • RefineModalContent
                • RefineToggle
                • Result
                • ResultAction
                • ResultActionBar
                • ResultList
                • ResultsPerPage
                • SearchBox
                • SearchBoxSuggestionsList
                • SearchInterface
                • SmartSnippet
                • SmartSnippetAnswer
                • SmartSnippetSource
                • SmartSnippetSuggestions
                • Sort
                • SortOption
                • StandaloneSearchBox
                • Summary
                • Tab
                • TabBar
                • Timeframe
                • TimeframeFacet
              • Result Template components
                • ColoredResultBadge
                • ResultBadge
                • ResultChildren
                • ResultDate
                • ResultField
                • ResultHighlightedTextField
                • ResultLabel
                • ResultLink
                • ResultMultiValueText
                • ResultNumber
                • ResultPrintableUri
                • ResultQuickview
                • ResultTemplate
                • ResultText
                • ViewedByCustomerBadge
              • Case Assist components
                • CaseAssistInterface
                • CaseClassification
                • DocumentSuggestion
              • Utility components
                • CardContainer
                • Carousel
                • Heading
                • NumberButton
                • Pill
                • Placeholder
                • Svg
              • Insight Panel components
                • AriaLive
                • BreadcrumbManager
                • CategoryFacet
                • CategoryFacetValue
                • DidYouMean
                • Facet
                • FacetCaption
                • FacetManager
                • FacetValue
                • Feedback
                • FeedbackModal
                • FeedbackModalQna
                • InsightInterface
                • Modal
                • ModalA11yHandler
                • NoResults
                • NumericFacet
                • Pager
                • QueryError
                • RefineModalContent
                • RefineToggle
                • Result
                • ResultAction
                • ResultActionBar
                • ResultCopyToClipboard
                • ResultList
                • ResultsPerPage
                • SearchBox
                • SearchBoxSuggestionsList
                • Sort
                • SortOption
                • Summary
                • Tab
                • TabBar
                • Timeframe
                • TimeframeFacet
              • Recommendation components
                • RecommendationInterface
                • RecommendationList
            • Change log
            • Versioned documentation
          • Quantic library
            • Usage
              • Use a standalone search box
              • Use the Result Template component
              • Access Headless through Quantic
              • Safely set the search hub value
            • Reference
              • Search components
                • AriaLive
                • BreadcrumbManager
                • CategoryFacet
                • CategoryFacetValue
                • DateFacet
                • DidYouMean
                • Facet
                • FacetManager
                • FacetValue
                • Modal
                • ModalA11yHandler
                • NoResults
                • NumericFacet
                • Pager
                • QueryError
                • RecentQueriesList
                • RecentResultLink
                • RecentResultsList
                • RefineModalContent
                • RefineToggle
                • Result
                • ResultAction
                • ResultActionBar
                • ResultList
                • ResultsPerPage
                • SearchBox
                • SearchBoxSuggestionsList
                • SearchInterface
                • Sort
                • StandaloneSearchBox
                • Summary
                • Tab
                • TabBar
                • Timeframe
                • TimeframeFacet
              • Result template components
                • ColoredResultBadge
                • ResultBadge
                • ResultLabel
                • ResultLink
                • ResultPrintableUri
                • ResultQuickview
                • ResultTemplate
              • Case Assist components
                • CaseAssistInterface
                • CaseClassification
                • DocumentSuggestion
              • Utility components
                • CardContainer
                • NumberButton
                • Pill
                • Placeholder
                • Svg
              • Insight Panel components
                • AriaLive
                • BreadcrumbManager
                • CategoryFacet
                • CategoryFacetValue
                • DidYouMean
                • Facet
                • FacetManager
                • FacetValue
                • InsightInterface
                • Modal
                • ModalA11yHandler
                • NoResults
                • NumericFacet
                • Pager
                • QueryError
                • RefineModalContent
                • RefineToggle
                • Result
                • ResultAction
                • ResultActionBar
                • ResultCopyToClipboard
                • ResultList
                • ResultsPerPage
                • SearchBox
                • SearchBoxSuggestionsList
                • Sort
                • Summary
                • Tab
                • TabBar
                • Timeframe
                • TimeframeFacet
            • Versioned documentation
          • About search and relevance
            • About search interfaces
              • About the default Coveo for Salesforce Full Search page
            • Expression basics
              • Ranking basics
              • Query extensions
                • Query extension example for a Related People tab
                • Query extension examples related to accounts
                • Query extension examples related to cases
              • Query expansions
            • About queries
              • Coveo query syntax examples
              • Thesaurus rule syntax with numeric and boolean parameters
          • About usage analytics
          • Customize components
            • Common customizations
            • Integrate Coveo Lightning console components
              • Add JavaScript to the Coveo for Salesforce Lightning components with custom code
              • Add JavaScript to the Coveo for Salesforce Lightning components with custom code - Deprecated
              • Integrate Coveo components in a custom Lightning app
              • Customize the standalone search box
              • Change the result icons in a Lightning component
              • Change the language of your search interface in Lightning
              • Make the Coveo Lightning components Lightning Locker compliant
              • Generate a custom search token for Lightning components using Lightning Locker
                • Add server-side Coveo Lightning component configuration
            • Customize the Coveo components used in your Experience Cloud site
              • Integrate Coveo components in a custom Lightning component for your Experience Cloud site
              • Create a search driven page in a Salesforce community
              • Create a custom standalone search box for your Experience Cloud site
              • Use Salesforce page variations
              • Add hidden fields in a Case Deflection component
              • Send custom context information in a custom page view tracker
            • Integrate Coveo Classic components
              • Create a custom Visualforce search page
                • Search page architecture
                • Change the default Coveo-powered search page
              • Create a custom Coveo Insight Panel Classic Component
                • Create a custom Coveo box inside the Salesforce console
                • Create custom actions for a Coveo Insight Panel Classic Component or a custom box
                • Customize the AttachToCase
            • Change the default Quick view in Coveo for Salesforce
            • Change the search result links for Salesforce items
            • Send custom context information in Salesforce Lightning
          • Index Lightning flows
          • Send Apex context to a JavaScript Search interface
          • Consume the Case Assist API using Apex
            • Retrieve Case Classifications using Apex
            • Retrieve Document Suggestions using Apex
          • Safely apply content filtering
          • Reference
            • Coveo for Salesforce (v3) JavaScript components - Generated from code
            • JavaScript components
              • AugmentedResultList component
              • BoxAttachToCase component
              • BoxBody component
              • Box component
              • BoxCreateArticle component
              • BoxCurrentSort component
              • BoxCurrentTab component
              • BoxEditLink component
              • BoxExpandLink component
              • BoxFieldTable component
              • BoxHeader component
              • BoxPipelineContext component
              • BoxPopup component
              • BoxQuerySome component
              • BoxQuerySummary component
              • BoxQuickview component
              • BoxResultAction component
              • CaseCreation component
                • Cancel component
                • Field component
                • Picklist component
                • Submit component
              • CaseDeflection component
              • ChatterThumbnail component
              • CommunityStateManager component
              • ConsoleResultLink component
              • Copy to clipboard component
              • CreateArticle component
              • FullSearch component
              • InsightQuerySummary component
              • PipelineContext component
              • SalesforceAdaptiveResultLink component
              • SalesforceResultLink component
              • SalesforceThumbnail component
              • StandaloneSearchbox component
              • UserActions component (Visualforce)
              • UserActions component (Lightning)
              • ResultActionsSendEmail component
              • ResultActionsPostToFeed component
              • ResultActionsSendLiveAgent component
              • ResultQuickAction component
              • ViewedByCustomer component
            • Visualforce components
              • Box Visualforce component
              • CaseCreation Visualforce component
              • JsSearch Visualforce component
              • SearchInterface Visualforce component
              • UserActions Visualforce component
            • Lightning components
              • AgentPanel Lightning component
              • Base Lightning component
              • CaseCreation Lightning component
              • CaseDeflection Lightning component
              • ClickedDocumentList Lightning component
              • CommunitySearch Lightning component
              • CommunitySearchBox Lightning component
              • FullSearch Lightning component
              • PageViewTracker Lightning component
              • QueryList Lightning component
              • Searchbox Lightning component
              • Search Lightning component
              • SearchUI Lightning component
              • UserActivity Lightning component
              • ClientIdAccessor Lightning component
              • VisitorIdAccessor Lightning component
            • Lightning Web components
              • Recommendation Lightning Web component
          • Apex classes
            • UsageAnalytics Apex class
            • AnalyticsApiClient Apex class
            • SearchAPIClient Apex class
            • SearchApiResponse Apex class
            • SearchApiResult Apex class
            • AttachToCaseController Apex class
            • Globals Class
        • Troubleshooting
          • Impacts of endpoint deprecation
          • Lightning component no longer loads after updating the page configuration on the server side
          • Search interface does not return the expected results
          • Cannot see values when using an existing field in a facet
          • Unknown page for the current site configuration error with Coveo Lightning components
          • Coveo object unavailable in Lightning component
          • The feature is not activated for your organization
          • Uncaught-DOMexception-failed-to-read-the-'responsetext'-property-from-'XMLhttprequest' error message when using a component
          • Infinite loading when trying to preview a document using the Quick view
          • Access token update required
        • Release notes
          • Release notes - v6
          • Release notes - v5
          • Release notes - v4
          • Release notes - v3
          • Release notes - v2
        • FAQ
      • Coveo for ServiceNow
      • Coveo for Sitecore
      • Coveo for Zendesk
    • Security
    • Compliance
    • Services
    • Product entitlements
    • Coveo product news
    • Supported browsers
    • Glossary
    • Log in to Coveo for the first time
    • Design
      • Tab demo
    • Design (markdown)
   Solutions and integrations    Coveo for Salesforce    Develop and customize    Customize components    Integrate Coveo Classic components    Create a custom Visualforce search page

Create a custom Visualforce search page

Create a custom Visualforce search page

This is for:

Developer System Administrator

Deprecated

When integrating a Visualforce search page in Coveo for Salesforce, you usually want to create a custom Visualforce page that references the Coveo components.

There are many Coveo components you can add to your custom Visualforce page (see Visualforce components).

This tutorial shows you how to create a custom Visualforce page and include a SearchInterface into it.

To create a custom Visualforce search page

  1. In Salesforce, under Setup, search for and select Visualforce Pages (Build > Develop > Visualforce Pages).

  2. On the Visualforce Pages page, select New.

  3. Give your new component a Label; the Name should be filled automatically.

    For this tutorial, you can enter MyCustomSearchComponent.

  4. On the Visualforce Markup tab, enter the following template:

    <apex:page standardstylesheets="false" sidebar="false" docType="html-5.0"> <CoveoV2:SearchInterface mobile="false" name="myCustomPage"/> </apex:page>

    This template will use a Visualforce component called myCustomPage, which you will be prompted to create when accessing your Visualforce page if it doesn’t already exist.

  5. Select Save to save your Visualforce page.

You should now have a fully functional Visualforce page that you can use in Salesforce.

With your custom Visualforce page, you can add custom CSS using the <style> element, JavaScript using the <script> element, or leverage information in Apex using the <apex> element.

Example

To leverage information from the controller in the search page, you can use JavaScript to create a variable with all the values that you need so that you can use this variable in your code. Keep in mind that this variable isn’t available in the Interface Editor, but is available in your actual page.

<apex:page ...> [...] <apex:variable var="OrgID" value="{!IF(LEN($Organization.Id)==18, LEFT($Organization.Id, 15), $Organization.Id)}" /> <script> (function(){ Coveo.SFContext = { Current_Page: '{!$CurrentPage.Name}', Session_ID : '{!$Api.Session_ID}', Partner_Server_URL_200: '{!$Api.Partner_Server_URL_200}', Org_ID: '{!OrgID}', HiddenExpression: '@sforganizationid=={!OrgID} OR @uri (NOT @sforganizationid<>{!OrgID})' } })(); </script> </apex:page>

Now that you’ve created your custom search page, consider making it the default search page (see Change the default Coveo-powered search page).

Is this article useful? You can close this window or leave a comment below. Very useful Not really Can you tell us more about your experience today? Comments (optional) Need help with our product? Please open a support case for expert assistance. Use this feedback option to comment on the article only. Submit Is this article useful? You can close this window or leave a comment below. Very useful Not really Can you tell us more about your experience today? Comments (optional) Need help with our product? Please open a support case for expert assistance. Use this feedback option to comment on the article only. Submit

Make every experience relevant with Coveo

Contact us Get a free trial In this article

Từ khóa » Visualforce Page Documentation