Fundo diferente na sidebar e em cada widget

Boa tarde meus cheiros tudo belezinha? Quem ai já está de férias e está acordando tarde hein? Eu que não Saushaushuahs é um sonho bem distante ainda =/ Mas enquanto não chega estamos ai. Gente, eu queria fazer algo que não é tão novidade mas acho que seria de grande utilidade, vocês sabem que eu sempre posto layouts free quando completo alguma meta ou quando tem algum sorteio e tal, lembram que eu havia feito um portfólio? Então, fiz e não deu em nada e acho até engraçado porque quando eu não tinha tempo e não fazia layouts exclusivos muitos me pediam, depois que abri meu próprio portfólio ninguém quis e ninguém teve interesse, então tive uma ideia e acho que muitos irão amar.

Estou pensando em por os três layouts que eu fiz para venda como layouts free, são modelos para blogs pessoais e fogem dos modelos de html, eu tenho uma dó muito grande deixar eles mofando até porque fiz com muito amor e carinho e queria saber da opinião de vocês se concordam e se gostariam de ter esta opção. Por favor leiam todo o post e me falem se vale a pena mesmo e se iriam usar certo? Mudando de assunto, hoje eu trago um tutorial que uma leitora me pediu e que eu acho até bem legal e muito útil, que é por fundo na coluna da sidebar e mudar o fundo de cada widget, não é difícil e fica super fofo vocês só tem que prestar atenção. Então, vamos lá?


LIVE PREVIEW (^3^=)~

Antes de tudo, vá até o seu modelo clique em editar html e procure por esta parte: .main-inner .fauxcolumn-left-outer .fauxcolumn-inner { Isto se sua sidebar for na esquerda e se for na direita é esta parte: .main-inner .fauxcolumn-right-outer .fauxcolumn-inner {  Terá um código abaixo deste que vocês terão que apagar, no caso esta parte:

background: $(widget.outer.background.color) $(widget.outer.background.gradient) repeat scroll top left;

Apague o código acima e cole o código a seguir abaixo dele: 

margin-right: VALORpx;
margin-top:VALORpx;
background: #COR;

Ou se quiserem uma imagem no fundo mudem e acrescentem no background o seguinte código: 

background: url("LINK DA IMAGEM") repeat;

Agora para mudar o widget e deixar ele como você quiser primeiro você irá criar os widgets e nomeá-los, no caso crie um sidebar e coloque o nome que irá utilizar neste gadget, depois de salvos vá até o seu modelo e procure o nome que deu ao seu gadget, aqui neste tema eu coloquei gadget 1, gadget 2, gadget 3 e o 4.

Veja como está na imagem:


 repare que cada um tem um código de html que é o nome do seu gadget,  vocês irão pegar a parte que está no HTML? e irão seguir como está no exemplo abaixo:

#HTML4 {
background: #COR; 
color:#COR; COR DA FONTE DO FUNDO DA SIDEBAR
text-shadow: 1px 1px 1px #COR; SOMBRA
}
#HTML4 h2 {
font-size: VALORpx; TAMANHO DA FONTE USADA NO TÍTULO DA SIDEBAR
text-shadow: 1px 1px 1px #COR; SOMBRA

Se quiserem imagem e não apenas preenchimento de cor no fundo optem por: background: url("LINK DA IMAGEM") repeat;

É isso não é difícil, é só seguirem certinho que irá dar tudo certo ok? Beijos e qualquer coisa me chamem na ask!
Querem ver os perfis de quem posta aqui? cliquem na imagem᠉
Continue

5 comentários:

  1. Olá, Rôh!
    Tudo belezinha sim, obrigado. Não, eu não estou de férias. :(
    Eu super apoio você fazer esses três lays de Layout Free, como você disse, não seria legal deixá-los mofar.
    Super legal, essa de de por uma back de uma cor no geral e um diferente para os gadgets, dá um ar bem legal ao lay. Tchau. (www)

    ResponderExcluir
  2. Eu estou de férias, mas estou acordando muito cedo ainda, estou numa maratona de fazer postagens, quero fazer o suficiente pra me substituir quando eu voltar pra faculdade, bem tenso né? Sugestões eu tô mendigando esses dias -qq
    Apoio a ideia dos Layouts, eu já me arrependi muito por não disponibilizar certos layouts, e eu sou o diabo, só pode! Eu vivo perdendo as minhas coisas e com os layouts não foi diferente... Tô pra botar uns cartazes de "procurado" pela cidade ashuahsuah
    Já conhecia esse tutorial, uso vez ou outra, às vezes acho exagerado e às vezes acho necessário, como é o caso do seu preview, deu muito mais charme ao layout. Não é nem um pouco difícil também.

    Diário de uma Otome

    ResponderExcluir
  3. Eu já conhecia esse tutorial, acho muito legal. Fica muito lindo no layout >3<
    ♡mikicandy♡

    ResponderExcluir
  4. Estou de férias desde novembro, mas só passei a dormir tarde mesmo em dezembro. Sobre os layouts, deixe eles de graça mesmo pro povo que ainda não dá conta de editar (tipo eu) usar \o/
    Não conhecia o tutorial, e acho legal usar, se não ficar exagerado no layout nem nada.
    xoxo ~
    Catastrophic ✧

    ResponderExcluir
  5. Antes de tudo, seu lay está um amor! Não sei há quanto tempo você está com ele, sumi por um tempo da blogosfera, então é a primeira vez que o vejo, e gente, é muito lindo. Parabéns, moça! ;3

    Enfim.. Amanhã fará uma semana que já estou de férias haha ^^
    Não conhecia este tutorial mas curti bastante. Com certeza vou usar no meu próximo layout xD

    Kissus de menta ♥ ~ alcoolize.blogspot.com.br

    ResponderExcluir

Olá meus amores, os comentários devem ser direcionados somente ao blog e não a vida pessoal de ninguém! Qualquer dúvida peça pela Ask que responderei o mais rápido possível. Anônimo não adianta vir xingar pelos comentários que antes de mesmo de pensar em me ofender eles serão excluídos! Não gosto de tags, se quiser fazer fique a vontade mas não irei retribuir, não curto seguindo segue de volta =/ mas posso seguir se gostar realmente do blog, não julgo por layout ou por seguidores, avalio o blog e como disse se eu curtir é claro que sigo, afiliações? Peça nos comentários pois se pedir em outro lugar no caso páginas é bem provável que eu não veja! Então meus lindos espero que curtam cada cantinho do meu bloguinho e voltem sempre! kissus (*^3^)

Layout e codificação por Roh A.Ramos Os blogs que mais ajudaram com os tutoriais foram: CHIHDVCA Tecnologia do Blogger ♡ 2012 a 2017