SND Layout Editor
A seamless way to get a handle on your homepage.
This is a demo that was built as part of SND Makes: Boston. (Read notes from our brainstorming to see how we got here.)
How might we make content creation fun and accessible to anyone in the newsroom?
How can we make managing complex page designs easier and more accessible in a visual way interface?
Who built this?
What is it?
This tool allows an editor to dynamically arrange and edit a complex web layout (like a homepage). In theory, a user would be able to:
- Drag and drop content into layout
- Rearrange content within a layout
- Show how layout changes as you add and subtract content
- Choose from a recently published story queue
- Edit headlines, teaser text, and make modest changes to images
This also needs to hook into many disparate CMSes.
Challenges and questions
- Could we change the templates dynamically?
- Is democratizing homepage design to this degree dangerous?
- Can we have presets and limits (e.g., only certain roles can move blocks)?
- Is the preview responsive?
- Would it make sense to apply to topic pages and/or article pages?
- How can this fit into various CMS?
What still needs to happen
Probably a lot!
- Build a way to version homepages and rollback changes
- Build functionality to schedule homepages/designs
- Clone the repository from GitHub to your local machine
- Navigate to project folder
- In terminal, run
bower installto pull dependencies
- In terminal, run
compass watchto compile CSS
To run locally ...
- Navigate to the project folder
- In terminal, run :
python -m SimpleHTTPServer
- Open in your browser of choice at localhost:8000
There are some very basic tests in the
tests/ folder. Run them like so:
add commands here
We only tested it in the latest version of Chrome. We think it would probably work in other A-grade browsers.
All of these documents are licensed under a Creative Commons BY-NC 3.0 license. You are free to share and to remix them (as long as you credit us) but please don't use them commercially without permission.
We welcome contributions and suggestions to help us improve this tool.
To contribute your changes:
- Fork this repo
- Create a branch
git checkout -b my-branch
- Stage and commit your changes
git commit -am 'description of my changes'
- Push the changes to your fork
git push origin my-branch
- Submit a pull request to the parent repo
Additionally, you can create issues on this repo to suggest changes or improvements.