Skip to content

Latest commit

 

History

History
130 lines (114 loc) · 3.96 KB

README.md

File metadata and controls

130 lines (114 loc) · 3.96 KB

Django Semantic UI

Easy python package that allow install, configure and use Semantic UI Framework with a Django project (Python 3.x).

Requirements

  • npm (last stable version)
  • Python 3.6.x
  • Django 2.x.x

Installing

  1. Install gulp (CLI), the version 3.9.1 is the available to work with Semantic UI Framework.
$ sudo npm install -g [email protected]
  1. Install the django2-semantic-ui package:
$ pip install django2-semantic-ui
  1. Configure django2-semantic-ui in the settings.py:
INSTALLED_APPS = [
    ...,
    'django_semantic_ui',
]
  1. Running the install command
$ python manage.py semantic_ui install

NOTE: You need to define the settings required to install semantic-ui module, see: Install Semantic

  • You can use the follow options when the semantic-ui module is configured:
❯ Automatic (Use default locations and all components)

? We detected you are using NPM Nice! Is this your project folder? /home/franklinitiel/Documents/TSJ/projects/personal/python_tests/semanticui/static (Use arrow keys)
❯ Yes

? Where should we put Semantic UI inside your project? (semantic/) semantic
  1. Running the gulp build command
$ python manage.py semantic_ui gulp_build
  1. Add 'django.template.context_processors.static' to context_processors option on the TEMPLATES settings
# settings.py
# TEMPLATES settings
'context_processors': [
    ...,
    'django.template.context_processors.static',
    ...,
]
  1. Configure the static files and folder, see: Managing static files
STATIC_URL = '/static/'
  1. Add CSS and JS to your django project
{% load dsu %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Semantic UI Test</title>
    {% dsu_stylesheet_url %}
</head>
<body>
    <!-- Your HTML code -->
    {% dsu_jquery_url %}
    {% dsu_javascript_url %}
</body>
</html>

Settings Production environment

STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'static')
  • And execute the collectstatic command
$ python manage.py collectstatic

Additional settings

  • GULP_VERSION by default is None, if you want to install a specific version of gulp module (local), you can use this settings, by example:
# settings.py
GULP_VERSION = '3.9.1'
  • SEMANTIC_UI_VERSION by default is None, if you want to install a specific version of semantic-ui module (local), you can use this settings, by example:
# settings.py
SEMANTIC_UI_VERSION = '^2.4.2'
  • SEMANTIC_DIRNAME by default is 'semantic'', if you have defined a custom dirname for the JS and CSS files when the Semantic UI Framework was installed (step 4), you need to add it on this settings.
# settings.py
SEMANTIC_DIRNAME = 'semantic'
# settings.py
DSU_JQUERY_URL = '...your jquery path...'

Uninstall django-semantic-ui

  • You can uninstall Semantic UI Framework and Gulp (local version) using the follow command:
$ python manage.py semantic_ui uninstall && pip uninstall django2-semantic-ui

Releases notes:

  • 1.0.0: Initial and beta version (only installation and settings).
  • 1.0.1: New settings added on the README.md file
  • 1.1.0: Logic updated to install / uninstall django-semantic-ui, new settings added.
  • 1.1.1: README.md updated
  • 1.1.2: README.md updated
  • 1.2.0: New templatetags added to load the javascripts and stylesheets files
  • 1.2.1: README.md updated, bugs fixed to execute the command "python manage.py runserver" after installed.
  • 1.2.2: Bug fixes execute the command "pytho manage.py runserver"