{% block replacestylesheets %}
<link rel="stylesheet" href="{{ asset('css/style.css') }}" type="text/css"/>
<link rel="stylesheet" href="{{ asset('css/features.css') }}" type="text/css"/>
{% endblock %}
{% extends 'new_navbar.html.twig' %}
{% block title %}Features - Toast{% endblock %}
{% block anchorAccount %}
<a href="#wrapper" class="anchor-title"></a>
{% endblock %}
{% block logo %}
<a href="{{ path('site_index') }}"><img src="{{ asset('img/logo.svg') }}" alt="toast"></a>
{% endblock %}
{% block bodyClass %}home features{% endblock %}
{% block body %}
<main id="main">
<div class="features-container">
<div class="features-sidebar">
<nav class="features-nav desktop-view">
<a href="#create_session" class="features-link active">Create Folder</a>
<a href="#open_session" class="features-link">Open & Preview Folder</a>
<a href="#edit_session" class="features-link">Edit Folder</a>
<a href="#share_session" class="features-link">Share Folder</a>
<a href="#collaborate_session" class="features-link">Collaborate Folder</a>
<a href="#synchronize_session" class="features-link">Synchronize Folder</a>
<a href="#add_link" class="features-link">Add Link</a>
<a href="#open_link" class="features-link">Open Link</a>
<a href="#edit_link" class="features-link">Edit Link</a>
<a href="#replace_tabs" class="features-link">Replace Tabs</a>
<a href="#add_new_tab" class="features-link">Add New Tabs</a>
<a href="#live_sync" class="features-link">Live Synchronization</a>
<a href="#web_app_features" class="features-link">Web App Features</a>
<a href="#shortcuts" class="features-link">Shortcuts</a>
</nav>
<div class="features-mob-bar">
<button class="features-mob-btn">
<span>Features List</span>
<img src="{{ asset('img/features/icons/icon-add.svg') }}" alt="">
</button>
<div class="features-mob-wrap">
<nav class="features-nav-mob">
<a href="#create_session" class="features-link">Create Folder</a>
<a href="#open_session" class="features-link">Open & Preview Folder</a>
<a href="#edit_session" class="features-link">Edit Folder</a>
<a href="#share_session" class="features-link">Share Folder</a>
<a href="#collaborate_session" class="features-link">Collaborate Folder</a>
<a href="#synchronize_session" class="features-link">Synchronize Folder</a>
<a href="#add_link" class="features-link">Add Link</a>
<a href="#open_link" class="features-link">Open Link</a>
<a href="#edit_link" class="features-link">Edit Link</a>
<a href="#replace_tabs" class="features-link">Replace Tabs</a>
<a href="#add_new_tab" class="features-link">Add New Tabs</a>
<a href="#live_sync" class="features-link">Live Synchronization</a>
<a href="#web_app_features" class="features-link">Web App Features</a>
<a href="#shortcuts" class="features-link">Shortcuts</a>
</nav>
</div>
</div>
</div>
<div class="features-wrap">
<div class="features-content">
<h3 class="features-title" id="create_session">Create Folder</h3>
<div class="features-row features-create-session">
<div class="features-col-1 features-col">
<p class="features-text">With Toast you can collect links into one group, we call it
“Folder”. Folder can be later reopened in one click, shared or collaborated with your
friends and colleagues. Links in folder can be easily added, removed, modified and open
one-by-one.
<br> <br> Toast provides you with numerous ways of folder creation, organization and
sharing. Below you can find multiple ways to create a folder of your own.</p>
</div>
<div class="features-col-2 features-col">
<p class="features-text">
Note, methods using shortcut or context menu work via on-page popup. This popup won't
appear on internal browser pages, like New Tab, browser settings etc.
<br>
Also, if the shortcuts don't work for you, try checking if they were set automatically
by going to "Extensions" → "Keyboard Shortcuts" page in browser settings. There you can
also set your own shortcuts.
</p>
</div>
</div>
<div class="features-row features-preview">
<div class="features-col-1 features-col" id="card-1">
<img src="/img/features/img1.png" alt="illustration"
srcset="/img/features/img1@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Create via extension</h4>
<p class="features-text">
Open the extension and click the "Save All Tabs" button in the top right corner. Name the
folder, delete or rename links that are about to be saved. Once ready, press "Save" button to confirm a folder creation.
</p>
</div>
<div class="features-col-2 features-col" id="card-2">
<img src="/img/features/img2.png" alt="illustration"
srcset="/img/features/img2@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Create using a shortcut</h4>
<p class="features-text">
On any website press Ctrl+Shift+S (both Mac and PC) to show the Toast popup window with
the folder creation process. Just like in the extension, you can name the folder,
rename and delete links before saving.
</p>
</div>
</div>
<div class="features-row">
<div class="features-col-1 features-col" id="card-3">
<img src="/img/features/img3.png" alt="illustration"
srcset="/img/features/img3@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Create via context menu</h4>
<p class="features-text">
On any website click the right mouse button to open the context menu. Select "Toast -
Save All Tabs... ". A popup window will open with the folder creation process. Name the
folder, rename and delete links before saving.
</p>
</div>
<div class="features-col-2 features-col" id="card-4">
<img src="/img/features/img4.png" alt="illustration"
srcset="/img/features/img4@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Create in the web app</h4>
<p class="features-text">
After logging into <a href="dotoast.com">dotoast.com</a>, press "Add new folder" button
in the bottom left corner. Folder will be added to your list automatically with a
default name. Start typing a new name and press "enter" to confirm it.
</p>
</div>
</div>
<h3 class="features-title" id="open_session">
Open & Preview Folder
</h3>
<div class="features-row">
<div class="features-col-1 features-col">
<p class="features-text">
After a folder was created in one of the methods listed above, you can reopen all links
from it in one click, preview & modify a list of links or open each link individually.
</p>
</div>
<div class="features-col-2 features-col"></div>
</div>
<div class="features-row">
<div class="features-col-1 features-col" id="card-5">
<img src="/img/features/img5.png" alt="illustration"
srcset="/img/features/img5@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Open from the home page in extension</h4>
<p class="features-text">
The easiest way to open a folder it's just open Toast extension and click on a name of
the needed folder. Browser will open a new window with all tabs from the folder.
</p>
</div>
<div class="features-col-2 features-col" id="card-6">
<img src="/img/features/img6.png" alt="illustration"
srcset="/img/features/img6@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Open from the folder details page in extension</h4>
<p class="features-text">
Move your mouse over the folder to see the "3 dots" button. Click it. The "folder
details" page with all folder links listed will be open. In top right corner click
"Open All Links" to open all links in a new browser window.
</p>
</div>
</div>
<div class="features-row">
<div class="features-col-1 features-col" id="card-7">
<img src="/img/features/img7.png" alt="illustration"
srcset="/img/features/img7@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Links list preview in extension</h4>
<p class="features-text">
Move your mouse over the folder to see the "3 dots" button. Click it. The "folder
details" page with all folder links listed will be open. In top right corner click
"Open All Links" to open all links in a new browser window.
</p>
</div>
<div class="features-col-2 features-col" id="card-8">
<img src="/img/features/img8.png" alt="illustration"
srcset="/img/features/img8@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Links preview in web app</h4>
<p class="features-text">
Open Toast web app dotoast.com, log in if you are not logged yet. Select a needed
folder from the list in the left sidebar by clicking it. All your links will be shown
to the right.
</p>
</div>
</div>
<h3 class="features-title" id="edit_session">
Edit Folder
</h3>
<div class="features-row">
<div class="features-col-1 features-col">
<p class="features-text">Saved folders can be modified, deleted, reordered and shared with
others.</p>
</div>
<div class="features-col-2 features-col"></div>
</div>
<div class="features-row">
<div class="features-col-1 features-col" id="card-9">
<img src="/img/features/img9.png" alt="illustration"
srcset="/img/features/img9@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Rename via extension</h4>
<p class="features-text">
Open the extension. Navigate to the "folder details" page by hovering your cursor over
the folder and clicking "3 dots" button. Press "Settings" in the bottom left. Then find
the "Rename" option. Enter a new name and hit "Enter" or click "↵Done" to save.
</p>
</div>
<div class="features-col-2 features-col" id="card-10">
<img src="/img/features/img10.png" alt="illustration"
srcset="/img/features/img10@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Delete via extension</h4>
<p class="features-text">
Open the extension. Navigate to the "folder details" page by hovering your cursor over
the folder and clicking "3 dots" button. Press "Settings" in the bottom left. Then find
the "Delete" option. Press it to delete the folder.
</p>
</div>
</div>
<div class="features-row">
<div class="features-col-1 features-col" id="card-11">
<img src="/img/features/img11.png" alt="illustration"
srcset="/img/features/img11@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Rename via web app</h4>
<p class="features-text">
Open Toast web app <a href="dotoast.com">dotoast.com.</a> Select the needed folder from
the left sidebar by clicking it. On the right side you'll see its content. Click the
folder name to start renaming process. Once ready press "Enter" key to confirm it.
</p>
</div>
<div class="features-col-2 features-col" id="card-12">
<img src="/img/features/img12.png" alt="illustration"
srcset="/img/features/img12@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Delete via web app</h4>
<p class="features-text">
Open Toast web app <a href="dotoast.com">dotoast.com.</a> Select the needed folder from
the left sidebar by clicking it. On the right side you'll see its content. Find a
"Delete" button in the top right corner of the screen. Press it to delete the folder.
</p>
</div>
</div>
<div class="features-row">
<div class="features-col-1 features-col" id="card-13">
<img src="/img/features/img13.png" alt="illustration"
srcset="/img/features/img13@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Reorder links and folders via web app</h4>
<p class="features-text">
Open Toast web app <a href="dotoast.com">dotoast.com.</a> To reorder folders hover your
mouse cursor over any folder. On the right side of it a "3 lines" button would appear.
Use it to grab and move the folder. Follow the same process to reorder the links by
hovering over any of them.
</p>
</div>
<div class="features-col-2 features-col"></div>
</div>
<h3 class="features-title" id="share_session">
Share Folder
</h3>
<div class="features-row">
<div class="features-col-1 features-col">
<p class="features-text">
Quickly share a folder (list of links essentially) with anyone in just a few clicks.
Send them a preview link or send a copy of your folder to their Toast.
<br>
<br>
Sharable web link can be accessed by anyone without special permissions or Toast
installed. Sharing via email requires recipient to have Toast account.
</p>
</div>
<div class="features-col-2 features-col">
<p class="features-text">
Note, methods using shortcut or context menu work via on-page popup. This popup won't
appear on internal browser pages, like New Tab, browser settings etc. Also, if the
shortcuts don't work for you, try checking if they were set automatically by going to
"Extensions" → "Keyboard Shortcuts" page in browser settings. There you can also set
your own shortcuts.
</p>
</div>
</div>
<div class="features-row">
<div class="features-col-1 features-col" id="card-15">
<img src="/img/features/img15.png" alt="illustration"
srcset="/img/features/img15@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Share link in a settings page</h4>
<p class="features-text">
Open the extension. Navigate to the "folder details" page by hovering over the folder
and clicking "3 dots" button. Press "Settings" in the bottom left. Find the "Share Link"
option. Click it to copy the folder sharable link.
</p>
</div>
<div class="features-col-2 features-col" id="card-16">
<img src="/img/features/img16.png" alt="illustration"
srcset="/img/features/img16@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Share via link using a shortcut</h4>
<p class="features-text">
On any website press Ctrl+Shift+E (both Mac and PC) to show the Toast popup window with
the folder creation & sharing process. After a folder creation a sharable web link
will be copied to your clipboard.
</p>
</div>
</div>
<div class="features-row">
<div class="features-col-1 features-col" id="card-19">
<img src="/img/features/img18.png" alt="illustration"
srcset="/img/features/img18@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Share link via web app</h4>
<p class="features-text">
Open Toast web app <a href="dotoast.com">dotoast.com.</a> Select the needed folder from
the left sidebar by clicking it. Find a "Share" button in the top right corner of the
screen. Click it to see 2 sharing options. Pick "Share Link".
</p>
</div>
<div class="features-col-2 features-col" id="card-18">
<img src="/img/features/img19.png" alt="illustration"
srcset="/img/features/img19@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Share via email in settings page</h4>
<p class="features-text">
Open the extension. Navigate to the "folder details" page by hovering over the folder
and clicking "3 dots" button. Press "Settings" in the bottom left. Find the "Email
folder" option. Enter the recipient's email and hit "Enter" or click "↵Done" send.
</p>
</div>
</div>
<div class="features-row">
<div class="features-col-1 features-col" id="card-20">
<img src="/img/features/img20.png" alt="illustration"
srcset="/img/features/img20@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Share via email via web app</h4>
<p class="features-text">
Open Toast web app <a href="dotoast.com">dotoast.com.</a> Select the needed folder from
the left sidebar by clicking it. Find a "Share" button in the top right corner of the
screen. Click it to see 2 sharing options. Pick "Email Folder". Enter the recipient's
email to send it.
</p>
</div>
<div class="features-col-2 features-col"></div>
</div>
<h3 class="features-title" id="collaborate_session">
Collaborate Folder
</h3>
<div class="features-row">
<div class="features-col-1 features-col">
<p class="features-text">
Select the needed folder from the left sidebar by clicking it. Find a "Share" button in
the top right corner of the screen. Click it to see 2 sharing options. Pick "Email
Folder". Enter the recipient's email to send it.
</p>
</div>
<div class="features-col-2 features-col">
<p class="features-text">
Note, in the extension main page collaborated folders are marked with an icon next to
the tabs count. You can also filter such folders by clicking the collaboration icon in
the top of the extension main page.
</p>
</div>
</div>
<div class="features-row">
<div class="features-col-1 features-col" id="card-21">
<img src="/img/features/img21.png" alt="illustration"
srcset="/img/features/img21@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Activate collaboration via extension</h4>
<p class="features-text">
Open the extension. Navigate to the "folder details" using the "3 dots" button of a
folder. Press "Settings" in the bottom left. Find the "Collaborate Folder" option.
Click the toggle next to it to activate/deactivate collaboration. Once activated,
proceed to the "Members" page to edit your collaborators.
</p>
</div>
<div class="features-col-2 features-col" id="card-22">
<img src="/img/features/img22new.png" alt="illustration"
srcset="/img/features/img22new@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Invite and remove users via extension</h4>
<p class="features-text">
Open the extension. Navigate to the "folder details" using the "3 dots" button of a
folder. Press "Settings" in the bottom left. Find the "Members" option. Click it to
open "Members" page, where you can manage collaborators.
</p>
</div>
</div>
<div class="features-row">
<div class="features-col-1 features-col" id="card-23">
<img src="/img/features/img23.png" alt="illustration"
srcset="/img/features/img23@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Deactivate collaboration via extension</h4>
<p class="features-text">
Open the extension. Navigate to the "folder details" using the "3 dots" button of a
folder. Press "Settings" in the bottom left. Find the "Members" option. Click it to
open "Members" page, where you can manage collaborators.
</p>
</div>
<div class="features-col-2 features-col" id="card-24">
<img src="/img/features/img24.png" alt="illustration"
srcset="/img/features/img24@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Activate collaboration via web app</h4>
<p class="features-text">
Open Toast web app <a href="dotoast.com">dotoast.com.</a> Select the needed folder from
the left sidebar by clicking it. Find a "Collaborate" button in the top right corner of
the screen. In its dropdown click the toggle to turn collaboration on/off.
</p>
</div>
</div>
<div class="features-row">
<div class="features-col-1 features-col" id="card-25">
<img src="/img/features/img25.png" alt="illustration"
srcset="/img/features/img25@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Invite and remove users via web app</h4>
<p class="features-text">
Open Toast web app <a href="dotoast.com">dotoast.com.</a> Select the needed folder from
the left sidebar by clicking it. Find a "Collaborate" button in the top right corner of
the screen. In its dropdown click "invite new member" to add a person by email or Click
delete icon next to the invited user to reject access.
</p>
</div>
<div class="features-col-2 features-col" id="card-26">
<img src="/img/features/img26.png" alt="illustration"
srcset="/img/features/img26@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Deactivate collaboration via web app</h4>
<p class="features-text">
Open Toast web app <a href="dotoast.com">dotoast.com.</a> Select the needed folder from
the left sidebar by clicking it. Find a "Collaborate" button in the top right corner of
the screen. In its dropdown click the toggle to turn collaboration on/off. Once
deactivated, all collaborators will lose access to it.
</p>
</div>
</div>
<h3 class="features-title" id="synchronize_session">
Synchronize Folder
</h3>
<div class="features-row">
<div class="features-col-1 features-col">
<p class="features-text">
Toast removes barriers between browsers and devices and lets you access your links
everywhere. All your folders are safely stored in the cloud and are accessible from all
extensions and a web app on any device with a browser. Toast has native extensions for
almost every browser in the world.
</p>
</div>
<div class="features-col-2 features-col">
<p class="features-text">
Note, even on the free plan all your folders are always available from Toast web app <a
href="dotoast.com">dotoast.com.</a>
</p>
</div>
</div>
<div class="features-row">
<div class="features-col-1 features-col" id="card-27">
<img src="/img/features/img27.png" alt="illustration"
srcset="/img/features/img27@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Synchronize in extensions and web app</h4>
<p class="features-text">
Open your extension to see your folders from all browsers synced as one list (PRO).
Start working on a Safari on an office computer and continue working at home on Chrome
from Windows.
</p>
</div>
<div class="features-col-2 features-col"></div>
</div>
<h3 class="features-title" id="add_link">
Add Link
</h3>
<div class="features-row">
<div class="features-col-1 features-col">
<p class="features-text">
Have just a single link to save. No problem, one-by-one or all together, Toast can store
them all.
<br><br>
Note, methods using shortcut or context menu work via on-page popup. This popup won't
appear on internal browser pages, like New Tab, browser settings etc.
</p>
</div>
<div class="features-col-2 features-col">
<p class="features-text">
Also, if the shortcuts don't work for you, try checking if they were set automatically
by going to "Extensions" → "Keyboard Shortcuts" page in browser settings. There you can
also set your own shortcuts.
<br><br>
Toast extension automatically fills the "Add Link" field with the open website's link,
so that you don't even have to copy the link yourself if you want to add a current page.
</p>
</div>
</div>
<div class="features-row">
<div class="features-col-1 features-col" id="card-70">
<img src="/img/features/img70.png" alt="illustration"
srcset="/img/features/img70@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Add current page to folder, home page</h4>
<p class="features-text">
The easiest way to add a current page to a folder is to just open Toast extension and click plus button in the corresponding folder row.
</p>
</div>
<div class="features-col-2 features-col" id="card-28">
<img src="/img/features/img28.png" alt="illustration"
srcset="/img/features/img28@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Add link to folder via extension, details page</h4>
<p class="features-text">
Open the extension. Navigate to the "folder details" using the "3 dots" button of a
folder. Inside the "folder details" page find the "Add Link" button at the bottom.
Click it, paste your link and hit "Enter" key or click "↵Done" to add it.
</p>
</div>
</div>
<div class="features-row">
<div class="features-col-1 features-col" id="card-29">
<img src="/img/features/img29.png" alt="illustration"
srcset="/img/features/img29@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Add current page to folder using a shortcut</h4>
<p class="features-text">
On any website press Ctrl+Shift+U (both Mac and PC) to show the Toast popup window with
the link adding process. Name the link before saving or keep its own title. Select the
folder you'd like the link to be added to.
</p>
</div>
<div class="features-col-2 features-col" id="card-30">
<img src="/img/features/img30.png" alt="illustration"
srcset="/img/features/img30@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Add current page via context menu</h4>
<p class="features-text">
On any website click the right mouse button to open the context menu. Select "Toast -
Add Current Tab to Folder...". A popup window will open with the link adding process.
Name the link before saving or keep its own title. Select the folder you'd like the
link to be added to.
</p>
</div>
</div>
<div class="features-row">
<div class="features-col-1 features-col" id="card-31">
<img src="/img/features/img31new.png" alt="illustration"
srcset="/img/features/img31new@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Add link to folder via web app</h4>
<p class="features-text">
Open Toast web app <a href="dotoast.com">dotoast.com.</a> Select the needed folder from
the left sidebar by clicking it. Find a "Add Link" button at the end of the links list
on the right. Click it, paste your link and hit "Enter" key or click "↵Done" to add it.
</p>
</div>
</div>
<h3 class="features-title" id="open_link">Open Link</h3>
<div class="features-row">
<div class="features-col-1 features-col">
<p class="features-text">
Toast can open an entire folder of links in one click, but that's not always what you
want. Sometimes you might need to open only one or couple links from a folder. And it's
as easy as it should be.
</p>
</div>
<div class="features-col-2 features-col"></div>
</div>
<div class="features-row">
<div class="features-col-1 features-col" id="card-32">
<img src="/img/features/img32.png" alt="illustration"
srcset="/img/features/img32@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Open link via extension </h4>
<p class="features-text">
Open the extension. Navigate to the "folder details" using the "3 dots" button of a
folder. Inside the "folder details" you'll see a list of all folder links. Click one
or multiple to open a link in a new tab.
</p>
</div>
<div class="features-col-2 features-col" id="card-33">
<img src="/img/features/img33new.png" alt="illustration"
srcset="/img/features/img33new@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Open link via web app</h4>
<p class="features-text">
Open Toast web app <a href="dotoast.com">dotoast.com.</a> Select the needed folder from
the left sidebar by clicking it. To the right you'll see a list of all folder links.
Click one or multiple to open a link in a new tab.
</p>
</div>
</div>
<h3 class="features-title" id="edit_link">
Edit Link
</h3>
<div class="features-row">
<div class="features-col-1 features-col">
<p class="features-text">
Your links, your rules. Name, rename, reorder or delete any of your saved links. It
isn't always clear what the link is about by the title set by its developers. Not a
problem with Toast. You can name it what you want.
</p>
</div>
<div class="features-col-2 features-col"></div>
</div>
<div class="features-row">
<div class="features-col-1 features-col" id="card-34">
<img src="/img/features/img34.png" alt="illustration"
srcset="/img/features/img34@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Rename link via extension</h4>
<p class="features-text">
Open the extension. Navigate to the "folder details" using the "3 dots" button of a
folder. Find a link you want to rename and show its control buttons by hovering
over it. One of those buttons is "Rename". Click it to start renaming.
</p>
</div>
<div class="features-col-2 features-col" id="card-35">
<img src="/img/features/img35.png" alt="illustration"
srcset="/img/features/img35@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Delete link via extension</h4>
<p class="features-text">
Open the extension. Navigate to the "folder details" using the "3 dots" button of a
folder. Find a link you want to delete and show its control buttons by hovering
over it. One of those buttons is "Delete". Click it to delete the link.
</p>
</div>
</div>
<div class="features-row">
<div class="features-col-1 features-col" id="card-36">
<img src="/img/features/img36.png" alt="illustration"
srcset="/img/features/img36@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Rename link via web app</h4>
<p class="features-text">
Open Toast web app <a href="dotoast.com">dotoast.com.</a> Select the needed folder
from the left sidebar by clicking it. To the right you'll see a list of all folder
links. Hover over any of them to show control buttons. One of those is "Rename".
Click it to start renaming.
</p>
</div>
<div class="features-col-2 features-col" id="card-37">
<img src="/img/features/img37.png" alt="illustration"
srcset="/img/features/img37@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Delete link via web app</h4>
<p class="features-text">
Open Toast web app <a href="dotoast.com">dotoast.com.</a> Select the needed folder
from the left sidebar by clicking it. To the right you'll see a list of all folder
links. Hover over any of them to show control buttons. One of those is "Delete".
Click it to delete the link.
</p>
</div>
</div>
<h3 class="features-title" id="replace_tabs">
Replace Tabs
</h3>
<div class="features-row">
<div class="features-col-1 features-col">
<p class="features-text">
If you use your folders for switching between the projects or work and home tabs you
might want to quickly replace the last saved tabs with currently open ones. It's just a
couple clicks task with Toast.
</p>
</div>
<div class="features-col-2 features-col"></div>
</div>
<div class="features-row">
<div class="features-col-1 features-col" id="card-38">
<img src="/img/features/img38.png" alt="illustration"
srcset="/img/features/img38@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Replace tabs via extension</h4>
<p class="features-text">
Open Toast web app <a href="dotoast.com">dotoast.com.</a> Select the needed folder
from the left sidebar by clicking it. To the right you'll see a list of all folder
links. Hover over any of them to show control buttons. One of those is "Delete".
Click it to delete the link.
</p>
</div>
<div class="features-col-2 features-col"></div>
</div>
<h3 class="features-title" id="add_new_tab">
Add New Tabs
</h3>
<div class="features-row">
<div class="features-col-1 features-col">
<p class="features-text">
Found a bunch of interesting or useful websites that belong to one of your folders?
There's no need to add them one by one. In just a few clicks you can let Toast add all
of the new tabs to your folder.
</p>
</div>
<div class="features-col-2 features-col">
<p class="features-text">
Note, Toast automatically fills the "Add Link" field with the open website's link, so
that you don't even have to copy the link yourself if you want to add a current page.
</p>
</div>
</div>
<div class="features-row">
<div class="features-col-1 features-col" id="card-40">
<img src="/img/features/img39.png" alt="illustration"
srcset="/img/features/img39@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Add new tabs by one click</h4>
<p class="features-text">
Open the extension. Navigate to the "folder details" using the "3 dots" button of a
folder. Click the "Add New Tabs" button at the bottom right to add all of the new tabs
from your open browser window to the folder.
</p>
</div>
<div class="features-col-2 features-col" id="repl-28">
<img src="/img/features/img40new.png" alt="illustration"
srcset="/img/features/img40new@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Add new tabs manually</h4>
<p class="features-text">
Open the extension. Navigate to the "folder details" using the "3 dots" button of a
folder. Inside the "folder details" page find the "Add Link" button at the bottom.
Click it, paste your link and hit "Enter" key or click "↵Done" to add it.
</p>
</div>
</div>
<h3 class="features-title" id="live_sync">
Live Synchronization
</h3>
<div class="features-row">
<div class="features-col-1 features-col">
<p class="features-text">
Do you know how you can see from your mobile Chrome which tabs are open on your desktop
Chrome? Toast brings that to every browser and across all of them.
</p>
</div>
<div class="features-col-2 features-col">
<p class="features-text">
From your mobile, from your Chrome, Safari, Opera or Edge... See what's open on any of
your browsers. This lets you easily continue where you left off on your other device.
Even when you're on the go.
</p>
</div>
</div>
<div class="features-row">
<div class="features-col-1 features-col" id="card-40">
<img src="/img/features/img41.png" alt="illustration"
srcset="/img/features/img41@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Activate device</h4>
<p class="features-text">
Open the extension. Click the cloud icon in the top to open the Live Synchronization
setup page. Give a name to this browser to easily recognize it later, hit "Enter" key or
click "↵Done" to confirm. That's it, from now on all your open tabs will automatically
be synchronized to Toast.
</p>
</div>
<div class="features-col-2 features-col" id="card-41">
<img src="/img/features/img42.png" alt="illustration"
srcset="/img/features/img42@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Rename device</h4>
<p class="features-text">
Open the extension. Click the cloud icon in the top to open the Live Synchronization
page. Hover over the current browser (first in the list) to see the "Settings" button.
Click it to access this browser's Live Sync settings. Inside, press the browser name to
change it.
</p>
</div>
</div>
<div class="features-row">
<div class="features-col-1 features-col" id="card-42">
<img src="/img/features/img43.png" alt="illustration"
srcset="/img/features/img43@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Deactivate device</h4>
<p class="features-text">
Open the extension. Click the cloud icon in the top to open the Live Synchronization
page. Hover over the current browser (first in the list) to see the "Settings" button.
Click it to access this browser's Live Sync settings. Inside you'll see a toggle to turn
ON/OFF the synchronization.
</p>
</div>
<div class="features-col-2 features-col" id="card-43">
<img src="/img/features/img44.png" alt="illustration"
srcset="/img/features/img44@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Open device folder via extension</h4>
<p class="features-text">
Open the extension. Click the cloud icon in the top to open the Live Synchronization
page. Navigate to the "folder details" page using the "3 dots" button to the right of
the needed browser. Open all links at once by clicking the "Open Folder" button in the
top right.
</p>
</div>
</div>
<div class="features-row">
<div class="features-col-1 features-col" id="card-44">
<img src="/img/features/img45.png" alt="illustration"
srcset="/img/features/img45@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Open device folder via web app</h4>
<p class="features-text">
Open Toast web app <a href="dotoast.com">dotoast.com.</a> Find a "Live Synchronization"
item in the left sidebar. Click it to expand/collapse the list of the browsers you have
live synchronization set up for and turned on. Click any of the browsers in the list to
see its tabs on the right side.
</p>
</div>
<div class="features-col-2 features-col"></div>
</div>
<h3 class="features-title" id="web_app_features">
Web App Features
</h3>
<div class="features-row">
<div class="features-col-1 features-col">
<p class="features-text">
Toast web app allows you to access all of your saved folder from anywhere you are as
well as every device with a browser. You can literally see your saved links on a smart
TV that has a browser. All you need to do is to navigate to
<a href="dotoast.com">dotoast.com</a> and log into your account.
</p>
</div>
<div class="features-col-2 features-col">
<p class="features-text">
In addition to the extension capabilities you can search for a folder or link, move
links between folders, reorder folders and links as you desire.
</p>
</div>
</div>
<div class="features-row">
<div class="features-col-1 features-col" id="app--4" >
<img src="/img/features/img46.png" alt="illustration"
srcset="/img/features/img46@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Create folder</h4>
<p class="features-text">
Press "Add new folder" button in the bottom left corner. Folder will be added to your
list automatically with a default name. Start typing a new name and press "enter" to
confirm it.
</p>
</div>
<div class="features-col-2 features-col" id="app--8" >
<img src="/img/features/img47.png" alt="illustration"
srcset="/img/features/img47@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Links preview</h4>
<p class="features-text">
Select a needed folder from the list in the left sidebar by clicking it. All your links
will be shown to the right.
</p>
</div>
</div>
<div class="features-row">
<div class="features-col-1 features-col" id="app--11" >
<img src="/img/features/img48.png" alt="illustration"
srcset="/img/features/img48@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Rename folder</h4>
<p class="features-text">
Select the needed folder from the left sidebar by clicking it. On the right side you'll
see its content. Click the folder name to start renaming process. Once ready press
"Enter" key to confirm it.
</p>
</div>
<div class="features-col-2 features-col" id="app--12" >
<img src="/img/features/img49.png" alt="illustration"
srcset="/img/features/img49@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Delete folder</h4>
<p class="features-text">
Select the needed folder from the left sidebar by clicking it. On the right side you'll
see its content. Find a "Delete" button in the top right corner of the screen. Press it
to delete the folder.
</p>
</div>
</div>
<div class="features-row">
<div class="features-col-1 features-col" id="card-45">
<img src="/img/features/img50.png" alt="illustration"
srcset="/img/features/img50@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Reorder links and folders</h4>
<p class="features-text">
To reorder folders hover your mouse cursor over any folder. On the right side of it a
"3 lines" button would appear. Use it to grab and move the folder. Follow the same
process to reorder the links by hovering over any of them.
</p>
</div>
<div class="features-col-2 features-col" id="app--19" >
<img src="/img/features/img51.png" alt="illustration"
srcset="/img/features/img51@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Folder share link</h4>
<p class="features-text">
Select the needed folder from the left sidebar by clicking it. Find a "Share" button in
the top right corner of the screen. Click it to see 2 sharing options. Pick "Share
Link".
</p>
</div>
</div>
<div class="features-row">
<div class="features-col-1 features-col" id="app--20" >
<img src="/img/features/img52.png" alt="illustration"
srcset="/img/features/img52@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Share folder via email</h4>
<p class="features-text">
Select the needed folder from the left sidebar by clicking it. Find a "Share" button in
the top right corner of the screen. Click it to see 2 sharing options. Pick "Email
Folder". Enter the recipient's email to send it.
</p>
</div>
<div class="features-col-2 features-col" id="app--24" >
<img src="/img/features/img53.png" alt="illustration"
srcset="/img/features/img53@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Activate folder collaboration </h4>
<p class="features-text">
Select the needed folder from the left sidebar by clicking it. Find a "Collaborate"
button in the top right corner of the screen. In its dropdown click the toggle to turn
collaboration on/off.
</p>
</div>
</div>
<div class="features-row">
<div class="features-col-1 features-col" id="app--25">
<img src="/img/features/img54.png" alt="illustration"
srcset="/img/features/img54@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Invite and remove users for collaboration</h4>
<p class="features-text">
Select the needed folder from the left sidebar by clicking it. Find a "Collaborate"
button in the top right corner of the screen. In its dropdown click "invite new member"
to add a person by email or Click delete icon next to the invited user to reject access.
</p>
</div>
<div class="features-col-2 features-col" id="app--26">
<img src="/img/features/img55.png" alt="illustration"
srcset="/img/features/img55@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Deactivate folder collaboration</h4>
<p class="features-text">
Select the needed folder from the left sidebar by clicking it. Find a "Collaborate"
button in the top right corner of the screen. In its dropdown click the toggle to turn
collaboration on/off. Once deactivated, all collaborators will lose access to it.
</p>
</div>
</div>
<div class="features-row">
<div class="features-col-1 features-col" id="app--31">
<img src="/img/features/img56.png" alt="illustration"
srcset="/img/features/img56@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Add link to folder</h4>
<p class="features-text">
Select the needed folder from the left sidebar by clicking it. Find a "Add Link" button
at the end of the links list on the right. Click it, paste your link and hit "Enter" key
or click "↵Done" to add it.
</p>
</div>
<div class="features-col-2 features-col" id="app--33">
<img src="/img/features/img57.png" alt="illustration"
srcset="/img/features/img57@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Open link from folder</h4>
<p class="features-text">
Select the needed folder from the left sidebar by clicking it. To the right you'll see
a list of all folder links. Click one or multiple to open a link in a new tab.
</p>
</div>
</div>
<div class="features-row">
<div class="features-col-1 features-col" id="app--36">
<img src="/img/features/img58.png" alt="illustration"
srcset="/img/features/img58@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Rename link in folder</h4>
<p class="features-text">
Select the needed folder from the left sidebar by clicking it. To the right you'll see
a list of all folder links. Hover over any of them to show control buttons. One of
those is "Rename". Click it to start renaming.
</p>
</div>
<div class="features-col-2 features-col" id="app--37">
<img src="/img/features/img59.png" alt="illustration"
srcset="/img/features/img59@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Delete link from folder</h4>
<p class="features-text">
Select the needed folder from the left sidebar by clicking it. To the right you'll see
a list of all folder links. Hover over any of them to show control buttons. One of
those is "Delete". Click it to delete the link.
</p>
</div>
</div>
<div class="features-row">
<div class="features-col-1 features-col" id="app--44">
<img src="/img/features/img60.png" alt="illustration"
srcset="/img/features/img60@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Open device folder for live synchronization</h4>
<p class="features-text">
Find a "Live Synchronization" item in the left sidebar. Click it to expand/collapse the
list of the browsers you have live synchronization set up for and turned on. Click any
of the browsers in the list to see its tabs on the right side.
</p>
</div>
<div class="features-col-2 features-col" id="card-46">
<img src="/img/features/img61.png" alt="illustration"
srcset="/img/features/img61@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Search via web app</h4>
<p class="features-text">
At the top you'll see a search field. Use it to search for a folder or a link using
their names or URL (for a link). Once found you can open this folder content or open a
link in a new tab.
</p>
</div>
</div>
<h3 class="features-title" id="shortcuts">
Shortcuts
</h3>
<div class="features-row">
<div class="features-col-1 features-col">
<p class="features-text">
Toast is where you want it and how you want it. Like using a small native browser
extension? Prefer having a full web app as your new tab page? Want to stay within your
context and use context menus? It's there plus the keyboard shortcuts for true
power-users.
</p>
</div>
<div class="features-col-2 features-col">
<p class="features-text">
Note, shortcuts won't work on internal browser pages, like New Tab, browser settings
etc. If the shortcuts don't work at all for you, try checking if they were set
automatically by going to "Extensions" → "Keyboard Shortcuts" page in browser settings.
There you can also set your own shortcuts.
</p>
</div>
</div>
<div class="features-row">
<div class="features-col-1 features-col" id="app--2">
<img src="/img/features/img62.png" alt="illustration"
srcset="/img/features/img62@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Create folder</h4>
<p class="features-text">
On any website press Ctrl+Shift+S (both Mac and PC) to show the Toast popup window with
the folder creation process. Just like in the extension, you can name the folder,
rename and delete links before saving.
</p>
</div>
<div class="features-col-2 features-col" id="app--16">
<img src="/img/features/img63.png" alt="illustration"
srcset="/img/features/img63@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Create folder share link</h4>
<p class="features-text">
On any website press Ctrl+Shift+E (both Mac and PC) to show the Toast popup window with
the folder creation & sharing process. After a folder creation a sharable web link
will be copied to your clipboard.
</p>
</div>
</div>
<div class="features-row">
<div class="features-col-1 features-col" id="app--29">
<img src="/img/features/img64.png" alt="illustration"
srcset="/img/features/img64@2x.png 2x"
class="features-img"/>
<h4 class="features-sub-title">Add current page to folder</h4>
<p class="features-text">
On any website press Ctrl+Shift+U (both Mac and PC) to show the Toast popup window with
the link adding process. Name the link before saving or keep its own title. Select the
folder you'd like the link to be added to.
</p>
</div>
<div class="features-col-2 features-col"></div>
</div>
</div>
</div>
</div>
<div class="video-popup">
<div class="video-popup-container">
<button class="video-close"><img src="{{ asset('img/Close.svg') }}" alt=""></button>
<video id="video" src="" width="100%" height="auto" controls autoplay muted></video>
</div>
</div>
</main>
{% endblock %}
{% block javascripts %}
<script src="{{ asset('js/jquery.main.js') }}"></script>
<script src="{{ asset('js/features.js') }}"></script>
{% endblock %}