{{> head }}
<div class="doc">

<header id="top-section" class="doc-header">
    <div class="row row-doc">
        <div class="large-12 columns">
            <a href="./">
                <img class="header-logo" src="img/algolia-logo-darkbg.svg">
            </a>
            <p class="lead header-lead">
                Plugin for
                <span>WordPress</span>
            </p>
        </div>
    </div>
</header>

<div class="row m-a">
    <div class="medium-9 large-9 medium-push-3 large-push-3 columns">

        <article>
            <div id="algolia-search">
                <input type="text" id="algolia-search-input" placeholder="Search anywhere in the documentation...">
                <svg id="search-icon" width="40" height="40" viewBox="0 0 40 40" xmlns="http://www.w3.org/2000/svg"><path d="M26.424 31.143a2 2 0 0 1 .004-2.824l1.12-1.12a2 2 0 0 1 2.824-.005l-3.948 3.948zm5.01-2.886l7.02 7.018a2 2 0 0 1 0 2.83l-1.12 1.12a2 2 0 0 1-2.83 0l-7.018-7.02 3.95-3.948zm-16.012 2.587c8.517 0 15.422-6.905 15.422-15.422S23.94 0 15.422 0 0 6.905 0 15.422s6.905 15.422 15.422 15.422zm0-3.856c6.388 0 11.566-5.178 11.566-11.566 0-6.388-5.178-11.567-11.566-11.567-6.388 0-11.567 5.18-11.567 11.567 0 6.388 5.18 11.566 11.567 11.566z" fill-rule="evenodd"/></svg>
                <svg id="search-clear-icon"width="40" height="40" viewBox="0 0 40 40" xmlns="http://www.w3.org/2000/svg"><path d="M16.228 20L1.886 5.657 0 3.772 3.772 0l1.885 1.886L20 16.228 34.343 1.886 36.228 0 40 3.772l-1.886 1.885L23.772 20l14.342 14.343L40 36.228 36.228 40l-1.885-1.886L20 23.772 5.657 38.114 3.772 40 0 36.228l1.886-1.885L16.228 20z" fill-rule="evenodd"/></svg>
            </div>

            <header>
                <h1>{{ title }}</h1>

                <p class="lead">{{ description }}</p>
            </header>

            <hr>

            <div class="row">
                <div class="large-12 columns" id="content">
                    <div class="alert alert-error">
                        Algolia Search plugin for WordPress is <strong>no longer supported</strong>. Please <a href="https://www.algolia.com/doc/integration/wordpress/getting-started/quick-start/">use our API client guide instead</a>.
                        <br>
                        Please note that if you already have the plugin set up and are satisfied with your current integration, you can keep using the plugin forever, knowing that it won’t be supported. It will still work as is, in its current state, on your website.
                        <br>
                        If you want to know more, <a href="https://community.algolia.com/wordpress/">click here</a>.
                    </div>
                    {{{ contents }}}
                </div>
            </div>
        </article>
    </div>

    <div class="medium-3 large-3 medium-pull-9 large-pull-9 columns">
        <ul class="vertical menu" id="main-nav">

            <li class="menu-text">Getting Started</li>
            <li {{ activeClass "installation.md"}}><a href="{{ rootPath }}installation.html">Installation</a></li>
            <li {{ activeClass "configuration.md" }}><a href="{{ rootPath }}configuration.html">Getting Started</a></li>
            <li {{ activeClass "customize-autocomplete.md" }}><a href="{{ rootPath }}customize-autocomplete.html">Customize Autocomplete</a></li>
            <li {{ activeClass "customize-search-page.md" }}><a href="{{ rootPath }}customize-search-page.html">Customize Search Page</a></li>
            <li {{ activeClass "upgrade.md" }}><a href="{{ rootPath }}upgrade.html">Upgrade</a></li>

            <li class="menu-text">Indexing</li>
            <li {{ activeClass "index-schema.md" }}><a href="{{ rootPath }}index-schema.html">Schemas</a></li>
            <li {{ activeClass "indexing-settings.md" }}><a href="{{ rootPath }}indexing-settings.html">Settings</a></li>
            <li {{ activeClass "indexing-flow.md" }}><a href="{{ rootPath }}indexing-flow.html">Automated Sync.</a></li>
            <li {{ activeClass "synonyms.md" }}><a href="{{ rootPath }}synonyms.html">Synonyms</a></li>
            <li {{ activeClass "custom-attributes.md" }}><a href="{{ rootPath }}custom-attributes.html">Custom Attributes</a></li>
            <li {{ activeClass "replicas.md" }}><a href="{{ rootPath }}replicas.html">Index Replicas</a></li>
            <li {{ activeClass "migration.md" }}><a href="{{ rootPath }}migration.html">Migration Guide</a></li>

            <li class="menu-text">Code References</li>
            <li {{ activeClass "extend-basics.md" }}><a href="{{ rootPath }}extend-basics.html">Extend & Customize</a></li>
            <li {{ activeClass "constants.md" }}><a href="{{ rootPath }}constants.html">Constants</a></li>
            <li {{ activeClass "filters.md" }}><a href="{{ rootPath }}filters.html">Filter Hooks</a></li>
            <li {{ activeClass "actions.md" }}><a href="{{ rootPath }}actions.html">Action Hooks</a></li>

            <li class="menu-text">Integrations</li>
            <li {{ activeClass "woocommerce.md" }}><a href="{{ rootPath }}woocommerce.html">WooCommerce</a></li>
            <li {{ activeClass "advanced-custom-fields.md" }}><a href="{{ rootPath }}advanced-custom-fields.html">Advanced Custom Fields</a></li>
            <li {{ activeClass "polylang.md" }}><a href="{{ rootPath }}polylang.html">Polylang</a></li>
            <li {{ activeClass "wpml.md" }}><a href="{{ rootPath }}wpml.html">WPML</a></li>
            <li {{ activeClass "wp-cli.md" }}><a href="{{ rootPath }}wp-cli.html">WP-CLI</a></li>

            <li class="menu-text">Theme Development</li>
            <li {{ activeClass "customize-templates.md" }}><a href="{{ rootPath }}customize-templates.html">Customize Templates</a></li>

            <li class="menu-text">Debugging</li>
            <li {{ activeClass "logs.md" }}><a href="{{ rootPath }}logs.html">Logs</a></li>

            <li class="menu-text">Other</li>
            <li {{ activeClass "internationalization.md" }}><a href="{{ rootPath }}internationalization.html">Internationalization</a></li>
            <li {{ activeClass "resources.md" }}><a href="{{ rootPath }}resources.html">Additional Resources</a></li>
            <li {{ activeClass "contribute.md" }}><a href="{{ rootPath }}contribute.html">Contribute</a></li>
            <li {{ activeClass "frequently-asked-questions.md" }}><a href="{{ rootPath }}frequently-asked-questions.html">FAQ</a></li>
        </ul>
    </div>

</div>
</div>

{{> footer }}
