Package: django-freeplay
django-freeplayFreeplay is a unique approach to easily add CMS functionality to
your Django app. Define regions for managing (and allowing clients to manage)
bits of content on your site that don’t need the full build-out of
custom apps. For example, that list of links in the footer, or the photo
and bio of the CEO. With Freeplay, each region can contain one or many
items, so you quickly gain flexible model-like functionality.Each bit of content gets rendered onsave with Django’s template
processor, so you have all the power of the Django’s parser.Installationpip installdjango-freeplayAdd'freeplay'and'relatedwidget'to yourINSTALLED_APPSin your project’s settings.pyAdd(r"^admin/content/",include("freeplay.urls_admin")),to
your main urls.py, before you include the admin urlsSync your db or use your migration tool of choice
(recommended:nashvegas)RequirementsInstalling freeplay will also bringdjango-model-utils,django-imagekit,
anddjango-relatedadminwidgetwith it.The admin templates assume the existence of a few CSS and JS libraries:Chosen,Masonry, andjQuery.Slugify. Place
the files here (in relation to your staticfiles directory) to “just make it
work”:chosen_v1.0.0/chosen.jquery.min.jsmasonry/jquery.masonry.min.jsjquery-slugify/dist/slugify.min.jsNote: All three of these can be installed quickly usingbower. Adddjango-bowerto your project if you haven’t yet!These paths can also be overridden with aFREEPLAYsetting in your settings
file:FREEPLAY={"CHOSEN_PATH":"some/path/chosen.js","SLUGIFY_PATH":"some/path/slugify.js","MASONRY_PATH":"some/path/masonry.js"}And for more advanced customization, you can always override the freeplay
templates with your own.UsageIn the django admin, create a new freeplayTemplate. Start by defining the
templatebitsand then write the templatecode. For example, let’s say we want to
manage a few FAQs. We’d create one bit like so:Kind: Plain TextName: QuestionContext name: questionOrder: 1Text Widget: Textarea Input FieldRequired: TrueAnd another:Kind: MarkdownName: AnswerContext name: answerOrder: 2Text Widget: Textarea Input FieldRequired: True(Note: if you use Markdown, be sure you’ve addedmarkdownto your
requirements)When you set up the bits for a template, you’re defining the form that you
or your clients will use to add and edit content for items that use this
template. As such, you can include help text with each bit.Now we can write the following for the template Code:<spanclass="number">{{ order }}</span>{{ question|title }}<divclass="answer">{{ answer|safe }}</div>Note we need to use thesafefilter for HTML content, and also that each
item will include its “order” in context as well as “label”.As soon as you have a template, create aRegionand then you can start adding
content, which is easily done using the included admin urls and templates.TemplatetagsHere’s how you fetch and display freeplay content in your templates:{% load freeplay_tags %}content_bits: assignment tag, accepts “region_slug” as argument{% content_bits "question-answer" as qa_items %}
{% for item in qa_items %}<li>{{ item.data|safe }}</li>{% endfor %}get_bit: assignment tag, requires “region_slug” and, optionally, “item_slug”{% get_bit "site_constants" "footer-company-summary" as co_summary %}<footer><h1>About the Company</h1><p>{{ co_summary.data }}</p></footer>{% get_bit "footer-address" as address %}<footer><h1>Come Visit!</h1><p>{{ address.data }}</p></footer>ImagesImage bits can be rendered in your template using{{ item }}(if the context
name for this bit is “item”. Thisenerates the<img>tag including analtattribute. If you just want to get the image path, you can either use{{ item.contentbit.image_url }}or{{ item_url }}.AlsoFreeplay regions let you set “Min Items” and “Max Items”, optionally. On the
freeplay admin dashboard, it will then alert you if a region needs more content
to meet the minimum requirement and won’t show the “Add” link if the region has
met the maximum limit.Image constraints should be entered as width followed by height, separated with “x”: 150x80To display an image in your template, something like this will work:<imgsrc="{{ headshot.image_path }}"alt="Headshot">Or…{{ headshot.markup }}Hope you find this useful!