Coder Social home page Coder Social logo

drlior / djangocms-picture Goto Github PK

View Code? Open in Web Editor NEW

This project forked from django-cms/djangocms-picture

0.0 2.0 0.0 331 KB

django CMS Picture is a plugin for django CMS that allows you to add images on your site.

Home Page: https://marketplace.django-cms.org/en/addons/browse/djangocms-picture/

License: Other

Python 91.89% HTML 8.11%

djangocms-picture's Introduction

django CMS Picture

pypi build coverage

django CMS Picture is a plugin for django CMS that allows you to add images on your site.

This addon is compatible with Divio Cloud and is also available on the django CMS Marketplace for easy installation.

preview.gif

Contributing

This is a an open-source project. We'll be delighted to receive your feedback in the form of issues and pull requests. Before submitting your pull request, please review our contribution guidelines.

One of the easiest contributions you can make is helping to translate this addon on Transifex.

Documentation

See REQUIREMENTS in the setup.py file for additional dependencies:

  • Python 2.7, 3.3 or higher
  • Django 1.8 or higher
  • Django Filer 1.2.4 or higher

Make sure django Filer is installed and configured appropriately.

Installation

For a manual install:

  • run pip install djangocms-picture
  • add djangocms_picture to your INSTALLED_APPS
  • run python manage.py migrate djangocms_picture

Configuration

Note that the provided templates are very minimal by design. You are encouraged to adapt and override them to your project's requirements.

This addon provides a default template for all instances. You can provide additional template choices by adding a DJANGOCMS_PICTURE_TEMPLATES setting:

DJANGOCMS_PICTURE_TEMPLATES = [
    ('background', _('Background image')),
]

You'll need to create the background folder inside templates/djangocms_picture/ otherwise you will get a template does not exist error. You can do this by copying the default folder inside that directory and renaming it to background.

Another setting is DJANGOCMS_PICTURE_NESTING, which allows you to render an image as the background image of a container that also contains other content (text, icons and so on).

DJANGOCMS_PICTURE_NESTING = True

will enable this (the default is False). When set to True, you'll be able to place additional plugins inside the picture plugin.

You can override alignment styles with DJANGOCMS_PICTURE_ALIGN, for example:

DJANGOCMS_PICTURE_ALIGN = [
    ('top', _('Top Aligned')),
]

This will generate a class prefixed with align-. The example above would produce a class="align-top". Adding a class key to the image attributes automatically merges the alignment with the attribute class.

You can use DJANGOCMS_PICTURE_RATIO to set the width/height ratio of images if these values are not set explicitly on the image:

DJANGOCMS_PICTURE_RATIO = 1.618

We use the golden ratio, approximately 1.618, as a default value for this.

When working out sizes for the image, the system will use the following values, of preference:

  • the width or height set in the Thumbnail options
  • Autoscale
  • the Width and Height

We recommend setting width or height values around a placeholder so when the plugin uses Autoscale it can discover them:

{% with 720 as width and 480 as height %}
    {% placeholder content %}
{% endwith %}

Further configuration can be achieved through django Filer.

Running Tests

You can run tests by executing:

virtualenv env
source env/bin/activate
pip install -r tests/requirements.txt
python setup.py test

djangocms-picture's People

Contributors

finalangel avatar mkoistinen avatar digi604 avatar yakky avatar chive avatar stefanfoulis avatar vxsx avatar georgebrightinteractive avatar driesdesmet avatar luisza avatar nickstenning avatar atomicspark avatar derek73 avatar

Watchers

James Cloos avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.