Wagtail adds '#' to {{page.slug}} in address bar

Question

I'm using Wagtail for a blog site with auto-populating blog links on a listing page.

However, when I click the link for the blog page, it adds a '#' to the address bar.

So, for example, I am working on localhost with the blog address of http://127.0.0.1:8000/blog/ and once I click on the blog link, with slug blog-slug, I get http://127.0.0.1:8000/blog/#/blog-slug. I am not sure why it is adding the hash tag at a location even behind the parent page 'blog'.

This is the code I have on the blog listing template:

                            {% for post in all_posts %}
                            <figure class="item standard" data-groups='["all"{% for tag in post.tags.all %},"{{tag}}"{% endfor %}]'>
                                <div class="portfolio-item-img">
                                    {% image post.blog_image max-350x200 as img %}
                                    <img src="{{img.url}}" alt="{{img.alt}}" title="">
                                    <a href="{{post.slug}}" class="ajax-page-load"></a> <!-- Blog slug -->
                                    <br>
                                    <i class="{{post.icon}}"></i>
                                    <p>{{post.gallery_text|safe|truncatewords:30}}</p>
                                </div>
                                <h4 class="name">
                                    {{post.title}}
                                </h4>
                                <div class="post-info">
                                    <div class="post-date">
                                        <strong>Tags:</strong>
                                        {% for tag in post.tags.all %}| {{tag}} |{% endfor %}
                                    </div>
                                    <div class="post-date">{{post.published_date}}</div>
                                </div>
                            </figure>                            
                            {% endfor %}

Any ideas what could be going wrong?

Answer 1

You likely have some Javascript that does that to links that have the (rather telltale named) ajax-page-load class.