blob: 4c0a34185ca57084d69b850a0570ca062222d506 [file] [log] [blame]
<!DOCTYPE html>
<html lang="en" dir=ZgotmplZ>
<head>
<link rel="stylesheet" href="/bootstrap/css/bootstrap.min.css">
<script src="/bootstrap/js/bootstrap.bundle.min.js"></script>
<link rel="stylesheet" type="text/css" href="/font-awesome/css/font-awesome.min.css">
<script src="/js/anchor.min.js"></script>
<script src="/js/flink.js"></script>
<link rel="canonical" href="https://flink.apache.org/how-to-contribute/improve-website/">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Improving the Website # The Apache Flink website presents Apache Flink and its community. It serves several purposes including:
Informing visitors about Apache Flink and its features. Encouraging visitors to download and use Flink. Encouraging visitors to engage with the community. We welcome any contribution to improve our website. This document contains all information that is necessary to improve Flink&rsquo;s website.
Obtain the website sources # The website of Apache Flink is hosted in a dedicated git repository which is mirrored to GitHub at https://github.">
<meta name="theme-color" content="#FFFFFF"><meta property="og:title" content="Contribute to the Website" />
<meta property="og:description" content="Improving the Website # The Apache Flink website presents Apache Flink and its community. It serves several purposes including:
Informing visitors about Apache Flink and its features. Encouraging visitors to download and use Flink. Encouraging visitors to engage with the community. We welcome any contribution to improve our website. This document contains all information that is necessary to improve Flink&rsquo;s website.
Obtain the website sources # The website of Apache Flink is hosted in a dedicated git repository which is mirrored to GitHub at https://github." />
<meta property="og:type" content="article" />
<meta property="og:url" content="https://flink.apache.org/how-to-contribute/improve-website/" /><meta property="article:section" content="how-to-contribute" />
<title>Contribute to the Website | Apache Flink</title>
<link rel="manifest" href="/manifest.json">
<link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="alternate" hreflang="zh" href="https://flink.apache.org/zh/how-to-contribute/improve-website/" title="贡献网站">
<link rel="stylesheet" href="/book.min.22eceb4d17baa9cdc0f57345edd6f215a40474022dfee39b63befb5fb3c596b5.css" integrity="sha256-IuzrTRe6qc3A9XNF7dbyFaQEdAIt/uObY777X7PFlrU=">
<script defer src="/en.search.min.2698f0d1b683dae4d6cb071668b310a55ebcf1c48d11410a015a51d90105b53e.js" integrity="sha256-Jpjw0baD2uTWywcWaLMQpV688cSNEUEKAVpR2QEFtT4="></script>
<!--
Made with Book Theme
https://github.com/alex-shpak/hugo-book
-->
<meta name="generator" content="Hugo 0.124.1">
<script>
var _paq = window._paq = window._paq || [];
_paq.push(['disableCookies']);
_paq.push(["setDomains", ["*.flink.apache.org","*.nightlies.apache.org/flink"]]);
_paq.push(['trackPageView']);
_paq.push(['enableLinkTracking']);
(function() {
var u="//analytics.apache.org/";
_paq.push(['setTrackerUrl', u+'matomo.php']);
_paq.push(['setSiteId', '1']);
var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
})();
</script>
</head>
<body dir=ZgotmplZ>
<header>
<nav class="navbar navbar-expand-xl">
<div class="container-fluid">
<a class="navbar-brand" href="/">
<img src="/img/logo/png/100/flink_squirrel_100_color.png" alt="Apache Flink" height="47" width="47" class="d-inline-block align-text-middle">
<span>Apache Flink</span>
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<i class="fa fa-bars navbar-toggler-icon"></i>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav">
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">About</a>
<ul class="dropdown-menu">
<li>
<a class="dropdown-item" href="/what-is-flink/flink-architecture/">Architecture</a>
</li>
<li>
<a class="dropdown-item" href="/what-is-flink/flink-applications/">Applications</a>
</li>
<li>
<a class="dropdown-item" href="/what-is-flink/flink-operations/">Operations</a>
</li>
<li>
<a class="dropdown-item" href="/what-is-flink/use-cases/">Use Cases</a>
</li>
<li>
<a class="dropdown-item" href="/what-is-flink/powered-by/">Powered By</a>
</li>
<li>
<a class="dropdown-item" href="/what-is-flink/roadmap/">Roadmap</a>
</li>
<li>
<a class="dropdown-item" href="/what-is-flink/community/">Community & Project Info</a>
</li>
<li>
<a class="dropdown-item" href="/what-is-flink/security/">Security</a>
</li>
<li>
<a class="dropdown-item" href="/what-is-flink/special-thanks/">Special Thanks</a>
</li>
</ul>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Getting Started</a>
<ul class="dropdown-menu">
<li>
<a class="dropdown-item" href="https://nightlies.apache.org/flink/flink-docs-stable/docs/try-flink/local_installation/">With Flink<i class="link fa fa-external-link title" aria-hidden="true"></i>
</a>
</li>
<li>
<a class="dropdown-item" href="https://nightlies.apache.org/flink/flink-kubernetes-operator-docs-stable/docs/try-flink-kubernetes-operator/quick-start/">With Flink Kubernetes Operator<i class="link fa fa-external-link title" aria-hidden="true"></i>
</a>
</li>
<li>
<a class="dropdown-item" href="https://nightlies.apache.org/flink/flink-cdc-docs-stable/docs/get-started/introduction/">With Flink CDC<i class="link fa fa-external-link title" aria-hidden="true"></i>
</a>
</li>
<li>
<a class="dropdown-item" href="https://nightlies.apache.org/flink/flink-ml-docs-stable/docs/try-flink-ml/quick-start/">With Flink ML<i class="link fa fa-external-link title" aria-hidden="true"></i>
</a>
</li>
<li>
<a class="dropdown-item" href="https://nightlies.apache.org/flink/flink-statefun-docs-stable/getting-started/project-setup.html">With Flink Stateful Functions<i class="link fa fa-external-link title" aria-hidden="true"></i>
</a>
</li>
<li>
<a class="dropdown-item" href="https://nightlies.apache.org/flink/flink-docs-stable/docs/learn-flink/overview/">Training Course<i class="link fa fa-external-link title" aria-hidden="true"></i>
</a>
</li>
</ul>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Documentation</a>
<ul class="dropdown-menu">
<li>
<a class="dropdown-item" href="https://nightlies.apache.org/flink/flink-docs-stable/">Flink 1.19 (stable)<i class="link fa fa-external-link title" aria-hidden="true"></i>
</a>
</li>
<li>
<a class="dropdown-item" href="https://nightlies.apache.org/flink/flink-docs-master/">Flink Master (snapshot)<i class="link fa fa-external-link title" aria-hidden="true"></i>
</a>
</li>
<li>
<a class="dropdown-item" href="https://nightlies.apache.org/flink/flink-kubernetes-operator-docs-stable/">Kubernetes Operator 1.8 (latest)<i class="link fa fa-external-link title" aria-hidden="true"></i>
</a>
</li>
<li>
<a class="dropdown-item" href="https://nightlies.apache.org/flink/flink-kubernetes-operator-docs-main">Kubernetes Operator Main (snapshot)<i class="link fa fa-external-link title" aria-hidden="true"></i>
</a>
</li>
<li>
<a class="dropdown-item" href="https://nightlies.apache.org/flink/flink-cdc-docs-stable">CDC 3.0 (stable)<i class="link fa fa-external-link title" aria-hidden="true"></i>
</a>
</li>
<li>
<a class="dropdown-item" href="https://nightlies.apache.org/flink/flink-cdc-docs-master">CDC Master (snapshot)<i class="link fa fa-external-link title" aria-hidden="true"></i>
</a>
</li>
<li>
<a class="dropdown-item" href="https://nightlies.apache.org/flink/flink-ml-docs-stable/">ML 2.3 (stable)<i class="link fa fa-external-link title" aria-hidden="true"></i>
</a>
</li>
<li>
<a class="dropdown-item" href="https://nightlies.apache.org/flink/flink-ml-docs-master">ML Master (snapshot)<i class="link fa fa-external-link title" aria-hidden="true"></i>
</a>
</li>
<li>
<a class="dropdown-item" href="https://nightlies.apache.org/flink/flink-statefun-docs-stable/">Stateful Functions 3.3 (stable)<i class="link fa fa-external-link title" aria-hidden="true"></i>
</a>
</li>
<li>
<a class="dropdown-item" href="https://nightlies.apache.org/flink/flink-statefun-docs-master">Stateful Functions Master (snapshot)<i class="link fa fa-external-link title" aria-hidden="true"></i>
</a>
</li>
</ul>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">How to Contribute</a>
<ul class="dropdown-menu">
<li>
<a class="dropdown-item" href="/how-to-contribute/overview/">Overview</a>
</li>
<li>
<a class="dropdown-item" href="/how-to-contribute/contribute-code/">Contribute Code</a>
</li>
<li>
<a class="dropdown-item" href="/how-to-contribute/reviewing-prs/">Review Pull Requests</a>
</li>
<li>
<a class="dropdown-item" href="/how-to-contribute/code-style-and-quality-preamble/">Code Style and Quality Guide</a>
</li>
<li>
<a class="dropdown-item" href="/how-to-contribute/contribute-documentation/">Contribute Documentation</a>
</li>
<li>
<a class="dropdown-item" href="/how-to-contribute/documentation-style-guide/">Documentation Style Guide</a>
</li>
<li>
<a class="dropdown-item" href="/how-to-contribute/improve-website/">Contribute to the Website</a>
</li>
<li>
<a class="dropdown-item" href="/how-to-contribute/getting-help/">Getting Help</a>
</li>
</ul>
</li>
<li class="nav-item">
<a class="nav-link" href="/posts/">Flink Blog</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/downloads/">Downloads</a>
</li>
</ul>
<div class="book-search">
<div class="book-search-spinner hidden">
<i class="fa fa-refresh fa-spin"></i>
</div>
<form class="search-bar d-flex" onsubmit="return false;"su>
<input type="text" id="book-search-input" placeholder="Search" aria-label="Search" maxlength="64" data-hotkeys="s/">
<i class="fa fa-search search"></i>
<i class="fa fa-circle-o-notch fa-spin spinner"></i>
</form>
<div class="book-search-spinner hidden"></div>
<ul id="book-search-results"></ul>
</div>
</div>
</div>
</nav>
<div class="navbar-clearfix"></div>
</header>
<main class="flex">
<section class="container book-page">
<article class="markdown"><h1 id="improving-the-website">
Improving the Website
<a class="anchor" href="#improving-the-website">#</a>
</h1>
<p>The <a href="http://flink.apache.org">Apache Flink website</a> presents Apache Flink and its community. It serves several purposes including:</p>
<ul>
<li>Informing visitors about Apache Flink and its features.</li>
<li>Encouraging visitors to download and use Flink.</li>
<li>Encouraging visitors to engage with the community.</li>
</ul>
<p>We welcome any contribution to improve our website. This document contains all information that is necessary to improve Flink&rsquo;s website.</p>
<h2 id="obtain-the-website-sources">
Obtain the website sources
<a class="anchor" href="#obtain-the-website-sources">#</a>
</h2>
<p>The website of Apache Flink is hosted in a dedicated <a href="http://git-scm.com/">git</a> repository which is mirrored to GitHub at <a href="https://github.com/apache/flink-web">https://github.com/apache/flink-web</a>.</p>
<p>The easiest way to contribute website updates is to fork <a href="https://github.com/apache/flink-web">the mirrored website repository on GitHub</a> into your own GitHub account by clicking on the fork button at the top right. If you have no GitHub account, you can create one for free.</p>
<p>Next, clone your fork to your local machine.</p>
<pre tabindex="0"><code>git clone https://github.com/&lt;your-user-name&gt;/flink-web.git
</code></pre><p>The <code>flink-web</code> directory contains the cloned repository. The website resides in the <code>asf-site</code> branch of the repository. Run the following commands to enter the directory and switch to the <code>asf-site</code> branch.</p>
<pre tabindex="0"><code>cd flink-web
git checkout asf-site
</code></pre><h2 id="directory-structure-and-files">
Directory structure and files
<a class="anchor" href="#directory-structure-and-files">#</a>
</h2>
<p>Flink&rsquo;s website is written in <a href="http://daringfireball.net/projects/markdown/">Markdown</a>. Markdown is a lightweight markup language which can be translated to HTML. We use <a href="https://gohugo.io/">Hugo</a> to generate static HTML files from Markdown.</p>
<p>The files and directories in the website git repository have the following roles:</p>
<ul>
<li>All files ending with <code>.md</code> are Markdown files. These files are translated into static HTML files.</li>
<li>The <code>docs</code> directory contains all documentation, themes and other content that&rsquo;s needed to render and/or generate the website.</li>
<li>The <code>docs/content/docs</code> folder contains all English content. The <code>docs/content.zh/docs</code> contains all Chinese content.</li>
<li>The <code>docs/content/posts</code> contains all blog posts.</li>
<li>The <code>content/</code> directory contains the generated HTML files from Hugo. It is important to place the files in this directory since the Apache Infrastructure to host the Flink website is pulling the HTML content from this directory. (For committers: When pushing changes to the website git, push also the updates in the <code>content/</code> directory!)</li>
</ul>
<h2 id="update-or-extend-the-documentation">
Update or extend the documentation
<a class="anchor" href="#update-or-extend-the-documentation">#</a>
</h2>
<p>You can update and extend the website by modifying or adding Markdown files or any other resources such as CSS files. To verify your changes start the build script in preview mode.</p>
<pre tabindex="0"><code>./build.sh
</code></pre><p>The script compiles the Markdown files into HTML and starts a local webserver. Open your browser at <code>http://localhost:1313</code> to view the website including your changes. The Chinese translation is located at <code>http://localhost:1313/zh/</code>. The served website is automatically re-compiled and updated when you modify and save any file and refresh your browser.</p>
<p>To add an external hyperlink to the official documentation of Flink in your documentations or blog posts, please use the following syntax:</p>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-markdown" data-lang="markdown"><span class="line"><span class="cl">{{<span class="p">&lt;</span> <span class="nt">docs_link</span> <span class="na">file</span><span class="o">=</span><span class="s">&#34;relative_path/&#34;</span> <span class="na">name</span><span class="o">=</span><span class="s">&#34;Title&#34;</span><span class="p">&gt;</span>}}
</span></span></code></pre></div><p>For example:</p>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-markdown" data-lang="markdown"><span class="line"><span class="cl">{{<span class="p">&lt;</span> <span class="nt">docs_link</span> <span class="na">file</span><span class="o">=</span><span class="s">&#34;flink-docs-stable/docs/dev/datastream/side_output/&#34;</span> <span class="na">name</span><span class="o">=</span><span class="s">&#34;Side Output&#34;</span><span class="p">&gt;</span>}}
</span></span></code></pre></div><p>Please feel free to ask any questions you have on the developer mailing list.</p>
<h2 id="submit-your-contribution">
Submit your contribution
<a class="anchor" href="#submit-your-contribution">#</a>
</h2>
<p>The Flink project accepts website contributions through the <a href="https://github.com/apache/flink-web">GitHub Mirror</a> as <a href="https://help.github.com/articles/using-pull-requests">Pull Requests</a>. Pull requests are a simple way of offering a patch by providing a pointer to a code branch that contains the changes.</p>
<p>To prepare and submit a pull request follow these steps.</p>
<ol>
<li>
<p>Commit your changes to your local git repository. Unless your contribution is a major rework of the website, please squash it into a single commit.</p>
</li>
<li>
<p>Push the commit to a dedicated branch of your fork of the Flink repository at GitHub.</p>
<pre tabindex="0"><code>git push origin myBranch
</code></pre></li>
<li>
<p>Go the website of your repository fork (<code>https://github.com/&lt;your-user-name&gt;/flink-web</code>) and use the &ldquo;Create Pull Request&rdquo; button to start creating a pull request. Make sure that the base fork is <code>apache/flink-web asf-site</code> and the head fork selects the branch with your changes. Give the pull request a meaningful description and submit it.</p>
</li>
</ol>
<h2 id="committer-section">
Committer section
<a class="anchor" href="#committer-section">#</a>
</h2>
<p><strong>This section is only relevant for committers.</strong></p>
<h3 id="asf-website-git-repositories">
ASF website git repositories
<a class="anchor" href="#asf-website-git-repositories">#</a>
</h3>
<p><strong>ASF writable</strong>: <a href="https://gitbox.apache.org/repos/asf/flink-web.git">https://gitbox.apache.org/repos/asf/flink-web.git</a></p>
<p>Details on how to set the credentials for the ASF git repository are <a href="https://gitbox.apache.org/">linked here</a>.</p>
<h3 id="merging-a-pull-request">
Merging a pull request
<a class="anchor" href="#merging-a-pull-request">#</a>
</h3>
<p>Contributions are expected to be done on the source files only (no modifications on the compiled files in the <code>content/</code> directory.). Before pushing a website change, please run the build script</p>
<pre tabindex="0"><code>./build.sh
</code></pre><p>add the changes to the <code>content/</code> directory as an additional commit and push the changes to the ASF base repository.</p>
</article>
<div class="edit-this-page">
<p>
<a href="https://cwiki.apache.org/confluence/display/FLINK/Flink+Translation+Specifications">Want to contribute translation?</a>
</p>
<p>
<a href="//github.com/apache/flink-web/edit/asf-site/docs/content/how-to-contribute/improve-website.md">
Edit This Page<i class="fa fa-edit fa-fw"></i>
</a>
</p>
</div>
</section>
<aside class="book-toc">
<nav id="TableOfContents"><h3>On This Page <a href="javascript:void(0)" class="toc" onclick="collapseToc()"><i class="fa fa-times" aria-hidden="true"></i></a></h3>
<ul>
<li><a href="#improving-the-website">Improving the Website</a>
<ul>
<li><a href="#obtain-the-website-sources">Obtain the website sources</a></li>
<li><a href="#directory-structure-and-files">Directory structure and files</a></li>
<li><a href="#update-or-extend-the-documentation">Update or extend the documentation</a></li>
<li><a href="#submit-your-contribution">Submit your contribution</a></li>
<li><a href="#committer-section">Committer section</a>
<ul>
<li><a href="#asf-website-git-repositories">ASF website git repositories</a></li>
<li><a href="#merging-a-pull-request">Merging a pull request</a></li>
</ul>
</li>
</ul>
</li>
</ul>
</nav>
</aside>
<aside class="expand-toc hidden">
<a class="toc" onclick="expandToc()" href="javascript:void(0)">
<i class="fa fa-bars" aria-hidden="true"></i>
</a>
</aside>
</main>
<footer>
<div class="separator"></div>
<div class="panels">
<div class="wrapper">
<div class="panel">
<ul>
<li>
<a href="https://flink-packages.org/">flink-packages.org</a>
</li>
<li>
<a href="https://www.apache.org/">Apache Software Foundation</a>
</li>
<li>
<a href="https://www.apache.org/licenses/">License</a>
</li>
<li>
<a href="/zh/how-to-contribute/improve-website/">
<i class="fa fa-globe" aria-hidden="true"></i>&nbsp;中文版
</a>
</li>
</ul>
</div>
<div class="panel">
<ul>
<li>
<a href="/what-is-flink/security">Security</a-->
</li>
<li>
<a href="https://www.apache.org/foundation/sponsorship.html">Donate</a>
</li>
<li>
<a href="https://www.apache.org/foundation/thanks.html">Thanks</a>
</li>
</ul>
</div>
<div class="panel icons">
<div>
<a href="/posts">
<div class="icon flink-blog-icon"></div>
<span>Flink blog</span>
</a>
</div>
<div>
<a href="https://github.com/apache/flink">
<div class="icon flink-github-icon"></div>
<span>Github</span>
</a>
</div>
<div>
<a href="https://twitter.com/apacheflink">
<div class="icon flink-twitter-icon"></div>
<span>Twitter</span>
</a>
</div>
</div>
</div>
</div>
<hr/>
<div class="container disclaimer">
<p>The contents of this website are © 2024 Apache Software Foundation under the terms of the Apache License v2. Apache Flink, Flink, and the Flink logo are either registered trademarks or trademarks of The Apache Software Foundation in the United States and other countries.</p>
</div>
</footer>
</body>
</html>