The Apostrophe Site module makes it easy to build websites with the Apostrophe content management system for Node.
It is easiest to start by cloning the Apostrophe sandbox project and pushing it up to your own repository. But skipping that step is pretty easy too. Let's assume you're starting from scratch.
Apostrophe itself requires:
- node, of course. You must have at least version
0.10
- mongodb version 2.2 or better, on your local machine (or point to another database server)
- imagemagick, to resize uploaded images (specifically the
convert
andidentify
command line tools)
Create a new git project, then run npm install apostrophe-site
to install the module.
Here's an app.js
that demonstrates most of the options. Most of this is optional, of course. root
, shortName
, hostName
, adminPassword
and sessionSecret
are required, and you almost certainly will want to add a few modules. Everything else is totally skippable.
var site = require('apostrophe-site')({
// Allows apostrophe-sites to require stuff
// on our behalf and also find our root folder
root: module,
// Used to name the local mongodb database,
// if you don't pass a db option with more details
shortName: 'mysite',
// Hostname you plan to give your site
hostName: 'mysite.com',
// Title of your site. Used as a prefix to page titles and feed titles by default
title: 'My Site',
// This defaults to true and delivers HTML, CSS and JS much faster via
// gzip transfer encoding. But you can set it to false if you must
compress: true,
// Apostrophe sizes your images to several awesome sizes right out of the box,
// but we're greedy and we want something bigger than full (1280)
addImageSizes: [
{
name: 'max',
width: 1600,
height: 1280
}
],
// By default the media library shows everyone's media until the user decides to
// change that with the "uploaded by" filter. Want the default to go the other way?
// Set the "owner" option as shown commented out below
mediaLibrary: {
// owner: 'user'
},
// Normally anyone who can edit a page or article etc. might
// introduce new tags. If this is set true, new tags can only
// be introduced via the admin tag editor
lockTags: false,
// Set up email transport via nodemailer. By default sendmail is used because
// it requires no configuration, but you may use any valid transport, see the
// nodemailer module documentation.
mailer: {
transport: 'sendmail',
transportOptions: {}
},
// You can always log in at /login as admin, with this password
adminPassword: 'SOMETHING SECURE PLEASE',
// If a visitor tries to access a secured page, give them
// a chance to log in and then be redirected to that page
secondChanceLogin: true,
// Invoked after login if secondChanceLogin is not set or
// did not result in a page the user was allowed to see
redirectAfterLogin: function(req, callback) {
if (req.user.permissions.admin) {
return callback('/awesomepeople');
} else {
return callback('/coolpeople');
}
},
// Run some middleware on ALL requests. This happens AFTER
// basics are in place like sessions and users and i18n.
// Middleware functions here may take an initial "site" argument
// in addition to req, res, next. Modules may also provide
// middleware simply by setting a "middleware" property on
// themselves
middleware: [ /* middleware, functions, galore */ ],
sessionSecret: 'SOMETHING RANDOM PLEASE',
// Minify all CSS and JS into a single file each (can be fine-tuned
// with other options). Great in production
minify: true,
// If the generated CSS has more than 4,095 rules, split into
// multiple imported CSS files to avoid a limitation of IE9 and below.
// This is disabled by default
bless: false,
// Any options accepted by the apostrophe-pages module,
// such as tabOptions and descendantOptions
pages: {
// List all the page types users should be able to add here, including
// things like "Blog" and "Events" that are powered by modules, so you get
// to pick the order
types: [
// TODO double check this doesn't get ignored if blog is added later and wasn't wanted
{ name: 'default', label: 'Default (Two Column)' },
{ name: 'home', label: 'Home Page' },
{ name: 'blog', label: 'Blog' },
{ name: 'events', label: 'Events' }
]
// Load descendants of homepage and current page two levels deep
// instead of one
tabOptions: { depth: 2 },
descendantOptions: { depth: 2 },
// Do something special if the URL doesn't match anything else
notfound: function(req, callback) {
if (req.url === '/special') {
req.redirect = '/specialer';
}
return callback(null);
}
// Run some middleware on the route that serves pages.
// This is not global middleware, see the top-level middleware option.
// Middleware functions may take an initial "site" argument
// in addition to req, res, next. Modules may also register
// page-serving middleware simply by setting a
// pageMiddleware property on themselves
middleware: [ /* middleware, functions, galore */ ],
// Custom page loader functions beyond those automatically
// provided. Already you have the page with the slug 'global'
// available at all times, the current page, its tabs, its
// descendants, and anything loaded on behalf of your modules,
// like blog posts appearing on the current page
load: [
function(req, callback) {
if (!(req.page && (req.page.type === 'fancy'))) {
// Doesn't concern us
return callback(null);
}
// Set some custom data to be provided to the nunjucks template.
// Anything in the extras object is pushed as data to the
// page template.
//
// We have a callback here, so we could go get anything
req.extras.fanciness = true;
return callback(null);
}
],
},
// Let's add the blog and events modules. You must npm install them.
// apostrophe-site will require them for you and pass your options
modules: {
'apostrophe-events': {
widget: true
},
'apostrophe-blog': {
widget: true
}
},
// Custom command line tasks. Run like this:
// node app project:frobulate
// argv is powered by optimist
tasks: {
project: {
frobulate: function(apos, argv, callback) {
console.log('Frobulated the hibblesnotz');
console.log('You passed these arguments: ' + argv._);
return callback(null);
}
}
},
locals: {
// Extra locals visible to every nunjucks template. Functions and
// data are both fair game. You may also pass a function that takes
// the site object as its sole argument and returns an object containing
// the desired locals as properties.
embiggen: function(s) {
return s * 1000;
}
},
assets: {
// Loads site.js from public/js
scripts: [
// load this js file all the time, minify it normally
'site',
{
// Load this JS file only when a user is logged in, never minify it.
// 'when' could also be 'always'. 'minify' defaults to true
name: 'fancy',
when: 'user',
minify: false
}
],
// Loads site.less from public/css
stylesheets: [
'site'
]
},
// Last best chance to set custom Express routes
setRoutes: function(callback) {
site.app.get('/wacky', function(req, res) { res.send('wackiness'); });
return callback(null);
},
// Just before apos.endAsset. Last chance to push any assets. Usually the
// `assets` option above, and calling `pushAsset` from your modules,
// is good enough.
beforeEndAssets: function(callback) {
// Apostrophe already loads these for logged-out users, but we
// want them all the time in this project.
site.apos.pushAsset('script', { name: 'vendor/blueimp-iframe-transport', when: 'always' });
site.apos.pushAsset('script', { name: 'vendor/blueimp-fileupload', when: 'always' });
return callback(null);
},
// Just before listen. Last chance to set up anything
afterInit: function(callback) {
return callback(null);
},
sanitizeHtml: {
// Any options that can be passed to the sanitize-html
// module are valid here. Used to adjust the way we filter
// HTML saved in the rich text editor. You probably want
// to stick with our standard set of allowed tags and
// encourage users to respect your design rather than
// fighting it
},
// A simple way to alter the results of every call to apos.get, and thus
// every page, snippet, blog post, etc. The retrieved documents will be
// in results.pages. Be aware that this property does not always exist,
// as apos.get is sometimes used just to fetch distinct tags or
// other metadata.
afterGet: function(req, results, callback) {
}
});
If you prefer you can configure Apostrophe in two steps:
var site = require('apostrophe-site')();
site.init({ ... same configuration as above ... });
This allows you to pass your site object to functions implemented in other files in order to create parts of your configuration:
// in app.js
var site = require('apostrophe-site')();
site.init({
// ... regular stuff ...
pages: {
load: require('./lib/loaders.js')(site)
}
});
// in lib/loaders.js
module.exports = function(site) {
return [
function(req, callback) {
site.apos.doSomethingInteresting(callback);
}
]
};
Adding a module to the modules
property above does most of the work, but you do need to add it to the admin bar when appropriate. For instance, you'll want the "blog" menu to be added at the top of the page when the blog module is installed.
In our sandbox site or a project cloned from it, you would do that in outerLayout.html
. Just look for calls like this one:
{{ aposBlogMenu({ edit: permissions.edit }) }}
Conversely, if you choose not to include a module but haven't removed it from the admin bar, don't be surprised when you get a template error.
First npm install
and configure apostrophe-blog
. Then create a lib/modules/apostrophe-blog/views
folder in your project. Copy any templates you wish to customize from the npm module's views folder to lib/modules/apostrophe-blog/views
.
Boom! Apostrophe will automatically look first at your "project level" module folder.
This also works for apostrophe-schemas
and apostrophe-pages
, even though they are not configured by the modules
property. lib/modules/apostrophe-schemas/views
may contain overrides for schema field templates, and lib/modules/apostrophe-pages/views
may contain overrides for newPageSettings.html
and friends.
You can override a module more than once, for instance to set up two things that are similar in spirit to a blog. Just create folders in lib/modules
, with your views
overrides, and configure them in app.js
via the modules
option as shown above. Then use the extend
property to tell Apostrophe what module you're extending.
You'll want to set the name
and instance
options so the database can distinguish between your stories and regular blog posts:
stories: {
extend: 'apostrophe-blog',
name: 'stories',
instance: 'story',
addFields: [
{
name: 'storyteller',
type: 'string'
}
]
}
Note that you will need to copy the new
, edit
and manage
templates to your views
folder and fix any references to blog
and blog-post
to refer to stories
and story
.
As seen above, you can add and alter the properties of blog posts and similar things via the addFields
and alterFields
options as described in the apostrophe-snippets documentation. Those options can go right in the configuration for your module in app.js
.
If you really need to change a module's behavior, for instance changing what the page loader function does or the way it fetches data from the database, you'll need to subclass it. But we've made subclassing much easier. Just create an index.js
file in your lib/modules/mymodulename
folder.
Here's a really simple subclass that changes the way the index
method of the blog behaves so that a featured story is available to the index.html
template as the featured
variable in nunjucks:
module.exports = stories;
function stories(options, callback) {
return new stories.Stories(options, callback);
}
stories.Stories = function(options, callback) {
var self = this;
module.exports.Super.call(this, options, null);
var superIndex = self.index;
self.index = function(req, snippets, callback) {
self.get(req, { tags: 'featured' }, { limit: 1 }, function(err, results) {
if(err) {
callback(err);
}
if(results.total > 0) {
req.extras.featured = results.snippets[0];
}
superIndex(req, snippets, callback);
});
};
// Must wait at least until next tick to invoke callback!
if (callback) {
process.nextTick(function() { return callback(null); });
}
};
Note the use of module.exports.Super
. This automatically points to the base class constructor.
Confused? Just remember to follow this pattern and put your method overrides after the call to module.exports.Super
.
If it doesn't smell like a blog post, you probably want to subclass snippets instead. The blog module simply subclasses snippets and adds the idea of a publication date.
You can configure modules that have nothing at all to do with snippets, too. Our own RSS and Twitter modules, for instance.
To configure a module with apostrophe-site
, all you have to do is make sure it looks like this:
module.exports = factory;
function factory(options, callback) {
return new Construct(options, callback);
}
function Construct(options, callback) {
var self = this;
// Add a bunch of methods to self here, then...
// Invoke the callback. This must happen on next tick or later!
return process.nextTick(function() {
return callback(null);
});
}
// Export the constructor so others can subclass
factory.Construct = Construct;
In a nutshell: you must export a factory function, and it must have a constructor as its Construct
property.
In addition to the options you specify in app.js
, all modules receive:
apos
: the apos
object, a singleton which provides core methods for content management. See the apostrophe module documentation.
pages
: the pages
object, a singleton which provides methods for dealing with the page tree. See the apostrophe-pages module documentation.
schemas
: the schemas
object, a singleton which provides methods for dealing with schemas. Most of the time you won't interact with this directly, but you might if you're writing a module that handles moderated submissions and the like. See the apostrophe-schemas module documentation.
mailer
: a nodemailer
transport object, ready to send email as needed. See the nodemailer documentation.
site
: an object containing title
, shortName
and hostName
properties, as configured in app.js
.
modules
: an array of objects with web
and fs
properties, specifying the web and filesystem paths to each folder in the chain of overrides, which is useful if you wish to allow project-level overrides via lib/modules
of views provided by an npm module. You can take advantage of this easily if you use the mixinModuleAssets
and serveAssets
mixins; see assets.js
in the apostrophe module for documentation.
After all modules have been initialized, apostrophe-site
calls the setBridge
method on each module that has one. This method receives an object containing all of the modules as properties. The people
module, for instance, uses the bridge to access the groups
module. Note that this is not called until after all modules have invoked their initialization callback.
You can write custom modules in lib/modules
for your project-specific needs, or install them with npm. If you use lib/modules
, your module's code must load from lib/modules/mymodulename/index.js
.
Currently extend
does not check lib/modules
, so the module you are extending must be published in npm. Most of the time we extend modules like apostrophe-blog
and apostrophe-snippets
in simple project-specific ways, so this isn't much of a problem so far.
Using i18n is simple you enable it by adding the following in your apostrophe-site configuration in app.js:
i18n: {
// setup some locales - other locales default to defaultLocale silently
locales:['en', 'de'],
// you may alter a site wide default locale (optional, defaults to 'en')
defaultLocale: 'de',
// sets a custom cookie name to parse locale settings from - defaults to apos_language (optional)
cookie: 'yourcookiename',
// whether to write new locale information to disk automatically - defaults to true (you will want to shut it off in production)
// updateFiles: false
}
After doing this, you can internationalise text in your own templates with:
{{ __('A sample string') }}
The __
local will take care of language detection and will spit out the appropriate string from the JSON files that will be located in the locales
folder of your project by default. If you look in that folder, you'll see multiple JSON files with a two letter language abbreviation as a filename, for instance:
en.json
de.json
Those will contain all the necessary strings. By default, i18n will automatically put anything new it finds there. However, you can disable this behaviour by setting updateFiles
to false.
See apostrophe, apostrophe-sandbox, apostrophe-pages, apostrophe-snippets, apostrophe-blog, apostrophe-events, apostrophe-map, apostrophe-groups, apostrophe-people, apostrophe-rss and apostrophe-twitter.
Also browse the apostrophe
tag on npm.
You should join the apostrophenow Google Group for discussion of both Apostrophe 1.5 and Apostrophe 2.