URL Query Filtering
By default, each page URL is treated as a separate page with separate comments, even if two different URLs show the same content. However, you can control how HashOver treats the page URL by using either or both of the methods below.
Using a Canonical URL
By default, HashOver will use a canonical URL when one is present. You can add
one by placing a
Canonical Link Element
in the
<head>
element of your website, if you do this properly HashOver will show the same
comments for URLs that show the same content.
Here is an example of a Canonical Link Element...
A canonical URL is designed to be the same for all URLs that show the same content, normally this is done by removing unimportant queries from the normal URL before using it as the canonical URL. This is done on the server-side, by using PHP for example, so by the time HashOver sees the page the URL in the Canonical Link Element should have already been processed.
Ignoring URL Queries
You can make HashOver ignore unwanted URL queries by either adding them on the
admin "URL Filtering" page, or by adding them to the
/hashover/config/ignored-queries.json
file. Adding a query name without a value will cause that query to be ignored no
matter what its value is. Adding a query name with a value (ie. name=value) will
cause only that specific query with that specific value to be ignored.
Ignoring specific URL queries allows URLs that are otherwise the same to get
treated as the same page by HashOver. For example, a website that has content in
multiple languages might have a URL query named "lang" that decides what
language to use. By default, HashOver will treat URLs like
https://example.com/page.html?lang=en
and
https://example.com/page.html?lang=jp
as separate pages, but if you add the "lang" query to the
ignored-queries.json
file these URLs will be treated as being the same page and display the same
comments.
Controlling the Behavior of HashOver
Assuming everything is setup properly, HashOver should "just work", it will automatically detect what page it is on and show comments for that page, it will automatically add the theme CSS to the page, among other things.
However, this automatic setup is not useful for every situation, such as displaying multiple comment forms on a single page, displaying comments from a different page, or adjusting the language based on what language is set on your website.
To do these things you need to use the loader script instead...
This script allows you to pass various information to HashOver before it appears on page. It allows you to specify where to display the comments, what page or thread to show comments for, and it even lets you override a limited number of settings.
Unlike the
comments.php
script, the loader script does not display comments until you instantiate an
instance. This allows you to dynamically load comments when an element is
clicked or a certain element is scrolled into view for example, it also allows
you to display the comments for a specific page when that page is loaded
dynamically via JavaScript.
You may instantiate an instance manually like this...
var hashover = new HashOver ();
</script>
You may tell HashOver to place the comments in a specific element like this...
var hashover = new HashOver ('comments');
</script>
You may load comments from a different page by passing the URL and title in the second parameter...
var hashover = new HashOver ('hashover', {
url: 'https://example.com/super/cool/article.html',
title: 'Super Cool Article Title'
});
</script>
You may override various settings by passing them as an object in the second parameter...
var hashover = new HashOver ('hashover', {
settings: {
language: 'de_DE',
formPosition: 'bottom',
websiteField: 'off'
}
});
</script>
This example sets the interface language to German, sets the primary comment
form position to below the posted comments, and disables the website field.
The
settings
object's key names can be hyphenated or camelCase. Some settings cannot be
adjusted from the frontend like this for security reasons, see the
Settings page for more information about each setting.
HashOver Object Syntax
Parameters
-
id
-
The ID of an element to add the comments to. If omitted, it defaults to
hashover
and is automatically suffixed with a dash and the instance number for every instance except the first. This parameter expects astring
value. -
options
-
An object containing the following information.
Name Type Description title
string
A page title. This title appears before the primary comment form. If omitted, the title of the page HashOver is being used on will be automatically detected and used instead. This title is collected as metadata for use in the various APIs that don't have direct access to the page they are showing comments for.
Here's an example...
<script type="text/javascript">
var hashover = new HashOver ('hashover', {
title: 'Super Cool Article Title'
});
</script>url
string
A page URL. This URL is used to differentiate the comments on each page from each other. This option allows you to display comments from a different page by passing in a different URL. If omitted, the URL of the page HashOver is being used on will be automatically detected and used instead. This URL is collected as metadata for use in the various APIs that don't have direct access to the page they are showing comments for.
Here's an example...
<script type="text/javascript">
var hashover = new HashOver ('hashover', {
url: 'https://example.com/super/cool/article.html'
});
</script>thread
string
The internal name of a comment thread. This option decides the name of the thread's directory under
/hashover/comments/threads
, or/hashover/comments/<domain>/threads
if support for multiple websites is enabled, or the value of thethread
column when storing the comments in an SQL database. If omitted, the thread name will be automatically generated based on the page URL.Here's an example...
<script type="text/javascript">
var hashover = new HashOver ('hashover', {
thread: 'super-cool-article'
});
</script>website
string
A website domain name. This is used to differentiate between comment threads that may have the same name but are on different websites. This option decides the name of the website's directory under
/hashover/comments
or the value of thewebsite
column when storing the comments in an SQL database.This option is only used when support for multiple websites is enabled. If omitted, the domain name will be automatically extracted from the client's request to your server.
Here's an example...
<script type="text/javascript">
var hashover = new HashOver ('hashover', {
website: 'example.com'
});
</script>canonical
boolean
Whether to pull the page URL from a Canonical Link Element in the
<head>
element rather than being automatically detected. If omitted, the Canonical Link Element is used.Here's an example...
<script type="text/javascript">
var hashover = new HashOver ('hashover', {
canonical: false
});
</script>settings
object
An object of settings to override. The key names can be hyphenated or camelCase. Not all settings are supported. For a complete list of all available settings see the Settings page for more information. If omitted, the default settings or those set in the
/hashover/config/settings.json
file will be used instead.Here's an example...
<script type="text/javascript">
var hashover = new HashOver ('hashover', {
settings: {
language: 'de_DE',
formPosition: 'bottom',
websiteField: 'off'
}
});
</script>This example sets the interface language to German, sets the primary comment form position to below the posted comments, and disables the website field.
-
instance
-
The instance number, which is used when there are multiple comment threads on a
single page. If omitted, it defaults to
1
and automatically increases each time a new HashOver instance is instantiated. This parameter expects anumber
value.