Steemit Hacks | Aprenda a formatar seus textos como um profissional

in #pt7 years ago (edited)

Chega de passar raiva com centralização, justificação e alinhamentos em geral!

Algumas pessoas podem ter dificuldades com a formatação de textos no steemit usando MarkDown misturado com css.

Seguem dicas que podem ser úteis até para quem já é veterano por aqui e ainda não sabia.

Você vai aprender a:


  1. usar editor html normal ao invés de MarkDown
  2. centralizar textos
  3. justificar textos
  4. alinhar textos à direita
  5. escrever códigos, como por exemplo: <div> sem precisar usar a caixa de códigos

image.png

Dicas para Formatação de Textos no Steemit


1. Mudar editor pra html

Essa é a dica mais simples para quem se atrapalha ou simplesmente não gosta do código MarkDown.

a) Clique em POST

post.png

b) Clique em editor

editor.png

c) Use os ícones e seja feliz

menus.png

(outra opção é usar o site https://busy.org que já vem com esse editor por padrão)

2. Centralizar texto (não funciona no editor html)


<div class="text-center">
   
textos ou imagens
    
</div>

 
Note que precisa pular uma linha antes e outra depois para que os códigos "<div>" não encostem emquaisquer outros textos e imagens.

3. Justificar texto(não funciona no editor html)


<div class="text-justify">
 
textos ou imagens
 
</div>
 

Note que precisa pular uma linha antes e outra depois para que os códigos "<div>" não encostem emquaisquer outros textos e imagens.

 

4. Texto alinhado à direita (não funciona no editor html)

    
<div class="text-right">
   
textos ou imagens
    
</div>
    

Note que precisa pular uma linha antes e outra depois para que os códigos "<div>" não encostem emquaisquer outros textos e imagens.

 

5. Escrever códigos sem que sumam, por exemplo: "<div>"

Se você tentar escrever "<div>", vai notar que não aparece, porque ao invés disso, o sistema entenderá que você quer criar uma "div".

Isso acontece com quase todos os códigos. Para contornar tal problema, utilize uma barra invertida antes de cada código, conforme exemplos abaixo:


\<div\>
\<p\>
\<center\>

Fazendo isso, ao invés de sumir, ficará assim:

<div>
<p>
<center>

 

Parabéns!


Agora você já pode aprimorar seus textos sem passar tanta raiva ou frustração!

Espero que sua experiência com textos no steemit apartir de agora seja muito melhor!

Sort:  

@casberp uma das coisas que gostaria de saber é como colocar o texto em cinza com uma barra lateral. Algo como... textos que apontam referência. Não sei se consegui me explicar. :D

Pior que não entendi direito.

seria isso? aqui?

Se for, é só usar o >, exemplo:


> texto qualquer

Wooow! Sensacional! Isso mesmo!

Beleza!!

Então é isso :)

Sucesso!
 

Post imprecidível! Vai ajudar muito de agora em diante!

Perfect :)

Upvoted em nome do Time de Curadoria dropahead!

Obrigado por seguir as regras.

AVISO: O time de curadoria dropahead não, necessariamente, compartilha das opiniões expressadas neste artigo, mas acredita que o esforço e contribuição do autor merecem melhor recompensa e visibilidade.

Ajude-nos a te dar upvotes maiores:

Upvote este comentário!
Upvote & Resteem o último Relatório de Curadoria dropahead!
Junte-se a Trail de Curadoria dropahead
para maximizar suas recompensas de curadoria!
Vote dropahead Witness com SteemConnect
Proxy vote dropahead Witness
com SteemConnect
Doe STEEM POWER para @dropahead
12.5SP, 25SP, 50SP, 100SP, 250SP, 500SP, 1000SP
Faça o mencionado acima e nós teremos mais STEEM POWER para dar a VOCÊ maiores rempensas da próxima vez!

Novidades dropahead: How to give back to the dropahead Project in 15 seconds or less

Ótimas dicas. Obrigado :)

Valeu Raphael!

Aparece no nosso grupo do telegram pra conhecer o pessoal!

https://t.me/steemitbrasil

Não utilizo o Telegram, mas obrigado mesmo pelas dicas :)

Por nada. Fiz um post também sobre o keepass, programa para guardar senhas de forma um pouco mais segura. Se quiser conferir, fica em:
https://steemit.com/pt/@casberp/keepass-tutorial-or-aprenda-a-guardar-suas-keys-e-senhas-de-forma-um-pouco-mais-segura

Temos comunidade no discord também, se quiser participar, será bem-vindo.
https://discord.gg/DQfY3

Ótimas dicas @casberp, assim talvez eu consiga de fato aumentar o tamanho das fontes!
HUAHAHUHAUHA

Vlw

Opa, aumentar como assim?

Usa isso ó:

# teste
## teste 2
### teste 3
#### teste 4
##### teste 5
###### teste 6

:)

Aumentar de tamanho tipo está em 12 o tamanho e quero que ela fique com 20 por exemplo, usando o # aumenta a fonte do texto, é isso?

Usando os # você faz os cabeçahos, é como se fosse <h1> <h2> <h3>

Isso aí que você quer, acho que simplesmente não tem como fazer por aqui. O código seria:

<div style="font-size:50px;">

gigante

</div>

Só seria possível se já existisse uma classe no css do steemit com esse tamanho.

Entendi... vou testar esse código depois, mas mudando para html será deve rolar normal não?

Tentei, mas não. Acho que é pra evitar que os posts virem bagunça mesmo. Manter o padrão.

Obrigado pela ajuda. Eu normalmente escrevo meus posts no android app eSteem porque dá para salvar rascunhos no final copio e publico pelo busy.

Opa, sabe que no busy também salva rascunhos automaticamente né? Você pode acessá-los em https://busy.org/drafts

obrigado sei sim mas como uso o eSteem como base pois tambem me permite definir a % de voto assim não tenho que mudar de app.

O busy também permite setar a % padrão. Em Settings :P

Hahahaha meu salvador!
Ganhei dias sem rugas e posts bem mandados
XD

AHhaha, que bom contribuir para sua saúde e melhor escrita por aqui!

Parabéns, seu post foi selecionado pelo projeto Brazilian Power, cuja meta é incentivar a criação de mais conteúdo de qualidade, conectando a comunidade brasileira e melhorando as recompensas no Steemit. Obrigado!

footer-comentarios-2.jpg

Gosto muito de ler isso! :D

Valeuuuu

Muito obrigada pelas dicas!

Oi Mafalda ^^

Valeuu :)

Sensacional!! Valeu pelas dicas.. estava sofrendo aqui com isso!

Que legal Bruno que te ajudou! Bom saber, valeu por comunicar.

Ainda não sabia da sua existência (seguindo agora), já vi que está no nosso grupo do telegram, muito bom!

Qualquer coisa, grita!

Muito bom! Valeu pelas super dicas amigo! Vai ajudar muita gente.

Aeeee Coyote, que ajude mesmo! Valeu a presença ae!

Quando eu comecei eu tive que procurar essa informação em inglês. Não consegui encontrar algo mastigado assim. Apanhei um bocado e até fiz um post para falar que podia se mudar para HTML (editor).
Agora estou me habituando ao markdown. Ele agiliza muito na hora de formatar, a parte ruim é que eu tenho que reaprender tudo. =(
Faz parte, vamos que vamos.

Opa, que nada, usa o stackedit que é ótimo e já vem com o layout pronto. Dá uma olhada num post antigo que fiz pro @utopian-io:

StackEdit

Fiquei uma semana quebrando a cabeça, pois quando eu colocava < div > o texto juntava com a linha de baixo. Agora percebi que é só dar um espaço hehe

Obrigada demais pela ajuda!

Que ótimo que pude ajudar Camilla!

Obrigado pela presença e feedback ;)

Estava precisando disso, obrigada!!!!

Que legal poder ajudar Carol! Bora telegram!

Congratulations! This post has been upvoted from the communal account, @minnowsupport, by Reborn from the Minnow Support Project. It's a witness project run by aggroed, ausbitbank, teamsteem, theprophet0, someguy123, neoxian, followbtcnews, and netuoso. The goal is to help Steemit grow by supporting Minnows. Please find us at the Peace, Abundance, and Liberty Network (PALnet) Discord Channel. It's a completely public and open space to all members of the Steemit community who voluntarily choose to be there.

If you would like to delegate to the Minnow Support Project you can do so by clicking on the following links: 50SP, 100SP, 250SP, 500SP, 1000SP, 5000SP.
Be sure to leave at least 50SP undelegated on your account.

Mano, e esses links em vermelho, que as invés de aparecer o https, só aparece as frases, palavras, como faz isso? RSS...

Posted using Partiko Android

Mano, e esses links em vermelho, que as invés de aparecer o https, só aparece as frases, palavras, como faz isso? RSS...

Posted using Partiko Android

Em vermelho não sei, mas pra vc linkar algo com palavras é assim:


[casberp ptgram](https://ptgram.tk)

Agora eu tô entendendo mais ou menos como funciona RSS obrigado pelo esclarecimento mais uma vez!

Posted using Partiko Android

Sei que o post é antigo, mas cheguei aqui através de uma busca no Google. Gostaria muito de aprender a fazer legenda nas fotos.