1
0
mirror of https://github.com/laurent22/joplin.git synced 2024-12-24 10:27:10 +02:00
joplin/docs/index.html
2021-07-24 11:15:07 +01:00

723 lines
24 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<!-- Donate button A/B testing -->
<script async src="https://www.googleoptimize.com/optimize.js?id=OPT-PW3ZPK3"></script> <meta
charset="utf-8"
http-equiv="X-UA-Compatible"
content="IE=edge,chrome=1"
/>
<link rel="icon" href="&#x2F;images/favicon.png" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" />
<meta name="description" content="Joplin, the open source note-taking application" />
<link rel="stylesheet" href="&#x2F;css/fontawesome-all.min.css?t=1627121689688">
<link
rel="stylesheet"
href="&#x2F;css/bootstrap5.0.2.min.css"
as="style"
/>
<link
href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&display=swap"
rel="stylesheet"
as="style"
media="all"
onload="this.media='all'; this.onload = null"
/>
<link rel="stylesheet" href="&#x2F;css/site.css?t=1627121689688" as="style" />
<title>Joplin</title>
</head>
<body class="front-page website-env-prod">
<div class="container-fluid" id="main-container">
<div class="navbar-frontpage blue-bg " id="nav-section">
<div class="container">
<div class="row">
<div class="col-3">
<a href="/">
<img
src="&#x2F;images/logo-text.svg"
alt=""
id="top-logo"
width="180"
/>
</a>
</div>
<div class="col-9 text-right d-none d-md-block">
<a href="/help/" class="fw500">Help</a>
<a href="https:&#x2F;&#x2F;discourse.joplinapp.org&#x2F;" class="fw500">Forum</a>
<a href="/plans/" class="button-link btn-trans plans-button">Joplin Cloud</a><a class="button-link btn-blue sponsor-button" href="/donate">
<i class="fas fa-heart heart-full"></i><i class="far fa-heart heart-line"></i>&nbsp;Support us
</a> </div>
<div class="col-9 text-right d-block d-md-none">
<span class="pointer"
><img
src="&#x2F;images/mobile-menu-open-icon.png"
id="open-menu-mobile"
alt=""
/></span>
&nbsp;&nbsp;
<div id="menu-mobile">
<div>
<div class="text-right">
<img
src="&#x2F;images/close-icon.png"
alt=""
class="pointer"
id="close-menu-mobile"
/>
</div>
<div class="text-center menu-mobile-top">
<a href="https:&#x2F;&#x2F;discourse.joplinapp.org&#x2F;" class="fw500 mobile-menu-link">Forum</a>
<a href="/help/" class="fw500 mobile-menu-link">Help</a>
</div>
<div class="menu-mobile-buttons">
<a href="/plans/" class="button-link btn-trans plans-button">Joplin Cloud</a><a class="button-link btn-blue sponsor-button" href="/donate">
<i class="fas fa-heart heart-full"></i><i class="far fa-heart heart-line"></i>&nbsp;Support us
</a> </div>
</div>
<div>
<p class="light-blue mobile-menu-link-bottom text-center">
Copyright &copy; 2016-2021 Laurent&nbsp;Cozic
<br/>
<a href="/privacy/" class="fw500">Privacy Policy</a>
</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="blue-bg" id="top-section">
<div class="container">
<div class="row">
<div class="col-12">
<div class="alert alert-danger alert-env-dev" role="alert">
Running in prod mode!
</div>
<h1 class="text-center">
Free your <span class="frame-bg frame-bg-blue">notes</span>
</h1>
<p class="text-center" id="top-section-text">
Joplin is an open source note-taking app. Capture your thoughts and securely access them from any device.
</p>
<br />
<br />
<p class="text-center">
<a href="/download/" class="button-link btn-blue download-button">Download the app</a>
<a href="/plans/" class="button-link btn-trans plans-button">Sign up with Joplin Cloud</a>
</p>
<picture class="img-fluid img-center" id="top-section-img">
<source type="image/webp" srcset="
&#x2F;images/home-top-img-4x.webp 4820w,
&#x2F;images/home-top-img-2x.webp 2388w,
&#x2F;images/home-top-img.webp 1205w
">
<source type="image/png" srcset="
&#x2F;images/home-top-img-2x.png 2388w,
&#x2F;images/home-top-img.png 1205w
">
<img id="top-section-img-img" src="&#x2F;images/home-top-img-2x.png">
</picture>
</div>
</div>
</div>
</div>
<div id="multimedia-notes-section">
<div class="container">
<div class="row">
<div class="col-12 col-md-5 col-xxl-6">
<div class="ml-30 ml-mobile-0">
<h2 id="multimedia-title">
<span class="frame-bg frame-bg-yellow">Multimedia</span> notes
</h2>
<p id="multimedia-text">
Images, videos, PDFs and audio files are supported. Create
math expressions and diagrams directly from the app. Take
photos with the mobile app and save them to a note.
</p>
<br />
<p>
<a href="/download/" class="button-link btn-blue">Download the app</a>
</p>
</div>
</div>
<div class="col-12 col-md-7 col-xxl-6">
<br class="d-block d-lg-none" />
<br class="d-block d-lg-none" />
<img
src="&#x2F;images/multimedia-notes-img.png"
alt=""
class="img-fluid"
id="multimedia-notes-section-img"
/>
</div>
</div>
</div>
</div>
<div id="work-together-section" class="gray-bg">
<div class="container">
<div class="row">
<div class="col-6 d-none d-md-block"></div>
<div class="col-12 col-md-6">
<div class="ml-30 ml-mobile-0">
<h2>Work together</h2>
<p>
With Joplin Cloud, share your notes with your friends, family
or colleagues and collaborate on them.
</p>
<br />
<p>
<a href="/plans/" class="button-link btn-blue">Try it now</a>
</p>
<br class="d-block d-md-none" />
<br class="d-block d-md-none" />
<div class="text-center">
<img
src="&#x2F;images/work-together-img.png"
alt=""
class="img-fluid d-block-inline d-md-none"
/>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="save-web-section" class="blue-bg">
<div class="container">
<div class="row">
<div class="col-12 col-md-6">
<div class="ml-30 ml-mobile-0">
<h2 id="save-web-title">
Save <span class="frame-bg frame-bg-blue">web pages</span> <br />as notes
</h2>
<p>
Use the web clipper extension, available on Chrome and
Firefox, to save web pages or take screenshots as notes.
</p>
<br />
<p>
<a href="/clipper/" class="button-link btn-blue">Get the clipper</a>
</p>
</div>
</div>
<div class="col-12 col-md-6">
<br class="d-block d-md-none" />
<br class="d-block d-md-none" />
<img
src="&#x2F;images/save-web-img.png"
alt=""
class="img-fluid"
id="save-web-img"
/>
</div>
</div>
</div>
</div>
<div id="customise-it-section">
<div class="container">
<div class="row">
<div class="d-none d-md-block col-md-6">
<img
src="&#x2F;images/customise-it-img.png"
alt=""
class="img-fluid"
/>
</div>
<div class="col-12 col-md-6">
<div class="ml-30 ml-mobile-0">
<h2 id="customise-it-title">
<span class="frame-bg frame-bg-yellow-lg">Customise</span> it
<br />
to your needs
</h2>
<p>
Customise the app with plugins, custom themes and multiple
text editors (Rich Text or Markdown). Or create your own
scripts and plugins using the Extension API.
</p>
<br />
<p>
<a href="/help/#plugins" class="button-link btn-blue">Find out more</a>
</p>
<br class="d-block d-lg-none" />
<br class="d-block d-lg-none" />
<img
src="&#x2F;images/customise-it-img.png"
alt=""
class="img-fluid d-block d-md-none"
/>
</div>
</div>
</div>
</div>
</div>
<div id="your-note-section" class="blue-bg">
<div class="container">
<div class="row">
<div class="col-12">
<h2 class="text-center">
Your notes, <span class="frame-bg frame-bg-blue-lg">everywhere</span> you are
</h2>
<p class="text-center" id="your-note-text">
Access your notes from your computer, phone or tablet by synchronising with various services, including Joplin Cloud, Dropbox and OneDrive. The app is available on Windows, macOS, Linux, Android and iOS. A terminal app is also available!
</p>
<br />
<br />
<p class="text-center">
<a href="/download/" class="button-link btn-blue">Download it now</a>
</p>
<br />
</div>
</div>
</div>
</div>
<div id="your-data-section" class="gray-bg">
<div class="container">
<div class="row">
<div class="col-12 col-md-6">
<br class="d-block d-md-none" />
<div class="ml-30 ml-mobile-0">
<h2>100% <span class="frame-bg frame-bg-yellow-lg">your data</span></h2>
<p>
The app is open source and your notes are saved to an open
format, so you'll always have access to them. Uses End-To-End Encryption (E2EE) to secure your notes and ensure no-one but
yourself can access them.
</p>
<br />
<p>
<a href="/e2ee/" class="button-link btn-blue">More about E2EE</a>
</p>
</div>
</div>
<div class="col-12 col-md-6">
<br class="d-block d-md-none" />
<br class="d-block d-md-none" />
<br class="d-block d-md-none" />
<img
src="&#x2F;images/your-data-img.png"
alt=""
class="img-fluid"
/>
</div>
</div>
</div>
</div>
<div id="in-the-press-section">
<div class="container">
<div class="row">
<div class="col-12">
<br />
<h2 class="text-center">
In the <span class="frame-bg frame-bg-yellow">Press</span>
</h2>
<br />
</div>
<div class="d-none d-md-block col-3">
<img
src="&#x2F;images/in-the-press-img-left.png"
alt=""
class="img-fluid d-none d-md-block"
/>
</div>
<div class="d-none d-md-block col-6">
<div
id="carouselRegular"
class="carousel slide d-none d-md-block"
data-bs-ride="carousel"
>
<div class="carousel-indicators">
<button
type="button"
data-bs-target="#carouselRegular"
data-bs-slide-to="0"
class="active"
aria-current="true"
aria-label="Slide 1"
></button>
<button
type="button"
data-bs-target="#carouselRegular"
data-bs-slide-to="1"
aria-label="Slide 2"
></button>
<button
type="button"
data-bs-target="#carouselRegular"
data-bs-slide-to="2"
aria-label="Slide 3"
></button>
</div> <div class="carousel-inner">
<div class="carousel-item active press-carousel" data-bs-interval="10000">
<img
src="&#x2F;images/transparent-bg.png"
class="d-block w-100"
alt=""
/>
<div class="carousel-caption">
<img
src="&#x2F;images/in-the-press-life-hacker.png"
alt=""
class="img-fluid img-center photo"
/>
<br />
<p class="text-center">
“It lets you create multiple types of notes, reminders, and alarms, all of which can be synced. The app also includes a web clipper too, but in our opinion, Joplin’s best feature is the built-in end-to-end encryption for keeping your notes private.”
</p>
<br />
<p class="fw500 text-center">
<a href="https:&#x2F;&#x2F;lifehacker.com&#x2F;the-best-note-taking-apps-1837842880">Life Hacker, &quot;The Best Note-Taking Apps&quot;</a>
</p>
<p class="fw400 small text-center">By Brendan Hesse</p>
</div>
</div><div class="carousel-item press-carousel" data-bs-interval="10000">
<img
src="&#x2F;images/transparent-bg.png"
class="d-block w-100"
alt=""
/>
<div class="carousel-caption">
<img
src="&#x2F;images/in-the-press-life-pcmag.png"
alt=""
class="img-fluid img-center photo"
/>
<br />
<p class="text-center">
“Joplin is single handedly the best pick for an open-source note-taking app, making it an Editors&#39; Choice winner for that category. Unlike some open-source tools, which are incredibly difficult to use, Joplin is surprisingly user friendly, even in setting up storage and syncing.”
</p>
<br />
<p class="fw500 text-center">
<a href="https:&#x2F;&#x2F;www.pcmag.com&#x2F;reviews&#x2F;joplin">PCMag, &quot;The Best Open-Source Note-Taking App&quot;</a>
</p>
<p class="fw400 small text-center">By Jill Duffy</p>
</div>
</div><div class="carousel-item press-carousel" data-bs-interval="10000">
<img
src="&#x2F;images/transparent-bg.png"
class="d-block w-100"
alt=""
/>
<div class="carousel-caption">
<img
src="&#x2F;images/in-the-press-its-foss.png"
alt=""
class="img-fluid img-center photo"
/>
<br />
<p class="text-center">
“Joplin is an excellent open source note taking application with plenty of features. You can take notes, make to-do list and sync your notes across devices by linking it with cloud services. The synchronization is protected with end to end encryption.”
</p>
<br />
<p class="fw500 text-center">
<a href="https:&#x2F;&#x2F;itsfoss.com&#x2F;joplin&#x2F;">It&#39;s FOSS, &quot;Joplin: Open source note organizer&quot;</a>
</p>
<p class="fw400 small text-center">By Abhishek Prakash</p>
</div>
</div> </div>
</div>
</div>
<div class="d-none d-md-block col-3">
<div class="text-right">
<br />
<img
src="&#x2F;images/in-the-press-img-right.png"
alt=""
class="img-fluid d-none d-md-inline-block"
/>
</div>
</div>
</div>
<div class="row d-block d-md-none">
<div class="col-12">
<div
id="carouselMobile"
class="carousel slide"
data-bs-ride="carousel"
>
<div class="carousel-indicators">
<button
type="button"
data-bs-target="#carouselMobile"
data-bs-slide-to="0"
class="active"
aria-current="true"
aria-label="Slide 1"
></button>
<button
type="button"
data-bs-target="#carouselMobile"
data-bs-slide-to="1"
aria-label="Slide 2"
></button>
<button
type="button"
data-bs-target="#carouselMobile"
data-bs-slide-to="2"
aria-label="Slide 3"
></button>
</div> <div class="carousel-inner">
<div class="carousel-item active press-carousel" data-bs-interval="10000">
<img
src="&#x2F;images/transparent-bg.png"
class="d-block w-100"
alt=""
/>
<div class="carousel-caption">
<img
src="&#x2F;images/in-the-press-life-hacker.png"
alt=""
class="img-fluid img-center photo"
/>
<br />
<p class="text-center">
“It lets you create multiple types of notes, reminders, and alarms, all of which can be synced. The app also includes a web clipper too, but in our opinion, Joplin’s best feature is the built-in end-to-end encryption for keeping your notes private.”
</p>
<br />
<p class="fw500 text-center">
<a href="https:&#x2F;&#x2F;lifehacker.com&#x2F;the-best-note-taking-apps-1837842880">Life Hacker, &quot;The Best Note-Taking Apps&quot;</a>
</p>
<p class="fw400 small text-center">By Brendan Hesse</p>
</div>
</div><div class="carousel-item press-carousel" data-bs-interval="10000">
<img
src="&#x2F;images/transparent-bg.png"
class="d-block w-100"
alt=""
/>
<div class="carousel-caption">
<img
src="&#x2F;images/in-the-press-life-pcmag.png"
alt=""
class="img-fluid img-center photo"
/>
<br />
<p class="text-center">
“Joplin is single handedly the best pick for an open-source note-taking app, making it an Editors&#39; Choice winner for that category. Unlike some open-source tools, which are incredibly difficult to use, Joplin is surprisingly user friendly, even in setting up storage and syncing.”
</p>
<br />
<p class="fw500 text-center">
<a href="https:&#x2F;&#x2F;www.pcmag.com&#x2F;reviews&#x2F;joplin">PCMag, &quot;The Best Open-Source Note-Taking App&quot;</a>
</p>
<p class="fw400 small text-center">By Jill Duffy</p>
</div>
</div><div class="carousel-item press-carousel" data-bs-interval="10000">
<img
src="&#x2F;images/transparent-bg.png"
class="d-block w-100"
alt=""
/>
<div class="carousel-caption">
<img
src="&#x2F;images/in-the-press-its-foss.png"
alt=""
class="img-fluid img-center photo"
/>
<br />
<p class="text-center">
“Joplin is an excellent open source note taking application with plenty of features. You can take notes, make to-do list and sync your notes across devices by linking it with cloud services. The synchronization is protected with end to end encryption.”
</p>
<br />
<p class="fw500 text-center">
<a href="https:&#x2F;&#x2F;itsfoss.com&#x2F;joplin&#x2F;">It&#39;s FOSS, &quot;Joplin: Open source note organizer&quot;</a>
</p>
<p class="fw400 small text-center">By Abhishek Prakash</p>
</div>
</div> </div>
</div>
</div>
</div>
</div>
</div>
<div id="sponsors-section" class="gray-bg">
<div class="container">
<div class="row">
<div class="col-12">
<h2 class="text-center">
Our <span class="frame-bg frame-bg-blue-lg">sponsors</span>
</h2>
<p class="text-center" id="your-note-text">
Thank you for your support!
</p>
<br />
<div class="text-center sponsors-org">
<a class="sponsor-org-item" href="https:&#x2F;&#x2F;seirei.ne.jp"><img title="Serei Network" src="&#x2F;images/sponsors/SeireiNetwork.png"></a>
<a class="sponsor-org-item" href="https:&#x2F;&#x2F;usrigging.com&#x2F;"><img title="U.S. Ringing Supply" src="&#x2F;images/sponsors/RingingSupply.svg"></a>
<a class="sponsor-org-item" href="https:&#x2F;&#x2F;tranio.com&#x2F;italy&#x2F;"><img title="Tranio" src="&#x2F;images/sponsors/Tranio.png"></a>
</div>
<div class="text-center sponsors-github">
<div class="sponsor-github-item">
<a href="https://github.com/nicholashead" title="nicholashead">
<img width="50" src="https://avatars2.githubusercontent.com/u/1168659?s=96&amp;v=4">
</a>
</div>
<div class="sponsor-github-item">
<a href="https://github.com/avanderberg" title="avanderberg">
<img width="50" src="https://avatars2.githubusercontent.com/u/215668?s=96&amp;v=4">
</a>
</div>
<div class="sponsor-github-item">
<a href="https://github.com/fbloise" title="fbloise">
<img width="50" src="https://avatars2.githubusercontent.com/u/1439535?s=96&amp;v=4">
</a>
</div>
<div class="sponsor-github-item">
<a href="https://github.com/thomasbroussard" title="thomasbroussard">
<img width="50" src="https://avatars2.githubusercontent.com/u/15859362?s=96&amp;v=4">
</a>
</div>
<div class="sponsor-github-item">
<a href="https://github.com/dbrandonjohnson" title="dbrandonjohnson">
<img width="50" src="https://avatars2.githubusercontent.com/u/1307332?s=96&amp;v=4">
</a>
</div>
<div class="sponsor-github-item">
<a href="https://github.com/c-nagy" title="c-nagy">
<img width="50" src="https://avatars2.githubusercontent.com/u/3061769?s=96&amp;v=4">
</a>
</div>
<div class="sponsor-github-item">
<a href="https://github.com/mcejp" title="mcejp">
<img width="50" src="https://avatars2.githubusercontent.com/u/29300939?s=96&amp;v=4">
</a>
</div>
<div class="sponsor-github-item">
<a href="https://github.com/joesfer" title="joesfer">
<img width="50" src="https://avatars2.githubusercontent.com/u/1248504?s=96&amp;v=4">
</a>
</div>
<div class="sponsor-github-item">
<a href="https://github.com/chr15m" title="chr15m">
<img width="50" src="https://avatars2.githubusercontent.com/u/67130?s=96&amp;v=4">
</a>
</div>
<div class="sponsor-github-item">
<a href="https://github.com/piccobit" title="piccobit">
<img width="50" src="https://avatars2.githubusercontent.com/u/5782817?s=96&amp;v=4">
</a>
</div>
<div class="sponsor-github-item">
<a href="https://github.com/chrootlogin" title="chrootlogin">
<img width="50" src="https://avatars2.githubusercontent.com/u/4862947?s=96&amp;v=4">
</a>
</div>
<div class="sponsor-github-item">
<a href="https://github.com/maxtruxa" title="maxtruxa">
<img width="50" src="https://avatars2.githubusercontent.com/u/1788010?s=96&amp;v=4">
</a>
</div>
<div class="sponsor-github-item">
<a href="https://github.com/Jesssullivan" title="Jesssullivan">
<img width="50" src="https://avatars2.githubusercontent.com/u/37297218?s=96&amp;v=4">
</a>
</div>
<div class="sponsor-github-item">
<a href="https://github.com/cabottech" title="cabottech">
<img width="50" src="https://avatars2.githubusercontent.com/u/70780798?s=96&amp;v=4">
</a>
</div>
<div class="sponsor-github-item">
<a href="https://github.com/h4sh5" title="h4sh5">
<img width="50" src="https://avatars2.githubusercontent.com/u/38898566?s=96&amp;v=4">
</a>
</div>
<div class="sponsor-github-item">
<a href="https://github.com/ravenscroftj" title="ravenscroftj">
<img width="50" src="https://avatars2.githubusercontent.com/u/47742?s=96&amp;v=4">
</a>
</div>
<div class="sponsor-github-item">
<a href="https://github.com/thismarty" title="thismarty">
<img width="50" src="https://avatars2.githubusercontent.com/u/73081837?s=96&amp;v=4">
</a>
</div>
<div class="sponsor-github-item">
<a href="https://github.com/konishi-t" title="konishi-t">
<img width="50" src="https://avatars2.githubusercontent.com/u/24908652?s=96&amp;v=4">
</a>
</div>
</div>
<br />
</div>
</div>
</div>
</div>
<footer class="darkblue-bg">
<div class="container">
<div class="row">
<div class="col-3 d-none d-md-block">
<img src="&#x2F;images/logo-text.svg" alt="" width="150" />
</div>
</div>
<div class="row">
<div class="col-12">
<hr />
</div>
</div>
<div class="row">
<div class="col-12 col-md-6">
<a href="">
<img
src="&#x2F;images/logo-text.svg"
width="120"
class="img-center d-block d-md-none"
alt=""
/>
</a>
<br class="d-block d-md-none" />
<p class="text-center-sm">Copyright &copy; 2016-2021 Laurent Cozic</p>
</div>
<div class="col-12 col-md-6">
<p class="text-right text-center-sm right-links">
<a href="https://github.com/laurent22/joplin/" class="github-link"><i class="fab fa-github"></i> GitHub Repository</a>
<a href="/privacy/">Privacy Policy</a>
</p>
</div>
</div>
</div>
</footer>
</div>
<script
src="&#x2F;js/bootstrap5.0.2.min.js"
rel="preload"
as="script"
></script>
<script
src="&#x2F;js/jquery-3.6.0.min.js"
rel="preload"
as="script"
></script>
<script src="&#x2F;js/script.js?t=1627121689688"></script>
<script>
if (window.location.hostname !== 'localhost') {
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-103586105-1', 'auto');
ga('send', 'pageview');
}
</script> </body>
</html>