« back to Projects
The website for the Code for San Francisco Brigade
- Explain what Code for San Francisco is and the type of work we do.
- To celebrate our events, projects, and discussions!
- Encourage current and new members to participate with clear ways to get involved.
- To have this site be easily reused by other Brigades just starting out.
If you are tasked with writing posts for the site blog, follow these instructions:
What you’ll need:
- a github account with access to the sfbrigade github organization. (ask somebody at san francisco brigade for this)
To create a new post:
- go to http://prose.io/#sfbrigade/sfbrigade.github.io/tree/master/_posts/blog
- if the page asks you to “authorize with github”, click the authorize button note: ensure you are signed in with your github account
- create a new blog post by clicking the “new file” button there are various controls for formatting text, links and creating images
To add an image:
- click on the add image button.
- click “selecting one”.
- pick a file on your local computer.
- in the “image url” field, ensure to change the url from something like “_posts/blog/yourimagename.jpg” to “images/blog/yourimagename.jpg” this is changing the path of the image to be images/blog/ rather then _posts/blog. !this is important, as the image will not work if this is not done!
- add in alt text for the image. alt text is important for user’s that browse by websites using text readers.
Adding a Notification
To add a new notification:
- Open up _includes/header.html
- Click the
- Search for
- Copy/paste the example and modify the title and description
- Preview your changes
- If satisfied, commit your changes with a small description of them. This will create a pull request (basically a change request) and someone will review your changes. If it is time sensitive, please reach out to someone on the website and tools team directly (see http://codeforsanfrancisco.org/about/) to have them review
- Later you should remove the notification by deleting it using the same process as above
Running the Site Locally on Your Computer
To run the site locally on your own computer (most helpful for previewing your own changes), you will need Jekyll installed (click here for Jekyll installation instructions.)
Fork and clone the repository, then install dependencies (requires ruby and bundler).
cd sfbrigade.github.io/ ./scripts/setup
Finally, run the following command in the root directory of the repo:
$ bundle exec jekyll serve
$ bundle exec jekyll serve --watch
The latter will cause Jekyll to watch for file changes and automatically
regenerate the HTML (though you will still need to refresh the browser).
--watch flag does not work, try the following instead:
$ bundle exec jekyll serve --force_polling
(See here for
background information on why
--watch might not be working.)
Your computer should now be serving your local copy of the site at:
If the above URL does not work (e.g. when using Chrome), try:
(See this issue for more information.)
An accessible website/app is our number one priority. We value all contributions that put user accessibility as the top consideration when creating or modifying user interface elements. See http://www.w3.org/WAI/intro/wcag and for information/examples about accessible forms/controls see http://webaim.org/techniques/forms/controls.
Sharing Your Changes Using Jekit
You can use the nifty Jekit app to preview changes you make to this site.
To do this, fork this repo, and commit your changes on a branch to your fork. You can then preview what your changes look like by navigating to:
For a basic example of its usage, if GitHub user @lolname has made changes to the projects page on their fork (on the
master branch), they can preview their changes using Jekit by going to:
Submitting a Pull Request
- Fork the project.
- Create a topic branch.
- Implement your feature or bug fix.
- Commit and push your changes.
- Submit a pull request.