- Rich text editing implemented with TinyMCE
- Full inline image upload support via TinyMCE using grapelli and filebrowser modules
- Automatic image scales for posts
- Support for post tagging
- Support for comments in posts
- Code syntax highlighting with pygments
- Comment spam prevention through integration with django-simple-captcha
- Atom and RSS feed support
- Templates included to provide examples of how django-richtext-blog can be used
- SEO optimised urls for posts and tags
Included is all the templates the blog system uses to display posts, tags etc.
If you're familiar enough with django you might be able to jump straight in, otherwise below are the steps to get it up and running in its most basic form.
The author uses this app to implement his own blog therefore a working example can be found in the wild here http://www.wholebaked.com.au/blog/posts/
For bug reports or the latest bleeding edge version go to the GitHub project page https://github.com/timmygee/django-richtext-blog
By far the simplest way to install the latest stable vesrion is to use pip or easy_install:
$ pip install django-richtext-blog
This will pull in any missing package dependencies also.
Next step is to set up a django site that will use the blog app.
Currently django-richtext-blog requires django 1.3 to work correctly due to the fact that it uses django-filebrowser to implement inline image uploads. Perhaps one day django-filebrowser will be taken to django 1.4 and then this package in turn can be upgraded.
django-filebrowser also currently requires django-grapelli for its implementation of features on the admin pages. There is a version of django-filebrowser that does not use django-grapelli (http://pypi.python.org/pypi/django-filebrowser-django13 ) but is as yet untested with this app. The below instructions assume the inclusion of django-grapelli.
Assuming that django is installed you should have the django-admin.py
script in the system path. Set up a new site project:
$ django-admin.py startproject myblogsite
Next configure your project to use the blog app and its dependencies by editing
myblogsite/settings.py
. For a full explanation of these steps see the
django tutorial documentation at
https://docs.djangoproject.com/en/1.3/intro/tutorial01/
At the top of settings.py
add the lines:
import os PROJECT_HOME=os.path.dirname(os.path.realpath(__file__))
Make sure you set up your database and admin log in preferences while you're there.
Update the MEDIA_URL
line to read:
MEDIA_URL = '/media/'
Update STATIC_ROOT
to:
STATIC_ROOT = os.path.join(PROJECT_HOME, 'static')
Update ADMIN_MEDIA_PREFIX
to:
ADMIN_MEDIA_PREFIX = STATIC_URL + 'grappelli/'
In the INSTALLED_APPS
setting add tinymce
, grappelli.dashboard
,
grappelli
, filebrowser
and captcha
before the entry for
django.contrib.admin
. Make sure the django.contrib.admin
line is
un-commented as well. After django.contrib.admindocs
add an entry for
richtext_blog
. The resulting INSTALLED_APPS
setting might look like:
INSTALLED_APPS = ( 'django.contrib.auth', 'django.contrib.contenttypes', 'django.contrib.sessions', 'django.contrib.sites', 'django.contrib.messages', 'django.contrib.staticfiles', 'tinymce', 'grappelli.dashboard', 'grappelli', 'filebrowser', 'captcha', # Uncomment the next line to enable the admin: 'django.contrib.admin', # Uncomment the next line to enable admin documentation: 'django.contrib.admindocs', 'richtext_blog' )
Add a TEMPLATE_CONTEXT_PROCESSORS
setting and make sure it looks like:
TEMPLATE_CONTEXT_PROCESSORS = ( 'django.contrib.auth.context_processors.auth', 'django.core.context_processors.i18n', 'django.core.context_processors.media', 'django.core.context_processors.static', 'django.core.context_processors.csrf', 'django.contrib.messages.context_processors.messages', 'django.core.context_processors.request', # django-richtext-blog context processors 'richtext_blog.context_processors.blog_global' )
Add the below lines to the bottom of the settings.py
file to implement
some default settings for the various dependencies:
# TinyMCE settings TINYMCE_COMPRESSOR = True TINYMCE_DEFAULT_CONFIG = { 'width': '760', 'height': '480', 'plugins': 'fullscreen,media,preview,paste', 'theme': 'advanced', 'relative_urls': False, 'theme_advanced_toolbar_location': 'top', 'theme_advanced_toolbar_align': 'left', 'theme_advanced_buttons1': 'bold,italic,underline,strikethrough,|,' \ 'justifyleft,justifycenter,justifyright,justifyfull,|,forecolor,' \ 'formatselect,sub,sup,removeformat,charmap,|,bullist,numlist,|,' \ 'indent,outdent,|,link,unlink,anchor,image,media,|,visualaid,code,' \ 'preview,fullscreen', 'theme_advanced_buttons2': 'undo,redo,|,cut,copy,paste,pasteword,' \ 'pastetext,selectall,|,cleanup,help,|,hr', 'theme_advanced_buttons3': '', 'theme_advanced_blockformats': 'p,pre,address,blockquote,h1,h2,h3,h4,' \ 'h5,h6', 'plugin_preview_width' : '800', 'plugin_preview_height' : '600', 'paste_auto_cleanup_on_paste': 'true', } # Filebrowser settings FILEBROWSER_DIRECTORY = 'uploads/' # Grappelli settings GRAPPELLI_INDEX_DASHBOARD = \ 'richtext_blog.custom_dashboard.CustomIndexDashboard' # richtext_blog settings SLUGS_EDITABLE = True SITE_DESCRIPTION = 'My blog site'
A full list of TinyMCE configuration options can be found at http://www.tinymce.com/wiki.php/Configuration The author spent a little time tweaking TinyMCE to his preferences so feel free to play around with your own settings. The current settings are fairly sufficient for most purposes however.
Next you need to edit myblogsite/urls.py
. Add the includes:
from filebrowser.sites import site from django.conf import settings
Make sure admin is implemented:
from django.contrib import admin admin.autodiscover()
Next add the url pattern for adding django-richtext-blog to the root of the site:
url(r'', include('richtext_blog.urls')),
Add the url pattern for the 3rd party dependencies:
url(r'^tinymce/', include('tinymce.urls')), url(r'^admin/filebrowser/', include(site.urls)), url(r'^grappelli/', include('grappelli.urls')), url(r'^captcha/', include('captcha.urls')),
And the url pattern for the admin pages if not there already:
url(r'^admin/', include(admin.site.urls)),
For live setups you may need the following pattern so that uploaded images are viewable:
url(r'^media/(?P<path>.*)$', 'django.views.static.serve', {'document_root': settings.MEDIA_ROOT}),
All rolled up into the one file your urls.py
might look something like:
from django.conf.urls.defaults import patterns, include, url from filebrowser.sites import site from django.conf import settings # Uncomment the next two lines to enable the admin: from django.contrib import admin admin.autodiscover() urlpatterns = patterns('', # richtext_blog definitions url(r'', include('richtext_blog.urls')), # 3rd party url definitions url(r'^tinymce/', include('tinymce.urls')), url(r'^admin/filebrowser/', include(site.urls)), url(r'^grappelli/', include('grappelli.urls')), url(r'^captcha/', include('captcha.urls')), url(r'^admin/', include(admin.site.urls)), # Media url(r'^media/(?P<path>.*)$', 'django.views.static.serve', {'document_root': settings.MEDIA_ROOT}), )
Save the file, then it's just the matter of preparing the database:
$ python myblogsite/manage.py syncdb
And if all went well you should be able to run it:
$ python myblogsite/manage.py runserver
Creating a new post is all done from the admin pages. Comments can be added and moderated when viewing a post in the admin section. Author comments can appear a different colour to public comments on the public side of the site.
The image upload button on TinyMCE when editing a post will open up a the django-filebrowser dialogue where existing uploaded images can be chosen or new ones uploaded. The image scale can be selected here too.
For syntax highlighting code, the code text must be contained within a
<pre></pre>
block. TinyMCE has a shortcut to this in the formatting
drop-down menu listed as Preformatted. Pygments will try to guess the code
format but for more accurate control a css class attribute can be provided
that defines the format of the content. For python code simply add a
class="python"
to the <pre>
tag in TinyMCE's HTML edit mode so the
opening tag would read <pre class="python">
. For simple command line
formatting use class="console"
. For a full list of class names that
can be used, check the list of lexers pygments supports at
http://pygments.org/docs/lexers/ . What is listed under Short names is what
should be used as the class name.
A default css stylesheet richtext_blog/static/blog-style.css
is provided
that implements default styles but can be overidden easily.
http://www.wholebaked.com.au/blog/posts/ is a good example of how custom
styles can change the appearance quite dramatically.
richtext_blog/templates/base.html
provides an example of how all the
current features can be rolled up into a site and also shows how to implement
the blog's sidebar features.