myDocsy – tag-1

Docs: DEV Test Content

Mon, 01 Jan 0001 00:00:00 +0000

One of the best ways to see what Docsy can do, and learn how to configure a site with it, is to see some real projects. In addition to our provided Docsy Example Project, there are several live sites already using the theme. Please add your own examples once you’ve got a production site up and running with Docsy!

Docsy theme examples

Example sites that have low to no customization:

Site	Repo (if public)
This Docsy documentation site	https://github.com/google/docsy
“Goldydocs” - a Docsy example site	https://github.com/google/docsy-example
https://www.kubeflow.org/	https://github.com/kubeflow/website
https://agones.dev/site/	https://github.com/GoogleCloudPlatform/agones/tree/master/site
https://googlecontainertools.github.io/kpt/	https://github.com/GoogleContainerTools/kpt/tree/master/docs
Navidrome Music Server	https://github.com/navidrome/website
https://docs.agilebase.co.uk/	https://github.com/okohll/abdocs
https://jvmperf.net/	https://github.com/cchesser/java-perf-workshop
gRPC	https://github.com/grpc/grpc.io

Customized Docsy examples

Example sites that include a moderate to high amount of customization:

Site	Repo (if public)
Knative	https://github.com/knative/docs and https://github.com/knative/website
Apache Airflow	https://github.com/apache/airflow-site/
Docsy Just Docs	https://github.com/LisaFC/justdocs
Thunderhead Engineering Product Support	https://gitlab.com/tecidev/support (private)
Kubernetes	https://github.com/kubernetes/website

Docs: Previews and Deployment

Mon, 01 Jan 0001 00:00:00 +0000

There are multiple possible options for deploying a Hugo site, including Netlify, Firebase Hosting, Bitbucket with Aerobatic, and more; you can read about them all in Hosting and Deployment. Hugo also makes it easy to deploy your site locally for quick previews of your content.

Serving your site locally

Depending on your deployment choice you may want to serve your site locally during development to preview content changes. To serve your site locally:

Ensure you have an up to date local copy of your site files cloned from your repo. Don’t forget to use --recurse-submodules or you won’t pull down some of the code you need to generate a working site.
```
git clone --recurse-submodules --depth 1 https://github.com/my/example.git
```
Note

If you’ve just added the theme as a submodule in a local version of your site and haven’t committed it to a repo yet, you must get local copies of the theme’s own submodules before serving your site.
```
git submodule update --init --recursive
```
Ensure you have the tools described in Prerequisites and installation installed on your local machine, including postcss-cli (you’ll need it to generate the site resources the first time you run the server).
Run the hugo server command in your site root. By default your site will be available at http://localhost:1313/.

Now that you’re serving your site locally, Hugo will watch for changes to the content and automatically refresh your site. If you have more than one local git branch, when you switch between git branches the local website reflects the files in the current branch.

Deployment with Netlify

We recommend using Netlify as a particularly simple way to serve your site from your Git provider (GitHub, GitLab, or BitBucket), with continuous deployment, previews of the generated site when you or your users create pull requests against the doc repo, and more. Netlify is free to use for Open Source projects, with premium tiers if you require greater support.

Before deploying with Netlify, make sure that you’ve pushed your site source to your chosen GitHub (or other provider) repo, following any setup instructions in Using the theme.

Then follow the instructions in Host on Netlify to set up a Netlify account (if you don’t have one already) and authorize access to your GitHub or other Git provider account. Once you’re logged in:

Click New site from Git.
Click your chosen Git provider, then choose your site repo from your list of repos.
In the Deploy settings page:
1. For your Build command, specify cd themes/docsy && git submodule update -f --init && cd ../.. && hugo. You need to specify this rather than just hugo so that Netlify can use the theme’s submodules.
2. Click Show advanced.
3. In the Advanced build settings section, click New variable.
4. Specify HUGO_VERSION as the Key for the new variable, and 0.53 or later as its Value.
5. (Optional) Click New variable again, and this time set HUGO_ENV to production. Do this if you want your site to be indexed by search engines. You must do this if you want to use a Google Custom Search Engine.
Click Deploy site.

Note

Netlify uses your site repo’s package.json file to install any JavaScript dependencies (like postcss) before building your site. If you haven’t just copied our example site’s version of this file, make sure that you’ve specified all our prerequisites.

For example, if you want to use a version of postcss-cli later than version 8.0.0, you need to ensure that your package.json also specifies postcss separately:

  "devDependencies": {
    "autoprefixer": "^9.8.6",
    "postcss-cli": "^8.0.0",
    "postcss": "^8.0.0"
  }

Alternatively, you can follow the same instructions but specify your Deploy settings in a netlify.toml file in your repo rather than in the Deploy settings page. You can see an example of this in the Docsy theme repo (though note that the build command here is a little unusual because the Docsy user guide is inside the theme repo).

If you have an existing deployment you can view and update the relevant information by selecting the site from your list of sites in Netlify, then clicking Site settings - Build and deploy. Ensure that Ubuntu Xenial 16.04 is selected in the Build image selection section - if you’re creating a new deployment this is used by default. You need to use this image to run the extended version of Hugo.

Docs: Examples

Mon, 01 Jan 0001 00:00:00 +0000

Docsy theme examples

Example sites that have low to no customization:

Site	Repo (if public)
This Docsy documentation site	https://github.com/google/docsy
“Goldydocs” - a Docsy example site	https://github.com/google/docsy-example
https://www.kubeflow.org/	https://github.com/kubeflow/website
https://agones.dev/site/	https://github.com/GoogleCloudPlatform/agones/tree/master/site
https://googlecontainertools.github.io/kpt/	https://github.com/GoogleContainerTools/kpt/tree/master/docs
Navidrome Music Server	https://github.com/navidrome/website
https://docs.agilebase.co.uk/	https://github.com/okohll/abdocs
https://jvmperf.net/	https://github.com/cchesser/java-perf-workshop
gRPC	https://github.com/grpc/grpc.io

Customized Docsy examples

Example sites that include a moderate to high amount of customization:

Site	Repo (if public)
Knative	https://github.com/knative/docs and https://github.com/knative/website
Apache Airflow	https://github.com/apache/airflow-site/
Docsy Just Docs	https://github.com/LisaFC/justdocs
Thunderhead Engineering Product Support	https://gitlab.com/tecidev/support (private)
Kubernetes	https://github.com/kubernetes/website

Docs: Guidelines for Contribution to Docsy

Mon, 01 Jan 0001 00:00:00 +0000

Docsy is an open source project and we love getting patches and contributions to make Docsy and its docs even better.

Contributing to Docsy

The Docsy theme itself lives in https://github.com/google/docsy.

Contributor License Agreement

Contributions to this project must be accompanied by a Contributor License Agreement. You (or your employer) retain the copyright to your contribution; this simply gives us permission to use and redistribute your contributions as part of the project. Head over to https://cla.developers.google.com/ to see your current agreements on file or to sign a new one.

You generally only need to submit a CLA once, so if you’ve already submitted one (even if it was for a different project), you probably don’t need to do it again.

Code reviews

All submissions, including submissions by project members, require review. We use GitHub pull requests for this purpose. Consult GitHub Help for more information on using pull requests.

Previewing your changes

As Docsy is a theme rather than a site, you can’t serve the theme directly to check your changes work. Instead use your updated local theme in a local copy of the Docsy example site (copy or make your changes in the themes/docsy directory) and preview from there. Alternatively, clone the Docsy theme repo and test your changes in a local copy of this site, as described below.

Community guidelines

This project follows Google’s Open Source Community Guidelines.

Creating issues

Alternatively, if there’s something you’d like to see in Docsy (or if you’ve found something that isn’t working the way you’d expect), but you’re not sure how to fix it yourself, please create an issue.

Contributing to these docs

This user guide is, like our example site, a Docsy site that uses the Hugo static site generator. We welcome updates to the docs!

We use Netlify to manage the deployment of the site and provide previews of doc updates. The instructions here assume you’re familiar with basic GitHub workflows.

Quick start with Netlify

Fork the Docsy repo on GitHub: this site’s files live in the userguide subdirectory.
Make your changes and send a pull request (PR).
If you’re not yet ready for a review, add “WIP” to the PR name to indicate it’s a work in progress. (Don’t add the Hugo property “draft = true” to the page front matter, because that prevents the auto-deployment of the content preview described in the next point.)
Wait for the automated PR workflow to do some checks. When it’s ready, you should see a comment like this: deploy/netlify — Deploy preview ready!
Click Details to the right of “Deploy preview ready” to see a preview of your updates.
Continue updating your doc and pushing your changes until you’re happy with the content.
When you’re ready for a review, add a comment to the PR, and remove any “WIP” markers.

Updating a single page

If you’ve just spotted something you’d like to change while using the docs, Docsy has a shortcut for you:

Click Edit this page in the top right hand corner of the page.
If you don’t already have an up to date fork of the project repo, you are prompted to get one - click Fork this repository and propose changes or Update your Fork to get an up to date version of the project to edit. The appropriate page in your fork is displayed in edit mode.
Follow the rest of the Quick start with Netlify process above to make and preview your changes.

Previewing your changes locally

If you want to run your own local Hugo server to preview your changes as you work:

Follow the instructions in Getting started to install Hugo and any other tools you need.
Fork the Docsy repo into your own project, then create a local copy using git clone. Don’t forget to use --recurse-submodules or you won’t pull down some of the code you need to generate a working site.
```
git clone --recurse-submodules --depth 1 https://github.com/google/docsy.git
```
Change to the userguide directory and run the following Hugo command to build the site and start the Hugo server. Note that you need the themesDir flag because the site files are inside the theme repo.
```
cd userguide
hugo server --themesDir ../..
```
By default your site will be available at http://localhost:1313/. Now that you’re serving your site locally, Hugo will watch for changes to the content and automatically refresh your site.
Continue with the usual GitHub workflow to edit files, commit them, push the changes up to your fork, and create a pull request.

Creating an issue

If there’s something you’d like to see in the docs, but you’re not sure how to fix it yourself, please create an issue in this repository. You can also create an issue about a specific page by clicking the Create Issue button in the top right hand corner of the page.

Blog: Blog post in folder

Sun, 06 Oct 2019 00:00:00 +0000

Text can be bold, italic, or ~~strikethrough~~. Links should be blue with no underlines (unless hovered over).

There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs.

There should be no margin above this first sentence.

Blockquotes should be a lighter gray with a border along the left side in the secondary color.

There should be no margin below this final sentence.

First Header

This is a normal paragraph following a header. Bacon ipsum dolor sit amet t-bone doner shank drumstick, pork belly porchetta chuck sausage brisket ham hock rump pig. Chuck kielbasa leberkas, pork bresaola ham hock filet mignon cow shoulder short ribs biltong. Bacon ipsum dolor sit amet t-bone doner shank drumstick, pork belly porchetta chuck sausage brisket ham hock rump pig. Chuck kielbasa leberkas, pork bresaola ham hock filet mignon cow shoulder short ribs biltong. Bacon ipsum dolor sit amet t-bone doner shank drumstick, pork belly porchetta chuck sausage brisket ham hock rump pig. Chuck kielbasa leberkas, pork bresaola ham hock filet mignon cow shoulder short ribs biltong.

Bacon ipsum dolor sit amet t-bone doner shank drumstick, pork belly porchetta chuck sausage brisket ham hock rump pig. Chuck kielbasa leberkas, pork bresaola ham hock filet mignon cow shoulder short ribs biltong.

On big screens, paragraphs and headings should not take up the full container width, but we want tables, code blocks and similar to take the full width.

Lorem markdownum tuta hospes stabat; idem saxum facit quaterque repetito occumbere, oves novem gestit haerebat frena; qui. Respicit recurvam erat: pignora hinc reppulit nos aut, aptos, ipsa.

Meae optatos passa est Epiros utiliter Talibus niveis, hoc lata, edidit. Dixi ad aestum.

Header 2

This is a blockquote following a header. Bacon ipsum dolor sit amet t-bone doner shank drumstick, pork belly porchetta chuck sausage brisket ham hock rump pig. Chuck kielbasa leberkas, pork bresaola ham hock filet mignon cow shoulder short ribs biltong.

Header 3

This is a code block following a header.

Header 4

This is an unordered list following a header.
This is an unordered list following a header.
This is an unordered list following a header.

Header 5

This is an ordered list following a header.
This is an ordered list following a header.
This is an ordered list following a header.

Header 6

What	Follows
A table	A header
A table	A header
A table	A header

There’s a horizontal rule above and below this.

Here is an unordered list:

Salt-n-Pepa
Bel Biv DeVoe
Kid ‘N Play

And an ordered list:

Michael Jackson
Michael Bolton
Michael Bublé

And an unordered task list:

Create a sample markdown document
Add task lists to it
Take a vacation

And a “mixed” task list:

Steal underpants
?
Profit!

And a nested list:

Jackson 5
- Michael
- Tito
- Jackie
- Marlon
- Jermaine
TMNT
- Leonardo
- Michelangelo
- Donatello
- Raphael

Definition lists can be used with Markdown syntax. Definition terms are bold.

Name: Godzilla
Born: 1952
Birthplace: Japan
Color: Green

Tables should have bold headings and alternating shaded rows.

Artist	Album	Year
Michael Jackson	Thriller	1982
Prince	Purple Rain	1984
Beastie Boys	License to Ill	1986

If a table is too wide, it should scroll horizontally.

Artist	Album	Year	Label	Awards	Songs
Michael Jackson	Thriller	1982	Epic Records	Grammy Award for Album of the Year, American Music Award for Favorite Pop/Rock Album, American Music Award for Favorite Soul/R&B Album, Brit Award for Best Selling Album, Grammy Award for Best Engineered Album, Non-Classical	Wanna Be Startin’ Somethin', Baby Be Mine, The Girl Is Mine, Thriller, Beat It, Billie Jean, Human Nature, P.Y.T. (Pretty Young Thing), The Lady in My Life
Prince	Purple Rain	1984	Warner Brothers Records	Grammy Award for Best Score Soundtrack for Visual Media, American Music Award for Favorite Pop/Rock Album, American Music Award for Favorite Soul/R&B Album, Brit Award for Best Soundtrack/Cast Recording, Grammy Award for Best Rock Performance by a Duo or Group with Vocal	Let’s Go Crazy, Take Me With U, The Beautiful Ones, Computer Blue, Darling Nikki, When Doves Cry, I Would Die 4 U, Baby I’m a Star, Purple Rain
Beastie Boys	License to Ill	1986	Mercury Records	noawardsbutthistablecelliswide	Rhymin & Stealin, The New Style, She’s Crafty, Posse in Effect, Slow Ride, Girls, (You Gotta) Fight for Your Right, No Sleep Till Brooklyn, Paul Revere, Hold It Now, Hit It, Brass Monkey, Slow and Low, Time to Get Ill

Code snippets like var foo = "bar"; can be shown inline.

Also, this should vertically align ~~with this~~ ~~and this~~.

Code can also be shown in a block element.

foo := "bar";
bar := "foo";

Code can also use syntax highlighting.

func main() {
  input := `var foo = "bar";`

  lexer := lexers.Get("javascript")
  iterator, _ := lexer.Tokenise(nil, input)
  style := styles.Get("github")
  formatter := html.New(html.WithLineNumbers())

  var buff bytes.Buffer
  formatter.Format(&buff, style, iterator)

  fmt.Println(buff.String())
}

Long, single-line code blocks should not wrap. They should horizontally scroll if they are too long. This line should be long enough to demonstrate this.

Inline code inside table cells should still be distinguishable.

Language	Code
Javascript	`var foo = "bar";`
Ruby	`foo = "bar"{`

Small images should be shown at their actual size.

Large images should always scale down and fit in the content container.

Components

Alerts

This is an alert.

Note:

This is an alert with a title.

This is a successful alert.

This is a warning!

Warning!

This is a warning with a title!

Sizing

Add some sections here to see how the ToC looks like. Bacon ipsum dolor sit amet t-bone doner shank drumstick, pork belly porchetta chuck sausage brisket ham hock rump pig. Chuck kielbasa leberkas, pork bresaola ham hock filet mignon cow shoulder short ribs biltong.

Parameters available

Using pixels

Using rem

Memory

RAM to use

More is better

Used RAM

This is the final element on the page and there should be no margin below this.

Blog: Blog post with featured image

Sat, 06 Oct 2018 00:00:00 +0000

Text can be bold, italic, or ~~strikethrough~~. Links should be blue with no underlines (unless hovered over).

There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs.

There should be no margin above this first sentence.

Blockquotes should be a lighter gray with a border along the left side in the secondary color.

There should be no margin below this final sentence.

First Header

On big screens, paragraphs and headings should not take up the full container width, but we want tables, code blocks and similar to take the full width.

Lorem markdownum tuta hospes stabat; idem saxum facit quaterque repetito occumbere, oves novem gestit haerebat frena; qui. Respicit recurvam erat: pignora hinc reppulit nos aut, aptos, ipsa.

Meae optatos passa est Epiros utiliter Talibus niveis, hoc lata, edidit. Dixi ad aestum.

Header 2

This is a blockquote following a header. Bacon ipsum dolor sit amet t-bone doner shank drumstick, pork belly porchetta chuck sausage brisket ham hock rump pig. Chuck kielbasa leberkas, pork bresaola ham hock filet mignon cow shoulder short ribs biltong.

Header 3

This is a code block following a header.

Header 4

This is an unordered list following a header.
This is an unordered list following a header.
This is an unordered list following a header.

Header 5

This is an ordered list following a header.
This is an ordered list following a header.
This is an ordered list following a header.

Header 6

What	Follows
A table	A header
A table	A header
A table	A header

There’s a horizontal rule above and below this.

Here is an unordered list:

Salt-n-Pepa
Bel Biv DeVoe
Kid ‘N Play

And an ordered list:

Michael Jackson
Michael Bolton
Michael Bublé

And an unordered task list:

Create a sample markdown document
Add task lists to it
Take a vacation

And a “mixed” task list:

Steal underpants
?
Profit!

And a nested list:

Jackson 5
- Michael
- Tito
- Jackie
- Marlon
- Jermaine
TMNT
- Leonardo
- Michelangelo
- Donatello
- Raphael

Definition lists can be used with Markdown syntax. Definition terms are bold.

Name: Godzilla
Born: 1952
Birthplace: Japan
Color: Green

Tables should have bold headings and alternating shaded rows.

Artist	Album	Year
Michael Jackson	Thriller	1982
Prince	Purple Rain	1984
Beastie Boys	License to Ill	1986

If a table is too wide, it should scroll horizontally.

Artist	Album	Year	Label	Awards	Songs
Michael Jackson	Thriller	1982	Epic Records	Grammy Award for Album of the Year, American Music Award for Favorite Pop/Rock Album, American Music Award for Favorite Soul/R&B Album, Brit Award for Best Selling Album, Grammy Award for Best Engineered Album, Non-Classical	Wanna Be Startin’ Somethin', Baby Be Mine, The Girl Is Mine, Thriller, Beat It, Billie Jean, Human Nature, P.Y.T. (Pretty Young Thing), The Lady in My Life
Prince	Purple Rain	1984	Warner Brothers Records	Grammy Award for Best Score Soundtrack for Visual Media, American Music Award for Favorite Pop/Rock Album, American Music Award for Favorite Soul/R&B Album, Brit Award for Best Soundtrack/Cast Recording, Grammy Award for Best Rock Performance by a Duo or Group with Vocal	Let’s Go Crazy, Take Me With U, The Beautiful Ones, Computer Blue, Darling Nikki, When Doves Cry, I Would Die 4 U, Baby I’m a Star, Purple Rain
Beastie Boys	License to Ill	1986	Mercury Records	noawardsbutthistablecelliswide	Rhymin & Stealin, The New Style, She’s Crafty, Posse in Effect, Slow Ride, Girls, (You Gotta) Fight for Your Right, No Sleep Till Brooklyn, Paul Revere, Hold It Now, Hit It, Brass Monkey, Slow and Low, Time to Get Ill

Code snippets like var foo = "bar"; can be shown inline.

Also, this should vertically align ~~with this~~ ~~and this~~.

Code can also be shown in a block element.

foo := "bar";
bar := "foo";

Code can also use syntax highlighting.

func main() {
  input := `var foo = "bar";`

  lexer := lexers.Get("javascript")
  iterator, _ := lexer.Tokenise(nil, input)
  style := styles.Get("github")
  formatter := html.New(html.WithLineNumbers())

  var buff bytes.Buffer
  formatter.Format(&buff, style, iterator)

  fmt.Println(buff.String())
}

Long, single-line code blocks should not wrap. They should horizontally scroll if they are too long. This line should be long enough to demonstrate this.

Inline code inside table cells should still be distinguishable.

Language	Code
Javascript	`var foo = "bar";`
Ruby	`foo = "bar"{`

Small images should be shown at their actual size.

Large images should always scale down and fit in the content container.

Components

Alerts

This is an alert.

Note:

This is an alert with a title.

This is a successful alert.

This is a warning!

Warning!

This is a warning with a title!

Sizing

Parameters available

Using pixels

Using rem

Memory

RAM to use

More is better

Used RAM

This is the final element on the page and there should be no margin below this.