Markdown Урок! - Как да използваме команди в Hive постовете си

HereThis is a translated post from @carrieallen to help all my Bulgarian folks understand how Markdown works. Original post -

<p dir="auto"><img src="https://images.hive.blog/768x0/https://images.ecency.com/DQmV9uagt6yYNUcgZTpXfSgiXHJ6hhL2aaDKKERaQp7vYYT/markdown_header.jpg" alt="markdown_header.jpg" srcset="https://images.hive.blog/768x0/https://images.ecency.com/DQmV9uagt6yYNUcgZTpXfSgiXHJ6hhL2aaDKKERaQp7vYYT/markdown_header.jpg 1x, https://images.hive.blog/1536x0/https://images.ecency.com/DQmV9uagt6yYNUcgZTpXfSgiXHJ6hhL2aaDKKERaQp7vYYT/markdown_header.jpg 2x" /> <p dir="auto">Здравейте на всички в този пост ще се запознаем с <strong>Markdown, кодът който използваме за да вкарваме команди в нашите постове. <p dir="auto">Мисля че ще е много полезно за всички да се научим как да украсяваме постовете си и да ги направим да изглеждат по-добре. <hr /> <h1><center><strong>Този пост съдържа следните уроци: <ul> <li><strong>1. Обяснение на различните функции за представяне на текст <li><strong>2. Как да направим заглавие в различен размер <li><strong>3. Как да поставяме линкове в постовете си <li><strong>4. Поставяне на снимки и как да ги направим с линкове <li><strong>5. Центриране на изображения или текст <li><strong>6. Изкарване на текст от ляво или дясно в поста си <li><strong>7. Създаване на списъци с точки като този <li><strong>8. Как да цитираме текст <li><strong>9. Създаване на таблици <hr /> <h2><center>1. Представяне на текст <p dir="auto">Текста който виждате в сините кутийки е как трябва да изглежда кода, а отдоло е как изглежда финалния резултат. <p dir="auto"><strong>За да добавите <em>курсив текст добавяме звездичка ПРЕДИ и СЛЕД текста <pre><code>*Тук вкарваме нашия текст* <p dir="auto">Резултат: <em>Тук вкарваме нашия текст <p dir="auto"><strong>За да добавите удебелен текст ползваме две звездички. <pre><code>**Това е получер текст** <p dir="auto">Резултат: <strong>Това е получер текст <p dir="auto"><strong>Двете команди използвани заедно стават с три звездички. <pre><code>***Това е курсив и получер текст*** <p dir="auto">Резултат: <strong><em>Това е курсив и получер текст <p dir="auto"><strong>За да добавим текст който е задраскан използваме ~~ <pre><code>~~Това е задраскан текст~~ <p dir="auto">Резултат: <del>Това е задраскан текст <hr /> <p dir="auto"><strong>А как да добавим линия като тази? 👆 <p dir="auto">Това може да се направи с една от следните 3 команди с <strong>празно място след текста: <pre><code>*** <pre><code>--- <pre><code>___ <p dir="auto">Просто избирате един от по-горните знаци, който ви е най-удобен за ползване. <p dir="auto">Резултат: <hr /> <hr /> <hr /> <h2><center>2. Заглавие с различен размер <p dir="auto">Има 6 различни размера който може да бъде направен заглавния текст.<br /> Просто поставяте <strong># (хаштаг) и място преди текста който искат като заглавие. <p dir="auto"><strong>Един # е най-големия текст и 6 най-малкия. <pre><code># Заглавие 1 <pre><code>## Заглавие 2 <pre><code>### Заглавие 3 <pre><code>#### Заглавие 4 <pre><code>##### Заглавие 5 <pre><code>###### Заглавие 6 <p dir="auto">Резултат: <h1>Заглавие 1 <h2>Заглавие 2 <h3>Заглавие 3 <h4>Заглавие 4 <h5>Заглавие 5 <h6>Заглавие 6 <hr /> <h2><center>3. Как да поставяме линкове в текст <p dir="auto">Поставяме <strong>квадратни скоби [] около текста който искаме да се изписва.<br /> След това в <strong>нормални скоби () слагаме адреса на линка който искаме да поставим като линк. <pre><code>[Това е моят линк](адрес на линка) <p dir="auto">Резултат: <a href="https://ecency.com/@ivangeevo" target="_blank" rel="nofollow noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">Това е моят линк <hr /> <h2><center>4. Поставяне на снимки и слагане на линк към тях <p dir="auto">Поставянето на снимка може да стане с бутона за поставяне на снимка по-горе или да се използва команда подобна на тази за линковете. <p dir="auto"><strong>Просто поставяме ! пред линка който искаме да сложим като снимка <pre><code> <p dir="auto"><img src="https://images.hive.blog/768x0/https://img.webmd.com/dtmcms/live/webmd/consumer_assets/site_images/article_thumbnails/other/cat_relaxing_on_patio_other/1800x1200_cat_relaxing_on_patio_other.jpg" srcset="https://images.hive.blog/768x0/https://img.webmd.com/dtmcms/live/webmd/consumer_assets/site_images/article_thumbnails/other/cat_relaxing_on_patio_other/1800x1200_cat_relaxing_on_patio_other.jpg 1x, https://images.hive.blog/1536x0/https://img.webmd.com/dtmcms/live/webmd/consumer_assets/site_images/article_thumbnails/other/cat_relaxing_on_patio_other/1800x1200_cat_relaxing_on_patio_other.jpg 2x" /><br /> <a href="https://img.webmd.com/dtmcms/live/webmd/consumer_assets/site_images/article_thumbnails/other/cat_relaxing_on_patio_other/1800x1200_cat_relaxing_on_patio_other.jpg" target="_blank" rel="nofollow noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">source <p dir="auto">За разлика от линковете, когато поставяте снимка, квадратните скоби [] няма нужда да имат текст в тях и просто можете да ги оставите празни. <p dir="auto"><strong>За да поставим линк в снимка се използва със същите команди но цялата команда за снимката се поставя в команда за линк. <p dir="auto"><strong>Отначало командата за линк изглежда така: <pre><code> <p dir="auto">За да добавим линк към нея слагаме цялото нещо в команда за линк. <p dir="auto">Първо добавяме цялото нещо в [] и накрая в () поставяме линка към който искаме да води снимката. <p dir="auto"><strong>Финалната команда изглежда така: <pre><code>[](https://img.webmd.com/dtmcms/live/webmd/consumer_assets/site_images/article_thumbnails/other/cat_relaxing_on_patio_other/1800x1200_cat_relaxing_on_patio_other.jpg) <p dir="auto">Резултат:<br /> <a href="https://img.webmd.com/dtmcms/live/webmd/consumer_assets/site_images/article_thumbnails/other/cat_relaxing_on_patio_other/1800x1200_cat_relaxing_on_patio_other.jpg" target="_blank" rel="nofollow noreferrer noopener" title="This link will take you away from hive.blog" class="external_link"><img src="https://images.hive.blog/768x0/https://img.webmd.com/dtmcms/live/webmd/consumer_assets/site_images/article_thumbnails/other/cat_relaxing_on_patio_other/1800x1200_cat_relaxing_on_patio_other.jpg" srcset="https://images.hive.blog/768x0/https://img.webmd.com/dtmcms/live/webmd/consumer_assets/site_images/article_thumbnails/other/cat_relaxing_on_patio_other/1800x1200_cat_relaxing_on_patio_other.jpg 1x, https://images.hive.blog/1536x0/https://img.webmd.com/dtmcms/live/webmd/consumer_assets/site_images/article_thumbnails/other/cat_relaxing_on_patio_other/1800x1200_cat_relaxing_on_patio_other.jpg 2x" /> <hr /> <h2><center>5. Центриране на изображения или текст <p dir="auto">В тази секция и следващата ще се научим как да центрираме текст и изображение и да ги местим в ляво или в дясно на поста си. <p dir="auto"><strong>Първо как да центрираме. <p dir="auto">За тази цел използваме тази команда: <pre><code><center> <p dir="auto">Тя се слага в началото на това което искаме да центрираме.<br /> Накрая завършваме със същата команда но с / пред нея. Тази черта определя края на командата. <pre><code></center> <p dir="auto"><strong>Пример: <pre><code><center>Това е центриран текст</center> <p dir="auto">Резултат: <center>Това е центриран текст <p dir="auto"><strong>Със снимки процесът е подобен. <p dir="auto">Ползваме същата команда която използвахме по-горе за поставяне на снимка в комбинация с тази за центриране. <p dir="auto"><strong>Пример как трябва да изглежда кода: <pre><code><center></center> <p dir="auto">Резултат:<br /> <center><img src="https://images.hive.blog/768x0/https://st2.depositphotos.com/1000792/8526/v/600/depositphotos_85260512-stock-illustration-squirrel-eats-nut.jpg" srcset="https://images.hive.blog/768x0/https://st2.depositphotos.com/1000792/8526/v/600/depositphotos_85260512-stock-illustration-squirrel-eats-nut.jpg 1x, https://images.hive.blog/1536x0/https://st2.depositphotos.com/1000792/8526/v/600/depositphotos_85260512-stock-illustration-squirrel-eats-nut.jpg 2x" /><br /> <a href="https://st2.depositphotos.com/1000792/8526/v/600/depositphotos_85260512-stock-illustration-squirrel-eats-nut.jpg" target="_blank" rel="nofollow noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">source <hr /> <h2><center>6. Поставяне на текст от ляво или дясно <p dir="auto"><strong>Следната секция е малко по-сложна от останалите, но не се страхувайте да опитвате докато получите желания резултат. Можете да копирате командите за улеснение. <p dir="auto">За да поставим текст от ляво или дясно и да го сложим около снимка, трябва да направите кода ТОЧНО по този начин: <pre><code><div class="pull-right">ЛИНК КЪМ СНИМКАТА</div>ВАШИЯТ ТЕКСТ ТУК <p dir="auto"><strong>Подробно обяснение: <blockquote> <ul> <li>Първо избираме съответната команда (ляво или дясно) <pre><code><div class="pull-left"> <p dir="auto">Или <pre><code><div class="pull-right"> <ul> <li>Вкарваме ЛИНК КЪМ СНИМКАТА, без място <li>Завършваме pull кода с <pre><code></div> <ul> <li>След края на pull кода вкарваме текста който искаме да се изкарва от ляво или от дясно на снимката, без място. <p dir="auto">Можете да използвате следните команди и само за текст. <p dir="auto">Ето командите, можете да ги копирате за улеснение. <pre><code><div class=pull-right>Този текст е отдясно</div> <pre><code><div class=pull-left>Този текст е отляво</div> <pre><code><center>Този текст е в средата</center> <p dir="auto">Резултат: <div class="pull-right">Този текст е отдясно <div class="pull-left">Този текст е отляво <center>Този текст е в средата <hr /> <h2><center>7. Създаване на списъци с точки <p dir="auto">Това се прави много лесно. Просто слагаме - , + или * пред текста който искаме да излезе със точка пред него. <pre><code>* Пример със звездичка <pre><code>- Пример със минус <pre><code>+ Пример със плюс <ul> <li>Пример със звездичка <ul> <li>Пример с минус <ul> <li>Пример с плюс <hr /> <h2><center>8. Как да цитираме текст <p dir="auto">Много е важно когато цитираме точните думи на някого, да използваме следната команда и след това да сложим линк към цитата.<br /> Също така може да се използва за да изпъкнат определени части от поста, както направих аз в по-горната секция. <p dir="auto"><strong>Просто поставяме > (стрелка надясно) преди всяко изречение което искате да цитирате. <p dir="auto">Пример: <pre><code>>Цитирането може да се използва за да създаде дълбочина на поста ви. <blockquote> <p dir="auto">Цитирането може да се използва за да създаде дълбочина на поста ви. <p dir="auto"><strong>Също така ако има празно място в цитирания текст, преди него също се слага >. <hr /> <h2><center>9. Как да създаваме таблици <p dir="auto">Можете да използвате таблици за да организирате различни неща. <p dir="auto">Ето пример: <pre><code>|Заглавие 1|Заглавие 2|Заглавие 3|Заглавие 4|Заглавие 5| |---|---|---|---|---| |Червено|Банан|Сутрин|Иван|Везни| |Зелено|Портокал|Обед|Стоян|Дева| |Синьо|Ягода|Вечер|Георги|Телец| <p dir="auto">От което се получава: <div class="table-responsive"><table> <thead> <tr><th>Заглавие 1<th>Заглавие 2<th>Заглавие 3<th>Заглавие 4<th>Заглавие 5 <tbody> <tr><td>Червено<td>Банан<td>Сутрин<td>Иван<td>Везни <tr><td>Зелено<td>Портокал<td>Обед<td>Стоян<td>Дева <tr><td>Синьо<td>Ягода<td>Вечер<td>Георги<td>Телец <p dir="auto">Ето ви празна таблица която можете да копирате и да попълните сами: <pre><code>| | | | | | |---|---|---|---|---| | | | | | | | | | | | | | | | | | | <p dir="auto">В таблиците можете да слагате и снимки. Даже и с линкове, но това ще го оставя на по-изобретателните да се досетят как сами. 😉 <hr /> <h1><center>🙏 <p dir="auto"><strong>Оставих някои секции от оригиналния пост който аз самият неможах да разбера, или просто за да не става прекалено дълъг поста.Най-важните и най-често използваните команди са тук. <p dir="auto"><span>Благодаря и на <a href="/@iliyan90">@iliyan90, че ми показа оригинала. <p dir="auto">Докато превеждах поста научих много полезни неща които със сигурност ще използвам за в бъдеще в постовете си. 🙂 <p dir="auto">И това е всичко за сега, надявам се този пост да ви е бил полезен и да сте научили нещо ✌️. Namaste 🙏 <hr /> <p dir="auto"><a href="https://ecency.com/@ivangeevo/kak-se-registrirakh-v-hive" target="_blank" rel="nofollow noreferrer noopener" title="This link will take you away from hive.blog" class="external_link"><img src="https://images.hive.blog/768x0/https://images.ecency.com/DQmZSFa6xSbibpEo3nGSXjCa13E5PQN7YN2UMLQm69PazsF/hive_asdasd.jpg" alt="hive_asdasd.jpg" srcset="https://images.hive.blog/768x0/https://images.ecency.com/DQmZSFa6xSbibpEo3nGSXjCa13E5PQN7YN2UMLQm69PazsF/hive_asdasd.jpg 1x, https://images.hive.blog/1536x0/https://images.ecency.com/DQmZSFa6xSbibpEo3nGSXjCa13E5PQN7YN2UMLQm69PazsF/hive_asdasd.jpg 2x" />