Pretty baby spin-doktorer http://1apotekonline.com/cialis/ sterling sølv pille kasse
Få en snygg ram runt alla bilder (runda hörn)

Få en snygg ram runt alla bilder (runda hörn)

 

Om du vill piffa till din bloggdesign på ett enkelt sätt, så kan du förändra lite hur dina bilder ser ut på din blogg.

ram runt bild

Genom några enkla rader med kod, så kan du ändra utseendet på dina bilder så att de får en riktigt snygg ram runt dem. Detta gör att du inte behöver skapa ramar i photoshop eller så, utan det sker med automatik om du har laddat upp bilden via din blogg.

Så här ser det ut:

Före

runda ramar runt bild

Efter

bildram runda hörn

Hur gör man för att få till det här då?

Gör så här:

1. Kopiera följande kod:

.image {
background:#F7F5F4;
padding: 11px;
margin: 0px 6px 20px 0px;
-webkit-box-shadow: 1px 1px 2px 1px #aaaaaa;
box-shadow: 1px 1px 2px 1px #aaaaaa; 
-webkit-border-radius: 5px;
border-radius: 5px; 
}

2. Gå in på din blogg och gå in i din stilmall. Lägg till koden längst ner i din stilmall.

kod runda ramar

Spara stilmallen, sen så är det klart!

Simpelt va?

 

Från filmen:

Ram runt bilderna i inlägget

Hej hörni.
Idag så ska jag visa er hur man kan göra med sina bilder i inläggen för att få en ram runt dem. Som ni ser hur då till exempel så har jag bara testat en gång och lagt upp en bild på mig själv här och så har man egna koder som jag till exempel skriver ju alltid mina inlägg i html-läge………… då fungerar det inte om man inte har med det här class-image som ligger här.

Jag kan lägga det……….. men annars så kommer den automatiskt ifall man infogar en bild………verktyget då.

Det ni behöver, det ni gör det är att ta stilmallskoden nedan och så går ni helt sonika in i stilmallen och lägger den längst ner och sen är det färdigt. Då kommer alla bilder som ligger i inlägget som har den här class=image inom citationstecken i sig, alltså i själva koden kommer att styras utav den här image-koden. Med den här image-koden då så kan ni ändra, ni kan ändra allt, ni kan ändra vilken färg det ska vara på skuggan. Det gör ni här på de här a och ni kan ändra färgen som är på själva bakgrunden, om ni tittar här så är det liksom inte helt vitt. Det kan man också ändra och det ändrar man då där och så kan man styra de här bilderna hur man vill egentligen. Det är ju bara att, vad heter det, att testa sig fram.

Vill man styra hur mycket rundad kant det är på dem då är det på de här radius man ska göra det, de är på fem pixlar just nu och man kan testa högre och man kan testa lägre. Det gör man som man vill.

Det var det jag skulle visa er idag så får ni ha det så bra. Hej hej.

Grundare av Designa Din Blogg. Drev den här sidan som ett hobbyprojekt under åtta år, numera har jag lämnat över ansvaret för DDB. Är pappa till Ludvig och make till Elin.

Läs mina andra inlägg

25 comments

  1. SvaraJohanna

    Hej Lari!
    Nu är det såhär att för ett antal månader sedan fick jag en kommentar av dig som löd såhär:
    Hej,Johanna du har en väldigt fin blogg. Och jag måste berätta en glad överaskning du har vunnit Slumpmässig-Blogg tävlingen! Vi har alltså dragit en blogg och sedan har vi bestämt att utse den med En helt ny fräch design av en proffs designer om du vill förstås.

    Du kan svara ja genom att kopiera denna kommentar och klistra in den i ett inlägg på din blogg och skriva: “Jag är inte rädd jag står upp för vem jag är”. Tack. Och grattis.

    Jag har skrivit “jag är inte rädd, jag står upp för vem jag är” men inget har hänt, jag har inte blivit kontaktad och inte då har jag fått någon bloggdesign heller.

    Vad ska jag göra lixom? Hoppas jag får svar! Mejla gärna ett svar!!


    1. Author
      SvaraLari

      Hej!
      Du har nog blivit utsatt för någon som utger sig för att vara jag, för något sådant har jag aldrig haft här på DDB.
      Så, tyvärr så är det inget som jag kan göra mer än beklaga att du blivit lurad av någon.

      1. Tina

        Jag får det heller inte att funka….
        Har kopierat in i stilmallen längst ner och sparat.

        Sen går jag till nytt inlägg och laddar upp ny bild från min dator men där blir ingen ram runt….

        Vad gör jag för fel???

    1. SvaraAnneli

      Kan vara bra att veta att Internet Explorer inte stödjer runda hörn eller skuggor, så använder du det ser du inte förändringen. De som besöker din blogg i Firefox eller Google Chrome ser det däremot…

  2. Svarasophie

    Hej. Mitt namn är Sophie och jag laddade ner en av era blogg designern vid namn photography2 .
    Jag är jätte nöjd men min fråga är hur jag tar bort adifly annonserna som tillkom?. Det är i princip omöjligt för mina läsare att kunna kommentera. Tack på förhand / Sophie


    1. Author
      SvaraLari

      Hej!
      Jag har uppdaterat filerna till den designen… så ladda ner den igen och installera på nytt.
      Jag hade missat att skaparen av designen hade lagt in ett script som gjorde att det dök upp en massa annonser som inte skall vara där!

  3. SvaraMartina

    Kan någon publicera koden här i kommentarsfältet? Min dator är knas och jag kan inte kopiera de svarta koderna.

    1. Svaracamilla

      .image {
      background:#F7F5F4;
      padding: 11px;
      margin: 0px 6px 20px 0px;
      -webkit-box-shadow: 1px 1px 2px 1px #aaaaaa;
      box-shadow: 1px 1px 2px 1px #aaaaaa;
      -webkit-border-radius: 5px;
      border-radius: 5px;
      }

    1. SvaraMilla

      Du klickar på inställningar-knappen och då hamnar du direkt på “blogginställningar”
      Där det står” beskrivning” skriver du det.
      Dock hamnar det på bloggens startsida också så ifall det bara är något kort man ska skriva rekommenderar jag att skriva det med ett bindestreck o mellanslag på “Bloggnamn istället.

  4. SvaraMimmi

    Nu vill jag verkligen inte värka otacksam men hur tar man bort ramarna på bilderna i inläggen. Tack på förhand C:

  5. SvaraTess

    När jag laggt in denna kåd, blir det inte ram runt alla bilder. Eller så är bilden större en ramen.
    Vad ska jag göra?
    MVH Tess

  6. Svarahanna öhman

    hej, jag har google chrome och jag har provat flera gånger på flera olika datorer att kopiera den där koden och klistrat in den längst ner på stilmallen. sparat och lagt upp flera bilder men det händer ingenting!

  7. SvaraLollo

    Det här kanske inte har med inlägget att göra… Men jag hittade inget inlägg som passar bättre…

    I alla fall så undrar jag har man gör en skugga på insidan av sina bilder. Jag har försökt men att göra en vanlig box shadow och lägga till inset, men det fungerar inte. Jag har försökt googla på hur man kan fixa det och vad det beror på. Det verkar som att det beror på att skuggan hamnar under bilden eller nå sånt. Dom lösningar jag har hittat är att göra en tom div över bilden, men det verkar bara funka om man vill göra det på en specifik bild som man laggt in i kodmallen, inte att göra på alla bilder i inläggen. Kan du snälla göra ett inlägg om det går att fixa och hur isf? Skulle hjälpa mig jättemycket!

  8. SvaraLollo

    Det här kanske inte har med inlägget att göra… Men jag hittade inget inlägg som passar bättre…

    I alla fall så undrar jag har man gör en skugga på insidan av sina bilder. Jag har försökt men att göra en vanlig box shadow och lägga till inset, men det fungerar inte. Jag har försökt googla på hur man kan fixa det och vad det beror på. Det verkar som att det beror på att skuggan hamnar under bilden eller nå sånt. Dom lösningar jag har hittat är att göra en tom div över bilden och glr skuggan på den ist, men det verkar bara funka om man vill göra det på en specifik bild som man laggt in i kodmallen, inte att göra på alla bilder i inläggen. Kan du snälla göra ett inlägg om det går att fixa och hur isf? Skulle hjälpa mig jättemycket!

  9. Svaraemmawe

    jag provar det här om och om igen men det funkar inte. har jag råkat radera något nödvändigt som inte innehåller koden ni gav ut utan på kodmallar eller så ? skulle bli sjukt glad för svar för jag vet inte vad jag råkat göra fel eller tagit bort.

Lämna ett svar

E-postadressen publiceras inte. Obligatoriska fält är märkta *