Hvordan lage Side-by-Side innlegg i Minima på Blogger

Endre Blogger Minima malen for å vise blogginnlegg ved siden av hverandre, i motsetning til en sammenhengende rull. Dette krever noe som gjør mange endringer i HTML bloggmalen. Sikkerhetskopier malen før du gjør noen HTML og CSS koding endringer, og det er en god ide å bruke Notepad eller en annen tekst editor for å jobbe med HTML før du kopierer og limer den inn i Minima blogg. Husk at hvert innlegg kolonnen vil være om lag 290 piksler bred, inkludert marginer.

Bruksanvisning

Juster Blogg Marginene

1 Åpne en nettleser. Gå til Blogger hjemmeside på www.blogger.com. Skriv inn din e-postadresse og passord. Klikk på den grå "Logg inn" -knappen for å logge på.

2 Klikk på den blå "Design" linken. Klikk på "Rediger HTML" under "Design" -kategorien for å gå til "Rediger mal" -siden.

3 Bla nedover i malen til du ser "# ytre-wrapper" tag, etterfulgt av en brakett "{". Standard bredde for den ytre-wrapper i Minima er 660 piksler. Endre den til 940 piksler, slik at det ser slik ut:

ytre-wrapper {

width: 940px;

}

4 Bla ned til "# main-wrapper" tag. Endre bredde fra 410 piksler til 620 piksler.

5 Bla ned til "# header-wrapper" tag. Slett "width: 660px;" linje. Etterpå vil det se omtrent slik ut:

header-wrapper {

margin: 0 auto 10px;

border: 1px solid $ bordercolor;

}

6 Bla ned til "# footer-wrapper" tag. Slett "width: 660px;" linje for å fjerne bunnbredde.

7 Bla ned til "#header .description" tag. Slett "max-width: 700 piksler;" linjen under for å sentrere bloggen beskrivelse.

8 Bla ned til "# blog-personsøker" tag. Legg til følgende to linjer med kode under det:

blogg-personsøker {

width: 600px;

klar: begge;

text-align: center;

}

Lagre bloggmalen.

Endre blogginnlegg

9 Sjekk "Utvid Widget Maler" boksen. Finn følgende kode i malen:

<B: hvis dirigent = 'data: post.dateHeader'>

<H2 class = "date-header '> <data: post.dateHeader /> </ h2>

</ B: hvis>

Marker koding. Høyreklikk og velg "Cut" fra rullegardinmenyen. Det kan være lurt å kopiere den til Notisblokk.

10 Finn følgende linje koding:

<a expr:name='data:post.id'/>

Plasser markøren på linjen etter den. Høyreklikk og velg "Lim inn" fra rullegardinmenyen. Kodingen fra trinn 1 pastaer.

11 Finn den avsluttende "</ b: hud>" tag i malen. Skriv inn følgende koding umiddelbart etter det:

<B: hvis dirigent = "data: blog.pageType =" element "">

<Style>

.post {width: 290px; margin-right: 20px; float: left; overflow: hidden;}

</ Style>

</ B: hvis>

12 Klikk på den oransje "Lagre mal" -knappen. Klikk på bloggnavnet for å se bloggen.