Hierarchische / Tree Navigation

Created: 2026/06/12, Updated: 2026/07/01,05:03:31

Subpages Menu

Eine Hierarchische oder auch "Tree" Navigation ermöglicht eine Art von Kategorisierung von Seiteninhalten in einer Webseite bzw. Produkten in einem Online Shop (E-Commerce) System. Es erleichtert das Finden von Inhalten, da diese hiermit besser strukturiert werden angeboten werden können.
Um eine Treeview Navigation zu realisieren, bietet sich für Ruby On Rails das Gem Ancestry an. Nachdem das Gem installiert wurde, kann jedem beliebigen Modell diese Option hinzugefügt werden. Es müssen dem entsprechenden Model nur 2 zusätzliche Felder in der Datenbank hinzugefügt werden.
Als Beispiel habe ich bei dieser Webseite das im Modell Page integriert.

Hier nun die notwendigen Schritte.

Gem Ancestry installieren und in ein Model integrieren

Gemfile:

# https://github.com/stefankroes/ancestry
gem "ancestry", "~> 5.1.0" # (5.1.0 2026.06.10)

Bundle install ausführen:

./bin/bundle install
Fetching gem metadata from https://rubygems.org/.........
Fetching ancestry 5.1.0
Installing ancestry 5.1.0
Bundle complete! 36 Gemfile dependencies, 132 gems now installed.
Use `bundle info [gemname]` to see where a bundled gem is installed.
Post-install message from ancestry:
Thank you for installing Ancestry. You can visit http://github.com/stefankroes/ancestry to read the documentation.

./bin/bundle info ancestry
 * ancestry (5.1.0)
    Summary: Organize ActiveRecord model into a tree structure
    Homepage: https://github.com/stefankroes/ancestry
    Source Code: https://github.com/stefankroes/ancestry/
    Changelog: https://github.com/stefankroes/ancestry/blob/master/CHANGELOG.md
    Bug Tracker: https://github.com/stefankroes/ancestry/issues
    Path: /opt/ruby-4.0.5/lib/ruby/gems/4.0.0/gems/ancestry-5.1.0

config/initializers/03_ancestry.rb

# frozen_string_literal: true

# use the newer format
Ancestry.default_ancestry_format = :materialized_path2
# Ancestry.default_update_strategy = :sql

app/models/page.rb

# frozen_string_literal: true

class Page < ApplicationRecord

  has_ancestry orphan_strategy: :restrict, cache_depth: true, counter_cache: true

end