These scripts help devopsdays organizers manage their events.
The technical details and guidelines for contributing to this repository are outlined in CONTRIBUTING.md.
Full reference of all fields and features is located in reference.md in the currently released theme directory.
New utilities and updates to existing utilities are welcome, as are suggestions for default content. Add new scripts in contrib.
If you want others in your team to be able to preview/approve changes before they are merged, we recommend you follow this workflow to work with your own repo prior to submitting a PR.
Use add_new_event.sh to add a new event. This is year-specific, so you would run this when setting up the upcoming year's event for the first time.
- If your city name contains spaces or special characters, the script will remove them for purposes of the event stub, which will be used in the URL and have a name like
yyyy-city. - The script will create a data file for your event in
data/events/yyyy-city.yml. This is where you will configure many of your updates and customizations. In particular, you need to list your local organizer team here. - The script will populate your event directory in
content/events/yyyy-citywith default content. You should edit it as desired. - The script will add or update your entry in
static/_redirects. This allows you to use the urlhttps://devopsdays.org/city-nameto point to your current-year event. - Once you have created a logo graphic, place it in
static/events/yyyy-city/logo.png. (The file MUST be calledlogo.png.) The sample welcome page has a commented-out element to display a logo named in this way. For front-page use, you also need a square version instatic/events/yyyy-city/logo-square.jpg.
If you have set up a Google Analytics v3 or older account for tracking your specific event, you can enable tracking for your event pages by updating the ga_tracking_id field in your yyyy-city.yml file. Example: ga_tracking_id: "UA-74738648-1"
If you have set up a Google Analytics v4 or newer account for tracking your specific event, you can enable tracking for your event pages by updating the gtm_tracking_id field in your yyyy-city.yml file. Example: gtm_tracking_id: "G-NCBC4PBEMK"
To customize the logo that appears on the root of devopsdays.org, place a square file (jpg format only) in static/events/yyyy-city. It must be named logo-square.jpg and should be at minimum 300px x 300px, but optimally should be 600px x 600px. Note that in the preview (without gulp processing), non-square files will appear to be okay. However, once processed for production, they will be stretched to be square.
- The gears logo is available in AI, PSD and SVG format in the repo at devopsdays/devopsdays-assets
- Prospectuses for other events you may want to reference are also available in the devopsdays/devopsdays-assets repo.
Many sponsors are sponsors for multiple devopsdays. If a sponsor listing already exists with the correct information, you can just add them to your datafile.
The sample datafile has some sponsor levels pre-populated; edit as desired. You will want to decide what's in your sponsor packages before accepting most types of sponsors (other than Community).
Sometimes, an existing sponsor will want an event-specific URL for your event. Rather than creating a new sponsor, you can add an optional url field to the sponsor in your event data file to override the default URL for that sponsor. For example:
sponsors:
- id: victorops
level: social
- id: netapp
level: gold
url: http://netapp.com/?tracking=myeventthing
- id: thoughtworks-gocd
level: gold
It is normal for sponsors to occasionally update their information or logo every few years. As a matter of policy, we strongly prefer not to retroactively change history for past events. In other words, if there's an old logo used by an event in the past, that shouldn't change. (See this previous discussion for guidance.)
In the case where your current event is the only one that uses the asset in question, you should just make the modfication and open a PR as normal. If there is historical data however, you should use the change_sponsor_logo.sh script.
For this example, we'll use Pivotal as the sponsor.
Run the script change_sponsor_logo.sh in the utilities subdirectory, giving it the name of the sponsor (pivotal) and the full path on disk to your new logo:
$ ./change_sponsor_logo.sh pivotal ~/Downloads/pivotal.png
Modifying 2018-chicago.yml
Modifying 2019-detroit.yml
Modifying 2018-chicago/conduct/index.html
Modifying 2018-chicago/contact/index.html
...
Under the hood, the script is:
- Copying the existng sponsor files to
sponsor-before-todaysdate.{png,yml}. - Copying in the new image to
sponsor.png. - Modifying any events that did not occur this year such that they are sponsored by
sponsor-before-todaysdate, rather thansponsor. - Modifying any archived events such that they are sponsored by
sponsor-before-todaysdate, rather thansponsor.
This means that if a sponsor asks for an update affecting all future events, the shared sponsor entry will be changed for all events without any intervention needed from local organizers who have listed that sponsor. This is a benefit to using the shared sponsor entry.
Finally, make whatever changes are requested to the image and data file.
See Pivotal logo update for the pull request that inspired this example.
Use add_sponsors.sh to easily add new sponsors. (Only do this if the sponsor doesn't already exist.)
- Sponsors need a file in the data directory, as such:
data/sponsors/sponsorname.yml. Before creating a new one, look to see if there is an old one, possibly with a date prepended. If it has the right URL and logo, you should use it instead of creating a new one. - Put the images for your sponsors in the
static/img/sponsorsdirectory. They need to be PNG files and named exactly after the name of the sponsor in your event file (and the corresponding sponsor data file), i.e.,static/img/sponsors/sponsorname.png. - Add the new sponsor to your event's datafile with the appropriate level.
See contrib/make_sponsors.rb for another option.
Guidelines regarding sponsor logo files and formatting:
- The dimensions of the image file must be at least 200px wide. 600px will look best for high-density display.
- The background must be either white or transparent.
- Images do not need to be square, but they may look better if they are.
See the example local organizer team members listed in the generated data file found in data/events/201?-yourcity.yml. To generate the team_members: section you can use add_organizers.sh.
The organizer photo must be in JPG format, and should be a minimum 300px x 300px, but optimally 600px x 600px. These images should be placed in the static/events/yyyy-city/organizers directory (which the add_organizers.sh script will do).
Any PRs adding a new local organizer will need to be accompanied by an email to [email protected] with their full name and email address. We merge the PR at the same time as adding them to email lists and Slack, so if you aren't ready to send that email, merging your PR will be delayed until we have that info.
A sharing image is added to the Open Graph tags for your event pages, to improve the sharing on social networks such as Facebook (or in Slack). This image must located in static/events/yyyy-city/sharing/. It should be a minimum 1200px x 630px, and use ratio: 1.91:1. You must set the sharing_image field in data/events/yyyy-city.yml (example: sharing_image: "sharing.jpg"). You can also override the sharing image by setting sharing_image in the frontmatter of a specific page, with the filename of an image in the static/events/yyyy-city/sharing/ directory. Example: sharing_image = "jeff-smith.png"
If no image is provided, then the meta tag will not be created. Facebook might try to infer it, but the links shared will just likely have no images.
Use add_speakers.sh to add speakers and talks to an existing event. It will produce speaker-specific pages that link to their talk pages.
You can set additional optional frontmatter for speaker files:
Website = ""
Facebook = ""
Linkedin = ""
Pronouns = ""
Github = ""
Twitter = ""
If you have a two-speaker talk, create both speakers, add the talk under one of them, and set the talk file in content/events/2017-ponyville/program/rainbow-dash.md with a Speakers attribute like this:
Speakers = ["rainbow-dash","twilight-sparkle"]
You can also rename the generated program file to include them both: mv content/events/2017-ponyville/program/rainbow-dash.md content/events/2017-ponyville/program/dash-sparkle.md. As long as the Speakers line is set correctly, this will work fine.
Use add_program.sh to add the program for your event. The program template expects 4 full talks each day and lists default times, but you can customize. The program data is stored in the event datafile such as data/events/2017-ponyville.yml. You don't need to know any or all of your speakers when adding the sample program, but if you have selected speakers you can list them on the program with this script.
If you start working on the program before you have all your speakers, by default you'll have talk-1 through talk-8 and you can replace those with slugs like rainbow-dash or dash-sparkle as appropriate.
The headshots for your speaker images can be either .png or .jpg. They should be square, preferably 600px square. If they are not square, the page listing all speakers will crop them to square, but the individual speaker and talk pages will not crop the image).
After the event, you can set additional optional frontmatter for talk files such as content/events/2017-ponyville/program/rainbow-dash.md:
youtube = ""
vimeo = ""
speakerdeck = ""
slideshare = ""
slides = ""
You can embed video other than YouTube or Vimeo on talk pages by adding the embed script to a talk file (such as content/events/2017-ponyville/program/rainbow-dash.md) and enclosing it into a <div> section. Here is an example of embedding a SlidesLive.com video:
+++
<div>
<div id="presentation-embed-38915149"></div>
<script src='https://slideslive.com/embed_presentation.js'></script>
<script>
embed = new SlidesLiveEmbed('presentation-embed-38915149', {
presentationId: '38915149',
autoPlay: false // change to true to autoplay the embedded presentation
});
</script>
</div>
Set $DOD_YEAR and $DOD_CITY and the scripts won't ask
for the year and city every time.
Here are some useful bash exports/aliases. Add them to your .bashrc or
copy .envrc.example to .envrc and run direnv allow. See
direnv for more info.
# devopsdays
export DOD_YEAR="2019" # set this to your year
export DOD_CITY="new-york-city" # set this to your city
export DODPATH=~/git/devopsdays-web # location of Git files
alias dod='cd $DODPATH'
alias dods='cd $DODPATH/content/events/$DOD_YEAR-$DOD_CITY/speakers'
alias dodp='cd $DODPATH/content/events/$DOD_YEAR-$DOD_CITY/program'
alias dodi='cd $DODPATH/static/events/$DOD_YEAR-$DOD_CITY/speakers'
alias dodyml='dod && $EDITOR data/events/$DOD_YEAR-$DOD_CITY.yml'
alias dodfind='dod && find data/events/$DOD_YEAR-$DOD_CITY.yml content/events/$DOD_YEAR-$DOD_CITY/{speakers,program} static/events/$DOD_YEAR-$DOD_CITY/speakers'
alias dodhugo='dod && echo open http://localhost:1313 ; hugo server -w --baseUrl="http://localhost:1313"'
dod-- chdir to your base directorydods-- chdir to your devopsdays speaker filesdodp-- chdir to your devopsdays program filesdodi-- chdir to your devopsdays speaker JPGs (images)dodyml-- edit the YAML filedodhugo-- run hugo in "watch" modedodfind-- Run "find" on your event's directories- Example: Find all the files for speaker "jane-doe"
dodfind -name '*jane-doe*'- Example: Find all the files that mention "jane-doe"
dodfind -type f -print0 | xargs -0 grep jane-doe