Let your visitors search through your videos
TubePress provides an end-to-end, fully customizable solution for allowing your users to interactively search YouTube, Dailymotion, or Vimeo, all without leaving your website. The image below is a simple example showing an interactive search input along with a few results.
Like everything else with TubePress, interactive searching has loads of options and is fully customizable to suit your needs. To use the feature, you'll need two invocations of TubePress on the page:
- Once for displaying the search input and
- Once more for displaying the user's search results
Let's go over each invocation in detail.
Displaying a search input box and button is very easy with TubePress:
By default, the search form will submit back to the same page and TubePress will handle the submission. If you want the results to show up on another page, just set
searchResultsUrl. Please note that most users shouldn't need to do this.
[tubepress output="searchInput" searchResultsUrl="http://mysite.com/videos.php"]
Now that you have a search input form, you'll need to invoke TubePress somewhere else to display the search results.
Displaying search results is also easy. Add the following code wherever on the page you'd like the search results to show up:
[tubepress output="searchResults" searchProvider="vimeo"]
The searchProvider option can be set to either
vimeo, and this tells TubePress which video provider to search. TubePress will also display a placeholder gallery if the user isn't searching (e.g. on their first visit to the page), but you can make it invisible until it has search results by setting
[tubepress output="searchResults" searchProvider="youtube" searchResultsOnly="true"]
With TubePress Pro, you can display search results asynchronously (i.e. without a full page load). It's also a bit easier to set up than standard searching because you only need to invoke TubePress once on the page. The only catch is you also have to identify a DOM element where you want the search results to show up:
[tubepress output="ajaxSearchInput" searchResultsDomId="#somediv" searchProvider="vimeo"]
searchResultsDomId option value, just use any jQuery selector that uniquely identifies an existing DOM element on the page that can accept HTML.
By default, TubePress will search all videos on the provider for the user's search terms. If you'd like to narrow the results down to videos uploaded by a particular YouTube Channel/User, Dailymotion user, or Vimeo user, you can utilize the
searchResultsRestrictedToUser option (also available via the TubePress settings page at
WP Admin > Settings > TubePress > Which Videos? > Feed Options)
For instance, to restrict search results to YouTube videos uploaded by the YouTube channel
comedycentral, you might use the following shortcode:
[tubepress output="searchResults" searchProvider="youtube" searchResultsOnly="true" searchResultsRestrictedToUser="comedycentral"]