sharing-media.blade.php 8.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225
  1. @extends('site.help.partial.template', ['breadcrumb'=>'Sharing Photos & Videos'])
  2. @section('section')
  3. <div class="title">
  4. <h3 class="font-weight-bold">Sharing Photos & Videos</h3>
  5. </div>
  6. <hr>
  7. <p>
  8. <a class="text-dark font-weight-bold" data-toggle="collapse" href="#collapse1" role="button" aria-expanded="false" aria-controls="collapse1">
  9. <i class="fas fa-chevron-down mr-2"></i>
  10. How do I create a post?
  11. </a>
  12. <div class="collapse" id="collapse1">
  13. <div>
  14. To create a post using a desktop web browser:
  15. <ol>
  16. <li>Go to <a href="{{config('app.url')}}">{{config('app.url')}}</a>.</li>
  17. <li>Click on the <i class="fas fa-camera-retro text-primary"></i> link at the top of the page.</li>
  18. <li>Upload your photo(s) or video(s), add an optional caption and set other options.</li>
  19. <li>Click on the <span class="font-weight-bold">Create Post</span> button.</li>
  20. </ol>
  21. </div>
  22. <div class="pt-3">
  23. To create a post using a mobile web browser:
  24. <ol>
  25. <li>Go to <a href="{{config('app.url')}}">{{config('app.url')}}</a>.</li>
  26. <li>Click on the <i class="far fa-plus-square fa-lg"></i> button at the bottom of the page.</li>
  27. <li>Upload your photo(s) or video(s), add an optional caption and set other options.</li>
  28. <li>Click on the <span class="font-weight-bold">Create Post</span> button.</li>
  29. </ol>
  30. </div>
  31. </div>
  32. </p>
  33. <p>
  34. <a class="text-dark font-weight-bold" data-toggle="collapse" href="#collapse2" role="button" aria-expanded="false" aria-controls="collapse2">
  35. <i class="fas fa-chevron-down mr-2"></i>
  36. How do I share a post with multiple photos or videos?
  37. </a>
  38. <div class="collapse" id="collapse2">
  39. <div>
  40. During the compose process, you can select multiple files at a single time, or add each photo/video individually.
  41. </div>
  42. </div>
  43. </p>
  44. <p>
  45. <a class="text-dark font-weight-bold" data-toggle="collapse" href="#collapse3" role="button" aria-expanded="false" aria-controls="collapse3">
  46. <i class="fas fa-chevron-down mr-2"></i>
  47. How do I add a caption before sharing my photos or videos on Pixelfed?
  48. </a>
  49. <div class="collapse" id="collapse3">
  50. <div>
  51. During the compose process, you will see the <span class="font-weight-bold">Caption</span> input. Captions are optional and limited to <span class="font-weight-bold">{{config('pixelfed.max_caption_length')}}</span> characters.
  52. </div>
  53. </div>
  54. </p>
  55. <p>
  56. <a class="text-dark font-weight-bold" data-toggle="collapse" href="#collapse4" role="button" aria-expanded="false" aria-controls="collapse4">
  57. <i class="fas fa-chevron-down mr-2"></i>
  58. How do I add a filter to my photos?
  59. </a>
  60. <div class="collapse" id="collapse4">
  61. <div>
  62. <p class="text-center">
  63. <span class="alert alert-warning py-2 font-weight-bold">This is an experimental feature, filters are not federated yet!</span>
  64. </p>
  65. To add a filter to media during the compose post process:
  66. <ol>
  67. <li>
  68. Click the <span class="btn btn-sm btn-outline-primary py-0">Options <i class="fas fa-chevron-down fa-sm"></i></span> button if media preview is not displayed.
  69. </li>
  70. <li>Select a filter from the <span class="font-weight-bold small text-muted">Select Filter</span> dropdown.</li>
  71. </ol>
  72. </div>
  73. </div>
  74. </p>
  75. <p>
  76. <a class="text-dark font-weight-bold" data-toggle="collapse" href="#collapse5" role="button" aria-expanded="false" aria-controls="collapse5">
  77. <i class="fas fa-chevron-down mr-2"></i>
  78. How do I add a description to each photo or video for the visually impaired?
  79. </a>
  80. <div class="collapse" id="collapse5">
  81. <div>
  82. <p class="text-center">
  83. <span class="alert alert-warning py-2 font-weight-bold">This is an experimental feature!</span>
  84. </p>
  85. <p>
  86. You need to use the experimental compose UI found <a href="/i/compose">here</a>.
  87. </p>
  88. <ol>
  89. <li>Add media by clicking the <span class="btn btn-outline-secondary btn-sm py-0">Add Photo/Video</span> button.</li>
  90. <li>Set a image description by clicking the <span class="btn btn-outline-secondary btn-sm py-0">Media Description</span> button.</li>
  91. </ol>
  92. <p class="small text-muted"><i class="fas fa-info-circle mr-1"></i> Image descriptions are federated to instances where supported.</p>
  93. </div>
  94. </div>
  95. </p>
  96. <p>
  97. <a class="text-dark font-weight-bold" data-toggle="collapse" href="#collapse6" role="button" aria-expanded="false" aria-controls="collapse6">
  98. <i class="fas fa-chevron-down mr-2"></i>
  99. What types of photos or videos can I upload?
  100. </a>
  101. <div class="collapse" id="collapse6">
  102. <div>
  103. You can upload the following media types:
  104. <ul>
  105. @foreach(explode(',', config_cache('pixelfed.media_types')) as $type)
  106. <li class="font-weight-bold">{{$type}}</li>
  107. @endforeach
  108. </ul>
  109. </div>
  110. </div>
  111. </p>
  112. {{-- <p>
  113. <a class="text-dark font-weight-bold" data-toggle="collapse" href="#collapse7" role="button" aria-expanded="false" aria-controls="collapse7">
  114. <i class="fas fa-chevron-down mr-2"></i>
  115. What is the limit for photo and video file sizes?
  116. </a>
  117. <div class="collapse" id="collapse7">
  118. <div>
  119. </div>
  120. </div>
  121. </p> --}}
  122. {{-- <p>
  123. <a class="text-dark font-weight-bold" data-toggle="collapse" href="#collapse8" role="button" aria-expanded="false" aria-controls="collapse8">
  124. <i class="fas fa-chevron-down mr-2"></i>
  125. When I share a photo, what's the image resolution?
  126. </a>
  127. <div class="collapse" id="collapse8">
  128. <div>
  129. </div>
  130. </div>
  131. </p> --}}
  132. {{-- <p>
  133. <a class="text-dark font-weight-bold" data-toggle="collapse" href="#collapse9" role="button" aria-expanded="false" aria-controls="collapse9">
  134. <i class="fas fa-chevron-down mr-2"></i>
  135. Can I edit my post captions, photos or videos after sharing them?
  136. </a>
  137. <div class="collapse" id="collapse9">
  138. <div>
  139. </div>
  140. </div>
  141. </p> --}}
  142. <p>
  143. <a class="text-dark font-weight-bold" data-toggle="collapse" href="#collapse10" role="button" aria-expanded="false" aria-controls="collapse10">
  144. <i class="fas fa-chevron-down mr-2"></i>
  145. How can I disable comments/replies on my post?
  146. </a>
  147. <div class="collapse" id="collapse10">
  148. <div>
  149. To enable or disable comments/replies using a desktop or mobile browser:
  150. <ul>
  151. <li>Open the menu, click the <i class="fas fa-ellipsis-v text-muted mx-2 cursor-pointer"></i> button</li>
  152. <li>Click on <span class="small font-weight-bold cursor-pointer">Enable Comments</span> or <span class="small font-weight-bold cursor-pointer">Disable Comments</span></li>
  153. </ul>
  154. </div>
  155. </div>
  156. </p>
  157. <p>
  158. <a class="text-dark font-weight-bold" data-toggle="collapse" href="#collapse11" role="button" aria-expanded="false" aria-controls="collapse11">
  159. <i class="fas fa-chevron-down mr-2"></i>
  160. How many people can I tag or mention in my comments or posts?
  161. </a>
  162. <div class="collapse" id="collapse11">
  163. <div>
  164. You can tag or mention up to 5 profiles per comment or post.
  165. </div>
  166. </div>
  167. </p>
  168. <p>
  169. <a class="text-dark font-weight-bold" data-toggle="collapse" href="#collapse12" role="button" aria-expanded="false" aria-controls="collapse11">
  170. <i class="fas fa-chevron-down mr-2"></i>
  171. What does archive mean?
  172. </a>
  173. <div class="collapse" id="collapse12">
  174. <div>
  175. You can archive your posts which prevents anyone from interacting or viewing it.
  176. <br />
  177. <strong class="text-danger">Archived posts cannot be deleted or otherwise interacted with. You may not recieve interactions (comments, likes, shares) from other servers while a post is archived.</strong>
  178. <br />
  179. </div>
  180. </div>
  181. </p>
  182. <p>
  183. <a class="text-dark font-weight-bold" data-toggle="collapse" href="#collapse13" role="button" aria-expanded="false" aria-controls="collapse11">
  184. <i class="fas fa-chevron-down mr-2"></i>
  185. How can I archive my posts?
  186. </a>
  187. <div class="collapse" id="collapse13">
  188. <div>
  189. To archive your posts:
  190. <ul>
  191. <li>Navigate to the post</li>
  192. <li>Open the menu, click the <i class="fas fa-ellipsis-v text-muted mx-2 cursor-pointer"></i> or <i class="fas fa-ellipsis-h text-muted mx-2 cursor-pointer"></i> button</li>
  193. <li>Click on <span class="small font-weight-bold cursor-pointer">Archive</span></li>
  194. </ul>
  195. </div>
  196. </div>
  197. </p>
  198. <p>
  199. <a class="text-dark font-weight-bold" data-toggle="collapse" href="#collapse14" role="button" aria-expanded="false" aria-controls="collapse11">
  200. <i class="fas fa-chevron-down mr-2"></i>
  201. How do I unarchive my posts?
  202. </a>
  203. <div class="collapse" id="collapse14">
  204. <div>
  205. To unarchive your posts:
  206. <ul>
  207. <li>Navigate to your profile</li>
  208. <li>Click on the <strong>ARCHIVES</strong> tab</li>
  209. <li>Scroll to the post you want to unarchive</li>
  210. <li>Open the menu, click the <i class="fas fa-ellipsis-v text-muted mx-2 cursor-pointer"></i> or <i class="fas fa-ellipsis-h text-muted mx-2 cursor-pointer"></i> button</li>
  211. <li>Click on <span class="small font-weight-bold cursor-pointer">Unarchive</span></li>
  212. </ul>
  213. </div>
  214. </div>
  215. </p>
  216. @endsection