harukin/core
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added Tutorials section with a Personal Channel tutorial

Browse Source
This commit is contained in:
Andrew Manning 2016-11-27 12:52:35 -07:00
parent 713a34c68e
commit 99a4bb63c7
3 changed files with 198 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
doc/member/member_guide.html
View File

@ -15,4 +15,4 @@ new ideas are related to the <strong>decentralized</strong> nature of the grid;
with the advanced <strong>permissions system</strong> that is necessary to protect your data privacy.
The purpose of this guide is to help you understand how to create, configure, and
use your nomadic identity.
</p>
</p>

16
doc/toc.html
View File

@ -77,6 +77,19 @@
</ul>
</div>
</div>
<div class="panel">
<div class="panel-heading">
<h4 class="panel-title">
<a data-toggle="collapse" data-parent="#accordion" href="#tutorials"><span class="glyphicon glyphicon-folder-open">
</span>Tutorials</a>
</h4>
</div>
<div id="tutorials" class="panel-collapse collapse">
<ul class="list-group">
<li class="doco-list-group-item"><a href="/help/tutorials/personal_channel">Personal Channel</a></li>
</ul>
</div>
</div>
</div>
<script>
@ -85,6 +98,9 @@
var url = document.createElement('a');
url.href = window.location;
switch (url.pathname.split('/')[2]) {
case 'tutorials':
$('#tutorials').addClass('in');
break;
case 'about':
$('#about').addClass('in');
break;

181
doc/tutorials/personal_channel.html Normal file
View File

@ -0,0 +1,181 @@
<p><strong>Table of Contents</strong></p>
<ul id="tutorial-toc">
<li><a href="/help/tutorials/personal_channel#personal-channel">Personal Channel</a>
<ul>
<li><a href="/help/tutorials/personal_channel#Create_a_new_channel">Create a new channel</a></li>
<li><a href="/help/tutorials/personal_channel#Configure_your_channel_features">Configure your channel features</a></li>
<li><a href="/help/tutorials/personal_channel#Add_a_profile_photo">Add a profile photo</a></li>
<li><a href="/help/tutorials/personal_channel#Compose_a_post">Compose a post</a></li>
<li><a href="/help/tutorials/personal_channel#Use_an_uploaded_image_as_a_channel_cover_photo">Use an uploaded image as a channel cover photo</a></li>
<li><a href="/help/tutorials/personal_channel#Make_a_connection">Make a connection</a></li>
</ul>
</li>
</ul>
<hr>
<h1 id="personal-channel">Personal Channel</h1>
<p>This tutorial is intended to be followed in sequence as if you were setting up a
channel for the first time. It introduces some of the tools and features related
to a personal channel in a natural way.</p>
<h1 id="Create_a_new_channel">Create a new channel</h1>
<p>When you log in for the first time after registering, you must create a channel.
(Alternatively you can load https://grid.reticu.li/new_channel)</p>
<p><img class="img-responsive" src="https://grid.reticu.li/photo/c9a880cc82ffa1f7c2f460397bb083bf7dc2a2b8f065e64da598b45b4a2b2dca-1.png" alt="image"></p>
<p>Enter your name and a nickname for the channel address, and select a "role".
Typically if this is a personal channel that represents you, select a <strong>Social</strong> role
with a level of default privacy that you are comfortable with. If you are unsure,
select <strong>Social - Restricted</strong>.</p>
<h1 id="Configure_your_channel_features">Configure your channel features</h1>
<p>When your new channel is created you are directed to the channel settings page.
Take the time to look around at all the settings pages to familiarize yourself with
your options, even if you don't understand everything you see right now.</p>
<p>Navigate to the <strong>Additional Features</strong> settings and follow the screenshots below to
enable various features. Remember to press the Submit button when you are done with
your selections.</p>
<p><img class="img-responsive" src="https://grid.reticu.li/photo/3656a67dce40a1fc2515e9089217f2e136d4fcf8babe77bac00ecaad43ceca5a-1.png" alt="image"><img class="img-responsive" src="https://grid.reticu.li/photo/4aaaf1e124514c8d6999a5fe1d07be5af460cda4ba6cde9106ebc1564bb063cd-1.png" alt="image"><img class="img-responsive" src="https://grid.reticu.li/photo/99a6efda4df631dfb2d2a849412044cc6a0f8aebeac289d28786f2649d2413cc-1.png" alt="image"><img class="img-responsive" src="https://grid.reticu.li/photo/e5d5674a34e848e2cce90a60fc416415271d9c51b81ad2a950fb0157222a038c-1.png" alt="image"></p>
<h1 id="Add_a_profile_photo">Add a profile photo</h1>
<p>Navigate to your channel home by clicking the "Home" icon on the left side of the
navbar, and then select the <strong>About</strong> tab to view your profile.</p>
<p>Press the <strong>Edit</strong> button on the right to edit your profile information.</p>
<p><img class="img-responsive" src="https://grid.reticu.li/photo/2243e48ccea25bd907cce3dbd6fc9f7cd832a4c91a4c5dd294b7b219e7d8648e-1.png" alt="image"></p>
<p>From the <strong>Profile Tools</strong> dropdown menu, select the <strong>Change profile photo</strong></p>
<p><img class="img-responsive" src="https://grid.reticu.li/photo/31f42a02bdbae095e0329db6c3814e2975979aff12f873f43d81724c5e61190a-1.png" alt="image"></p>
<p>Upload your photo and size as necessary using the image editor.</p>
<p><img class="img-responsive" src="https://grid.reticu.li/photo/458a842c2ea0fbe3b7869bb14dfffe1e5be098d1cd6e590bbead25b4cc050b9d-1.png" alt="image"></p>
<p>When you press <strong>Submit</strong> you will be redirected back to the profile editor.
(You might need to clear your browser cache if you have trouble seeing the new photo.)</p>
<p><img class="img-responsive" src="https://grid.reticu.li/photo/d080e92d797af5e863fa39b2084c16a8410de1f7a6559633435817444aef00b4-1.png" alt="image"></p>
<p>Returning to your channel home page you will see that a post notifying others of your new
profile pic has been automatically posted.</p>
<p><img class="img-responsive" src="https://grid.reticu.li/photo/1ebe02c205962dd25035c441631745d16acdb7a44e50d148256c8ad26a674921-1.png" alt="image"></p>
<h1 id="Compose_a_post">Compose a post</h1>
<p>Go to your channel home and open the post editor by pressing the <strong>Share</strong> textbox
at the top of the channel "wall". Enter a message, and then drag-and-drop an image
file into the post editor text area (alternatively you can use the <strong>Attach file</strong>
tool at the bottom).</p>
<p><img class="img-responsive" src="https://grid.reticu.li/photo/b0bfdf02aef3710a37bb6092c3240b291eca8afa73133b3ac03b86f3302dcf56-1.png" alt="image"></p>
<p>Your image file will be automatically uploaded and stored in your cloud files, and
a link will appear in the post window. Pressing the post preview button will allow you to preview your post before publishing it.</p>
<p><img class="img-responsive" src="https://grid.reticu.li/photo/7c976a06662a1357b3da8ed0680d1a721c85f2ae2bdd5739a8def466010e9549-1.png" alt="image"></p>
<p>Pressing the lock button near the Submit button will open the <strong>Access Control List</strong>
so you can specify exactly who can access this post.</p>
<p><img class="img-responsive" src="https://grid.reticu.li/photo/2b539d5a8474d6ec6dc91155b628d9be5f99ab04a78108ec404f53ec7bb5b5ea-1.png" alt="image"></p>
<h1 id="Use_an_uploaded_image_as_a_channel_cover_photo">Use an uploaded image as a channel cover photo</h1>
<p>One way to add some pizzazz your channel is to add a cover photo that visitors will
see when they load your channel page. Hubzilla's integrated cloud file system
allows you to choose an existing photo for this purpose.</p>
<p>Visit your photos in the <strong>Photos</strong> app</p>
<p><img class="img-responsive" src="https://grid.reticu.li/photo/0965ace945f0c95ae38aa5bfedd230d2a7233d3915ac15d629f9dd845854a485-1.png" alt="image"></p>
<p>Select the photo you wish to use and select <strong>Use as cover photo</strong> from the <strong>Photo Tools</strong>
dropdown menu.</p>
<p><img class="img-responsive" src="https://grid.reticu.li/photo/9eae9fad774a4cd29e665961d35affbd053368056f562c58200fb41027b092eb-1.png" alt="image"></p>
<p>Crop the image using the photo editor and save your changes.</p>
<p><img class="img-responsive" src="https://grid.reticu.li/photo/b3eece28e8db67f1024af42055f0f24ed5e81ba622aca8cac576ccf5930ee9f0-1.png" alt="image"></p>
<p>When you load your channel home page, you will first see the cover photo, and your
channel page will fade in as you scroll down.</p>
<p><img class="img-responsive" src="https://grid.reticu.li/photo/4cf326152797a8ecdf5630e921756f825ee00f8ee464d3ef9fed971d2852936e-1.png" alt="image"></p>
<h1 id="Make_a_connection">Make a connection</h1>
<p>Making connections between channels to share things is what Hubzilla is all about.
Making a connection is simple. If you do not already know how to reach a channel's home
page, you might try a directory search by opening the <strong>Directory</strong> link on the right
side of the top navbar.</p>
<p><img class="img-responsive" src="https://grid.reticu.li/photo/ef78bc6aa3fafebd46f353514c907b3fdfe019918fc5553bb3f31388a36faabf-1.png" alt="image"></p>
<p>You can connect directly from the directory entry using the <strong>Connect</strong> button there,
or you can open the channel page first and press the <strong>Connect</strong> button below the
profile photo.</p>
<p><img class="img-responsive" src="https://grid.reticu.li/photo/75d2927b7ad0d2043d4d3b6ba1364fac8ead173edd39340adaf78be11c9d0c7a-1.png" alt="image"></p>
<p>After you connect you are immediately taken to the connection editor page, where
you make some important decisions about what you plan to share with this channel.</p>
<p><img class="img-responsive" src="https://grid.reticu.li/photo/b334915c03a665493915598c69c17a87c910a39db2cd3b5292e4623ea4c4a45c-1.png" alt="image"></p>
<p>The two important settings are</p>
<ul><li>The individual permissions for the newly connected channel</li>
<li>The privacy group(s) the connection is a member of</li>
</ul><p>The individual permissions are mostly straightforward, but they can be slightly
unclear at first. For example, <strong>Can view my file storage and photos</strong> does <em>not</em>
mean that the connected channel will be able to view <em>all</em> of your photos and files!
It means that you will have the <em>option</em> to share photos and files with that
channel. It is perfectly possible for you to allow someone to read your posts but
disallow them from seeing photos in that post. This kind of unusual situation is,
as they say, not a bug; it is a feature.</p>
<p>Privacy groups allow you to conveniently share items with groups of people. You can
create whatever groups fit your needs by opening the <strong>Add privacy group</strong> link.</p>
<p><img class="img-responsive" src="https://grid.reticu.li/photo/facb0bdfdecb4c779de9048cd14b417c0d76de17af476be5f296b78d70e993e3-1.png" alt="image"></p>
<p>In this editor, you can switch between the existing privacy groups and see at a
glance what channels are and are not members of the group. Selecting the icon of
a channel in either box will move it to the in or out of the group.</p>
<p><img class="img-responsive" src="https://grid.reticu.li/photo/25eaad2435200f72a1dd3a00ba17a76ca6db4c246b3c4fa286b390cae7c86971-1.png" alt="image"></p>
<p>When editing an individual channel's settings, you can set their privacy group
membership using the widget on the left:</p>
<p><img class="img-responsive" src="https://grid.reticu.li/photo/bdbcf0ffd9004657237f6b7b7863da5a8e39a5bc17d2c67fa160efef205661bf-1.png" alt="image"></p>
<p>Connections are a mutual engagement. The channel you connect can <em>choose</em> to approve your
connection. They will receive a notification that you connected</p>
<p><img class="img-responsive" src="https://grid.reticu.li/photo/324247680b605fd214fd61aecd8f216fa8f5dfa0f16a04c8e968fdbc43d04469-1.png" alt="image"></p>
<p>which takes them to their <a href="https://grid.reticu.li/connections"><strong>Connections</strong></a> editor page where
they can choose to approve the connection or not.</p>
<p><img class="img-responsive" src="https://grid.reticu.li/photo/e05248fdc5688d6d24bde52432fdc7b39692a094559aa504de99352940b10497-1.png" alt="image"></p>
<p>After you approve a connection, it is a good idea to open the individual connection
editor by pressing the edit button beside the <strong>Delete</strong> button.</p>
<p><img class="img-responsive" src="https://grid.reticu.li/photo/c4cad3e4c356dd2a227df79bd4dc6d47edf1b66ea243f005b6b452ec366b5acc-1.png" alt="image"></p>