Skip to main content

Default Selectors

Valu Search crawler comes with set default selectors which can expanded upon or overwritten depending on the case.

Selectors are data attribute selectors with data-vs-<feature> structure.

Content selection​

Default selector: "[data-vs-content]"

Default selector is combined with other content selectors.

Cleanup selector​

Default selector: "[data-vs-skip]"

Default selector is combined with other cleanup selectors.

Title selector​

Default selector: "[data-vs-title]"

Default selector is used if page meta does not provide title selector.

If no title is got from any given selector fallback css selector "title" is used. If there still is no title, fallback title [no title] is given to document

Tag selector​

Default selector: "[data-vs-tags]"

Default selector tags are combined with tags from page meta.

Superwords selector​

Default selector: "[data-vs-superwords]"

Default selector superwords are combined with superwords from page meta. Superwords should be singular words or words separated by single space.

Customfields selector​

Default selector: "[data-vs-custom-field]" Value: string

Type: "[data-vs-type]" Value "date" | "number" | "keyword"

Default selected custom fields are combined with custom fields page meta. Custom fields default selector requires two data attributes: "data-vs-custom-field"="<name>" and "data-vs-type"="<type>"

Custom fields can be used in collecting custom information to fields and it can be used to build UIs with React Valu Search.

<div data-vs-custom-field="price_eur" data-vs-type="number">12345</div>

Produces:

customFields = {
    number__price_eur: 12345,
};

Example​

<!DOCTYPE html>
<html lang="en-US">
    <head>
        <div data-vs-title>Default selector title</div>
        <title>Test</title>
        <!-- this title would be overwritten by data-vs-title -->
        <div data-vs-custom-field="img_source" data-vs-type="keyword">
            somesource
        </div>
    </head>
    <body>
        body content that is not selected as content as it does not match any
        content selectors
        <div data-vs-content>
            Select me!
            <span data-vs-skip>but not me</span>
        </div>
        <div data-vs-superwords>data attribute superwords</div>
        <div data-vs-tags>custom/tag another/tag</div>
        <div data-vs-skip>
            Skip me with default selecotr
            <span data-vs-superwords>im-still-chosen</span>
        </div>
    </body>
</html>