Skip to content

Commit f4150c8

Browse files
update README with additional documentation (#36)
1 parent 39d795a commit f4150c8

File tree

1 file changed

+112
-12
lines changed

1 file changed

+112
-12
lines changed

README.md

Lines changed: 112 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
<!-- django-3.2 | 4.2 | 5.0-#44B78B -->
88
<!-- labelColor=%23092E20 -->
99

10-
`django-simple-nav` is a Python/Django application designed to simplify the integration of navigation and menu bars in your Django projects. With a straightforward API and customizable options, you can easily add and manage navigational elements in your web applications.
10+
`django-simple-nav` is a Python/Django application designed to simplify the integration of navigation and menu bars in your Django projects. With a straightforward API and customizable options, you can easily add and manage navigational elements in your web applications. It is designed to be simple to start with, but flexible enough to handle complex navigation structures while maintaining that same simplicity.
1111

1212
## Requirements
1313

@@ -16,13 +16,13 @@
1616

1717
## Getting Started
1818

19-
1. Install the package from PyPI:
19+
1. **Install the package from PyPI.**
2020

2121
```bash
2222
python -m pip install django-simple-nav
2323
```
2424

25-
2. **Add to Installed Apps**:
25+
2. **Add `django_simple_nav` to `INSTALLED_APPS`.**
2626

2727
After installation, add `django_simple_nav` to your `INSTALLED_APPS` in your Django settings:
2828

@@ -36,11 +36,33 @@
3636

3737
## Usage
3838

39-
1. **Create a navigation definition**:
39+
1. **Create a navigation definition.**
4040

41-
Define your navigation structure in a Python file. Here's an example configuration:
41+
Define your navigation structure in a Python file. This file can be located anywhere in your Django project, provided it's importable. You can also split the navigations across multiple files if desired.
42+
43+
A good starting point is to create a single `nav.py` or `navigation.py` file in your Django project's main configuration directory (where your `settings.py` file is located).
44+
45+
`django-simple-nav` provides three classes to help you define your navigation structure:
46+
47+
- `Nav`: The main container for a navigation structure. It has two required attributes:
48+
- `template_name`: The name of the template to render the navigation structure.
49+
- `items`: A list of `NavItem` or `NavGroup` objects that represent the navigation structure.
50+
- `NavGroup`: A container for a group of `NavItem` or `NavGroup` objects. It has two required and three optional attributes:
51+
- `title`: The title of the group.
52+
- `items`: A list of `NavItem` or `NavGroup`objects that represent the structure of the group.
53+
- `url` (optional): The URL of the group. If not provided, the group will not be a link but just a container for the items.
54+
- `permissions` (optional): A list of permissions that control the visibility of the group.
55+
- `extra_context` (optional): A dictionary of additional context to pass to the template when rendering the navigation.
56+
- `NavItem`: A single navigation item. It has two required and three optional attributes:
57+
- `title`: The title of the item.
58+
- `url`: The URL of the item. This can be a URL string (e.g. `https://example.com/about/` or `/about/`) or a Django URL name (e.g. `about-view`).
59+
- `permissions` (optional): A list of permissions that control the visibility of the item.
60+
- `extra_context` (optional): A dictionary of additional context to pass to the template when rendering the navigation.
61+
62+
Here's an example configuration:
4263

4364
```python
65+
# config/nav.py
4466
from django_simple_nav.nav import Nav
4567
from django_simple_nav.nav import NavGroup
4668
from django_simple_nav.nav import NavItem
@@ -61,6 +83,12 @@
6183
NavItem(title="Internal Django URL by Name", url="fake-view"),
6284
],
6385
),
86+
NavGroup(
87+
title="Container Group",
88+
items=[
89+
NavItem(title="Item", url="#"),
90+
],
91+
),
6492
NavItem(
6593
title="is_authenticated Item", url="#", permissions=["is_authenticated"]
6694
),
@@ -69,26 +97,98 @@
6997
NavItem(
7098
title="myapp.django_perm Item", url="#", permissions=["myapp.django_perm"]
7199
),
100+
NavGroup(
101+
title="Group with Extra Context",
102+
items=[
103+
NavItem(
104+
title="Item with Extra Context",
105+
url="#",
106+
extra_context={"foo": "bar"},
107+
),
108+
],
109+
extra_context={"baz": "qux"},
110+
),
72111
]
73112
```
74113

75-
2. **Integrate Navigation in Templates**:
114+
2. **Create a template for the navigation.**
115+
116+
Create a template to render the navigation structure. This is just a standard Django template so you can use any Django template features you like.
117+
118+
Any items with permissions attached will automatically filtered out before rendering the template based on the request user's permissions, so you don't need to worry about that in your template.
119+
120+
Items with extra context will have that context passed to the template when rendering the navigation, which you can access either directly or through the `item.extra_context` attribute.
121+
122+
For example, given the above example `MainNav`, you could create a `main_nav.html` template:
123+
124+
```htmldjango
125+
<!-- main_nav.html -->
126+
<ul>
127+
{% for item in nav.items %}
128+
<li>
129+
<a href="{{ item.url }}"{% if item.active %} class="active"{% endif %}{% if item.baz %} data-baz="{{ item.baz }}"{% endif %}>
130+
{{ item.title }}
131+
</a>
132+
{% if item.items %}
133+
<ul>
134+
{% for subitem in item.items %}
135+
<li>
136+
<a href="{{ subitem.url }}"{% if subitem.active %} class="active"{% endif %}{% if item.extra_context.foo %} data-foo="{{ item.extra_context.foo }}"{% endif %}>
137+
{{ subitem.title }}
138+
</a>
139+
</li>
140+
{% endfor %}
141+
</ul>
142+
{% endif %}
143+
</li>
144+
{% endfor %}
145+
</ul>
146+
```
147+
148+
3. **Integrate navigation in templates.**:
76149

77150
Use the `django_simple_nav` template tag in your Django templates where you want to display the navigation.
78151

79152
For example:
80153

81-
```html
154+
```htmldjango
155+
<!-- base.html -->
82156
{% load django_simple_nav %}
83-
...
84157
<nav>
85-
{% django_simple_nav 'path.to.MainNav' %}
158+
{% django_simple_nav "path.to.MainNav" %}
86159
</nav>
87-
...
88160
```
89161

90-
After configuring your navigation, you can use it across your Django project by calling the `django_simple_nav` template tag in your templates.
91-
This tag dynamically renders navigation based on your defined structure, ensuring a consistent and flexible navigation experience throughout your application.
162+
The template tag can either take a string representing the import path to your navigation definition or an instance of your navigation class:
163+
164+
```python
165+
# example_app/views.py
166+
from config.nav import MainNav
167+
168+
169+
def example_view(request):
170+
return render(request, "example_app/example_template.html", {"nav": MainNav()})
171+
```
172+
173+
```htmldjango
174+
<!-- base.html -->
175+
{% load django_simple_nav %}
176+
<nav>
177+
{% django_simple_nav nav %}
178+
</nav>
179+
```
180+
181+
Additionally, the template tag can take a second argument to specify the template to use for rendering the navigation. This is useful if you want to use the same navigation structure in multiple places but render it differently.
182+
183+
```htmldjango
184+
<!-- base.html -->
185+
{% load django_simple_nav %}
186+
<footer>
187+
{% django_simple_nav "path.to.MainNav" "footer_nav.html" %}
188+
</footer>
189+
```
190+
191+
After configuring your navigation, you can use it across your Django project by calling the `django_simple_nav` template tag in your templates. This tag dynamically renders navigation based on your defined structure, ensuring a consistent and flexible navigation experience throughout your application.
92192

93193
## Documentation
94194

0 commit comments

Comments
 (0)