Link to a specific location in a Flask template

Question

In HTML I can link directly to a specific location on a page, assuming there's an element with the given id:

<a href="http://www.example.com/stuff.html#exactlocation">Go there</a>

In Flask I tried to add the anchor to render_template but I get jinja2.exceptions.TemplateNotFound: stuff.html#exactlocation.

@main.route('/exactlocation')
def exactlocation():
    return render_template('stuff.html#exactlocation')

How do I link to a specific location in a template?

That's browser behavior. Just render your template normally and the browser will take care of it (assuming you have the named anchor on the page). — dirn, Mar 07 '16 at 12:44
@dirn I'm not sure what you mean. If I use return render_template('stuff.html') how does the browser know to go to a specific location on the page rather than the top, run javascript check on page load? — Don Smythe, Mar 07 '16 at 13:05
Browsers will jump to named anchors automatically, no JavaScript needed. The only requirement is that the named anchor (i.e., ``) exists in the HTML. — dirn, Mar 07 '16 at 13:07

score 29 · Accepted Answer · edited Aug 03 '17 at 14:45

29

Thanks to dirn's comments I managed to get this working with the code below.

Pass the _anchor keyword to url_for to append an anchor to the generated URL.

nav menu:

<a href="{{ url_for('.stuff', _anchor='exactlocation') }}">Go to specific id on suff page</a>

Flask route:

@main.route('/')
def stuff():
    return render_template('stuff.html')

stuff.html:

...
<section id="exactlocation">
...

edited Aug 03 '17 at 14:45

davidism

answered Mar 07 '16 at 13:23

Don Smythe

1 Answers1