Skip to main content

Library to easy install, configure and use Semantic UI framework with Django project

Project description

Django Semantic UI

Easy python package that allow install, configure and use Semantic UI Framework with a Django project.

Requirements

  • npm (last stable version)
  • Python 2.7.x
  • Django 1.11.x

Installing

  • Install gulp (CLI), the version 3.9.1 is the available to work with Semantic UI Framework.
$ sudo npm install -g gulp@3.9.1
  • Install the django-semantic-ui package:
$ pip install django-semantic-ui
  • Configure django-semantic-ui in the settings.py:
INSTALLED_APPS = [
    ...,
    'django_semantic_ui',
]
  • 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
  • Running the gulp build command
$ python manage.py semantic_ui gulp_build --semantic_folder=semantic

NOTE: The argument "--semantic_folder" is the name assigned to the "semantic" folder on the above step

Settings

STATIC_URL = '/static/'
STATICFILES_DIRS = (
    ...,
    ('semantic', os.path.join(BASE_DIR, 'static/semantic')),
)
STATIC_ROOT = os.path.join(BASE_DIR, 'static')
  • Add CSS and JS to your django project
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Semantic UI Test</title>
    <link type="text/css" rel="stylesheet" href="{{ STATIC_URL }}semantic/dist/semantic.min.css">
</head>
<body>
    <h1>Title example</h1>
    <button>Button Test example</button>
    <script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script>
    <script src="{{ STATIC_URL }}semantic/dist/semantic.min.js"></script>
</body>
</html>

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'

Uninstall django-semantic-ui

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

Releases notes:

  • 1.0.0: Initial and beta version (only installation and settings)

Project details


Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Source Distribution

django_semantic_ui-1.0.0.tar.gz (4.4 kB view details)

Uploaded Source

File details

Details for the file django_semantic_ui-1.0.0.tar.gz.

File metadata

  • Download URL: django_semantic_ui-1.0.0.tar.gz
  • Upload date:
  • Size: 4.4 kB
  • Tags: Source
  • Uploaded using Trusted Publishing? No
  • Uploaded via: twine/1.12.1 pkginfo/1.4.2 requests/2.21.0 setuptools/40.6.3 requests-toolbelt/0.8.0 tqdm/4.28.1 CPython/2.7.14

File hashes

Hashes for django_semantic_ui-1.0.0.tar.gz
Algorithm Hash digest
SHA256 e09f97b345890bb4bb110cd33149e8cef9c84040449f1dd3b1cf41cca902226d
MD5 71901a7bd3750ed1d1d5397c419d926f
BLAKE2b-256 e3e39592333b048864f2ede33338dff0675f101d74aefac6fc9019bd406e1675

See more details on using hashes here.

Supported by

AWS Cloud computing and Security Sponsor Datadog Monitoring Fastly CDN Google Download Analytics Pingdom Monitoring Sentry Error logging StatusPage Status page