OKEY!
COMECANDO COM O BÁSICO DO BÁSICO:
ESTE BLOG ESTA FOCADO Á AQUELES QUE ESTÃO CAINDO COMPLETAMENTE DE PARAQUEDAS NO SPACEHEY. RECOMENDO Á AQUELES QUE JÁ TEM UMA CERTA EXPERIÊNCIA COM OS LAYOUTS DAQUI, QUE PULE ESSA PARTE!
bom...
Pra quem esta vindo pra cá de viagem e não entende muito de informática em geral, entendo que pode ser uma TOTAL dor de cabeça ver esses layouts e não entender porra nenhuma!!! pessoalmente, eu recomendaria já começar com um layout pré-pronto e ir editando. Mas estou de acordo que é muito confuso no começo, então vamos começar primeiro a entender e montar o nosso primeiro perfilzinho nós mesmos!
Ah, e pra ser mais fácil, recomendo usar o seguinte site: clique!
Ele é uma cópia do spacehey feita apenas para testar layouts, então pra quem não quer ficar se dando o trabalho de testar, dar reload no próprio perfil, voltar, testar, e o mesmo loop ate gostar de algo, ele é muito bom! ele é assim:
você apenas tem que colocar os códigos na primeira ou segunda caixinha, e eles vão imediatamente carregar! Bem fácil, né?
Obs: os seguintes códigos que eu vou dar pra vocês funcionam tanto como layouts de perfil tanto como layouts de blog, que como vocês podem ver o meu blog tá todo decoradinho! No caso do blog, vocês tem essa interface:
Vocês vão abrir essa opção aqui: 
e copiar colar o código aí dentro, clicar de novo e essa interface irá fechar com os códigos dentro.
No caso de carregar no perfil, vocês vão até o >edit profile< e vai abrir a página cheia de caixinhas brancas. vocês podem copiar e colar os códigos em qualquer uma das caixinhas, mas é recomendado colocar na seção >about me<
CODIGOS NOS COMENTARIOS!! OBSERVACAO: NO COMECO E FINAL DE CADA CODIGO, COLOQUE O SEGUINTE:
<STYLE>
</STYLE>
exemplo:
<style> codigocodigocodigo </style>
LINK DO PROXIMO MINI TUT: aqui!!
Comments
Displaying 10 of 10 comments ( View all | Add Comment )
aroundevil
obrigada chuchu! me ajudou muito >.<
Meyzinha
querida(o), queria tirar uma duvida. você tiras as imagens aonde? ja tentei no pinterest e não vai, se for no pinterest, você gera o codigo aonde?
no pinterest tem como sim! clica com o botão direito do mouse na imagem e clica em "Abrir imagem em outra guia" e copia o link :3
by M4keB3liev3; ; Report
Meulizza
Obrigadinha! Vc me ajudou dms.
Manuel Janeiro
Olá "unicornwaste", Valeu! Muito Obrigado pelas suas excelentes Dicas neste seu Tutorial. Muito Bacana! Brigadão! Estamos na seguição!
Hehehe fico muito feliz que tenha gostado, Manuel! Vou postar mais alguns, atentos todos a novas diquinhas!!
by unicornwaste; ; Report
julia
Nossa, ajudou muito
a mds a foto do gekyume :(
by sayorii:3; ; Report
florentt
você é mt necessaria ,')
Mindy_woo
Como eu crio uma página pra layout?, queria postar uns, mas n sei como
infelizmente o spacehey ta com problema nos layouts :(((( faz MESES q ta parado e nao se resolve.. normalmente voce apenas teria que ir na parte dos layouts e ali diz "create your own", mas da erro quando voce posta :(
by unicornwaste; ; Report
˚‧₊˚Mar˚。⋆‧₊˚
Vc é um anjo na terra!! Muito obrigada <3
KOJI
nossa moça, eu te amo vey...
unicornwaste
BACKGROUNDS:
(imagens de fundo)
Bom, começando por isso que é o mais simples, você vai usar o seguinte código para a imagem de fundo:
body {
background-image: url("https://i.pinimg.com/736x/10/f8/51/10f851038f38654cfe0f4e38d8328c53.jpg") !important;
background-color: black !important;
background-attachment: fixed !important;
margin: 0;
padding: 0;
está vendo onde está marcado com azul? Apenas substitua essa parte com qualquer url de imagem ou gif! --- agora, se você quiser APENAS um background de >COR< ao invés de imagem, use o seguinte:
main {
background-color: black;
}
substitua a cor onde diz "black" por qualquer cor que quiser (contanto que esteja em inglês), ou também você pode usar hexcolor! link de onde pegar hexcolor: color picker (copie o hexcolor com a hashtag)
OTIMO! focando no background de dentro do perfil (onde vão estar suas informações)
main {
background-image: url(SUAURL);}
OU
main {
background-color: cor_ou_hex;}
by unicornwaste; ; Report
OTIMO!
AGORA! lets spice things up! vamos colocar um banner legal?!
BEM SIMPLES :3
main:before {
width: auto;
margin-bottom: 25px;
border: 1px solid black;
height: 150px;
display: block;
content: "";
background-image: url(https://i.pinimg.com/736x/39/c6/c4/39c6c429f43da7923203ed7a1363cc2d.jpg); background-position: center center;
background-size: cover;
SUBSTITUA O QUE ESTÁ ENTRE PARENTESES POR QUALQUER GIF OU IMAGEM! você também pode mudar o tamanho do seu cabeceiro em "height: 150px;", mude para a quantidade de pixels que desejar, e pronto!
by unicornwaste; ; Report
Legal né :P Agora vamos pra penúltima etapa desse tutorial!
vamos mudar essas cores feias do spacehey default!
:root {
--logo-blue: transparent; /* MUDA A COR DA PARTE DE CIMA DO SEU PERFIL */
--darker-blue: pink; /* MUDA A COR DOS SEUS LINKS */
--lighter-blue: lightpink; /* MUDA A COR DA BARRA DE NAVEGACAO */
--even-lighter-blue: #ccc;
--lightest-blue: #fff;
--dark-orange: #FFF; /* MUDA A COR DA FONTE DE ABOUT ME E DO WHO ID LIKE TO MEET */
--light-orange: purple); /* MUDA A COR DOS COMENTARIOS */
--even-lighter-orange: pink; /* MUDA A COR DOS COMENTARIOS */
--green: #38d;
}
é claro, mude as cores de acordo com seu gosto, podendo usar até hexcolor! seja criativo!
by unicornwaste; ; Report
MUITO BEM! vamos para a ultima parte desse nosso primeiro tutorial! ^_^
pessoalmente, a mim me incomoda um pouco como essa parte do meio do perfil (onde estão suas infos) é tão estreita em desktop! Fica esquisito >_> então, pra mudar isso, apenas cole esse pequeno código:
.container {
width: 90%;
max-width: 1600px;
}
onde diz ``1400px``, edite pra quantidade que quiser! a pagina vai aumentar (horizontalmente) a quantidade que você quiser :3
by unicornwaste; ; Report
MEU DEUS VOCÊ É D+
by MiyaTHEclown; ; Report
Obgg diva. Gnt eu boba com esse app kkkkkk igual dos anos 2000
by ˚ ༘♡ ⋆。˚rottngrlℳ ༘♡ ⋆。˚; ; Report
obrigada gente! voces sao uns anjos, que tudo de certo!
by unicornwaste; ; Report
Deus te abençoe grandemente
by Bekkita; ; Report
Oloko ajudou d+
by Silver☆; ; Report
brigado pessoa cronicamente online *emoji de oração*
by Plutonicc; ; Report
faz um tutorial de como mudar os posts do blog pfv!, queria mudar a cor pra vermelho
by sayorii:3; ; Report
faco sim!! proximo blog vai ser de como editar os blogs e deixar eles bonitinhos entao! (≧∀≦)ゞ
by unicornwaste; ; Report
obggg
by sayorii:3; ; Report